wordpress 头像设置seo优化好做吗
ListBox列表控件
ListBox是一个列表控件,用于显示条目类的数据,默认每行只能显示一个内容项,当然,我们可以通过修改它的数据模板,来自定义每一行(元素)的数据外观,达到显示更多数据的目的。
1. 属性分析
ListBox自身的属性比较少,SelectionMode 属性比较重要,它可以决定当前的ListBox控件是单选还是多选,它的值为Extended时,表示用户需要按下shift键才能多选。如果SelectionMode为多选状态,那么多选的结果保存在SelectedItems 属性。
另外,ListBox还自带了滚动条,如果内容超出显示区域,这时滚动条便起作用。
2. ListBox示例
前端代码
<StackPanel><ListBox x:Name="listbox" MinHeight="100" DisplayMemberPath="Name" SelectedValuePath="Age"/><Button Content="查看结果" Click="Button_Click"/><TextBlock x:Name="_TextBlock"/></StackPanel>
后端代码
public partial class MainWindow : Window{public class Person{public string Name { get; set; }public int Age { get; set; }public string Address { get; set; }}public MainWindow(){InitializeComponent();listbox.Items.Add(new Person { Name = "张三", Age = 22, Address = "广东省廉江市车板镇大坝村" });listbox.Items.Add(new Person { Name = "李四", Age = 23, Address = "江西省景德镇市市辖区" });listbox.Items.Add(new Person { Name = "王五", Age = 24, Address = "上海市虹口区" });}private void Button_Click(object sender, RoutedEventArgs e){var selectedItem = listbox.SelectedItem;var selectedValue = listbox.SelectedValue;_TextBlock.Text = $"{selectedItem},{selectedValue}";}}
我们选中ListBox中的李四,然后单点查看结果按钮,SelectedItem属性得到了一个Person类,所以输出的值为Person,而SelectedValue属性得到了李四的年龄,所以输出的结果是23。
注意:
Items属性是一个只读属性,所以我们只能能过Items的Add方法向集合增加元素。
3. ListBoxItem子项
ListBox还有它专门配合业务开发的子项控件——ListBoxItem。ListBoxItem继承于ContentControl内容控件,里面的Content属性可以容纳任意引用类型,也就是说,ListBoxItem也可以容纳任意引用类型,也就是说,ListBox的子项也可以容纳任意的引用类型。
所以,ListBoxItem可以这样使用:
前端
<StackPanel> <ListBox x:Name="listbox"><ListBoxItem><Button Content="这是一个按钮"/></ListBoxItem><ListBoxItem><Border Height="30" Background="Red"/></ListBoxItem><ListBoxItem Content="这是一个字符串"/><ListBoxItem><ProgressBar Maximum="100" Value="50" Height="25" Width="450"/></ListBoxItem>这里直接写字符串<ListBoxItem><StackPanel Orientation="Horizontal"><CheckBox Content="复选框"/><RadioButton Content="单选框 "/></StackPanel></ListBoxItem></ListBox><Button Content="查看结果" Click="Button_Click"/><TextBlock x:Name="textblock" TextWrapping="Wrap"/></StackPanel>
后端
public partial class MainWindow : Window{public MainWindow(){InitializeComponent(); }private void Button_Click(object sender, RoutedEventArgs e){try{var selectedItem = listbox.SelectedItem;var content = ((ContentControl)selectedItem).Content;textblock.Text = $"selectedItem={selectedItem}\r\ncontent={content}";}catch (Exception ex){MessageBox.Show(ex.Message);} }}
如上所示,我们在ListBoxj控件里面实例化了好几个ListBoxItem,但是每个ListBoxItem的Content属性都不一样,有Button,Border ,ProgressBar ,字符串,最后,我们来获取这些选中项的内容。
除了直接写的字符串不能转换之外,其它项的结果,SelectedItem属性总是ListBoxItem,而Content可以是我们设置的其它控制。
ListBoxItem的源码定义:
public class ListBoxItem : ContentControl
{public static readonly DependencyProperty IsSelectedProperty;public static readonly RoutedEvent SelectedEvent;public static readonly RoutedEvent UnselectedEvent;public ListBoxItem();public bool IsSelected { get; set; }public event RoutedEventHandler Selected;public event RoutedEventHandler Unselected;protected override AutomationPeer OnCreateAutomationPeer();protected override void OnMouseEnter(MouseEventArgs e);protected override void OnMouseLeave(MouseEventArgs e);protected override void OnMouseLeftButtonDown(MouseButtonEventArgs e);protected override void OnMouseRightButtonDown(MouseButtonEventArgs e);protected virtual void OnSelected(RoutedEventArgs e);protected virtual void OnUnselected(RoutedEventArgs e);protected internal override void OnVisualParentChanged(DependencyObject oldParent);}
如上所示,可以看到ListBoxItem有一个叫IsSelected属性,表示该项是否被选中,同时,它还有两个事件,分别是Selected选中和Unselected未选中,我们可以去订阅这两个事件,以此来做一些业务。
ListView数据列表控件
ListView继承于ListBox,在ListBox控件的基础上增加了数据视图。从而让我们可以很轻松的设置每一列的标题,以显示某个数据表结构及内容。
1. ListView示例
前端代码:
<Grid><Grid.ColumnDefinitions><ColumnDefinition/><ColumnDefinition Width="200"/></Grid.ColumnDefinitions><ListView Grid.Column="0" x:Name="listview" SelectionChanged="listview_SelectionChanged"><ListView.View><GridView><GridViewColumn Header="姓名" DisplayMemberBinding="{Binding Name}"/><GridViewColumn Header="年龄" DisplayMemberBinding="{Binding Age}"/><GridViewColumn Header="地址" DisplayMemberBinding="{Binding Address}"/></GridView> </ListView.View></ListView><StackPanel Grid.Column="1"><StackPanel Orientation="Horizontal" Margin="5"><TextBlock Text="姓名:"/><TextBlock x:Name="_TextBlockName"/></StackPanel><StackPanel Orientation="Horizontal" Margin="5"><TextBlock Text="年龄:"/><TextBlock x:Name="_TextBlockAge"/></StackPanel><StackPanel Orientation="Horizontal" Margin="5"><TextBlock Text="地址:"/><TextBlock x:Name="_TextBlockAddress"/></StackPanel></StackPanel></Grid>
后端代码
public class Person{public string Name { get; set; }public int Age { get; set; }public string Address { get; set; }}/// <summary>/// MainWindow.xaml 的交互逻辑/// </summary>public partial class MainWindow : Window{public MainWindow(){InitializeComponent();listview.Items.Add(new Person { Name = "张三", Age = 22, Address = "广东省廉江市车板镇大坝村" });listview.Items.Add(new Person { Name = "李四", Age = 23, Address = "江西省景德镇市市辖区" });listview.Items.Add(new Person { Name = "王五", Age = 24, Address = "上海市虹口区" });}private void listview_SelectionChanged(object sender, SelectionChangedEventArgs e){ListView listView = sender as ListView;if (listView == null) return;var person = listView.SelectedItem as Person;if (person == null) return;_TextBlockName.Text = person.Name;_TextBlockAge.Text = person.Age + "岁";_TextBlockAddress.Text = person.Address;}}
2. 分析
首先,我们在前端实例化了一个ListView控件,并为View属性实例化了一个GridView对象,最后为GridView对象实例化了3列GridViewColumn ,分别设置为姓名年龄和地址,特别需要注意的是DisplayMemberBinding属性的写法,这里采用了数据绑定的写法,意思是将ListView控件的数据源的Name属性显示在姓名那一列,Age属性显示在年龄那一列,Address属性显示在地址那一列(我们明确知道ListView数据源的类型就是Person的实例集合)。
事件处理
在ListView控件的SelectionChanged事件中,我们先将sender转成ListView ,再从中获取当前选中项(即person),最后显示详细信息在界面上即可。这样就演示了数据怎么加载显示到ListView,又怎么样从ListView上获取的过程。