精华内容
下载资源
问答
  • 这篇博客将对WPF ItemsControl, ListBox, ListView进行比较。 相同点: 1. 这三个控件都是列表型控件,可以进行列表绑定(ItemsSource); 2. 这三个控件均使用ItemsPresenter来展示列表信息; 不同点: 控件层次...

    在进行列表信息展示时,WPF中提供多种列表可供选择。这篇博客将对WPF ItemsControl, ListBox, ListView进行比较。

    相同点:

    1. 这三个控件都是列表型控件,可以进行列表绑定(ItemsSource);

    2. 这三个控件均使用ItemsPresenter来展示列表信息;

    不同点:

    控件层次关系:

    ItemsControl:

    System.Object
      System.Windows.Threading.DispatcherObject
        System.Windows.DependencyObject
          System.Windows.Media.Visual
            System.Windows.UIElement
              System.Windows.FrameworkElement
                System.Windows.Controls.Control
                  System.Windows.Controls.ItemsControl

    ListBox:

    System.Object
      System.Windows.Threading.DispatcherObject
        System.Windows.DependencyObject
          System.Windows.Media.Visual
            System.Windows.UIElement
              System.Windows.FrameworkElement
                System.Windows.Controls.Control
                  System.Windows.Controls.ItemsControl
                    System.Windows.Controls.Primitives.Selector
                      System.Windows.Controls.ListBox

    ListBox 继承于ItemsControl,增加了一个Selector对象,ItemsControl中的Item是不支持选择的。而ListBox中Item是支持选择,并且可以单选,多选。

    ListView:

    System.Object
      System.Windows.Threading.DispatcherObject
        System.Windows.DependencyObject
          System.Windows.Media.Visual
            System.Windows.UIElement
              System.Windows.FrameworkElement
                System.Windows.Controls.Control
                  System.Windows.Controls.ItemsControl
                    System.Windows.Controls.Primitives.Selector
                      System.Windows.Controls.ListBox
                        System.Windows.Controls.ListView

    ListView继承与ListBox,增加了一个View依赖属性。

    ItemsControl是不包含水平和垂直方向的滚动条的。ListBox和ListView有水平和垂直方向滚动条。

    ItemControl的样式:

    复制代码
    <ResourceDictionary
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <Style x:Key="ItemsControlDefaultStyle" TargetType="{x:Type ItemsControl}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ItemsControl}">
                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" 
    

    Padding="{TemplateBinding Padding}" SnapsToDevicePixels=“true”>
    <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
    </Border>
    </ControlTemplate>
    </Setter.Value>
    </Setter>
    </Style>
    <!– Resource dictionary entries should be defined here. –>
    </ResourceDictionary>

    复制代码

    ListBox和ListView的样式基本一样,除了TargetType外,

    复制代码
    <ResourceDictionary
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <SolidColorBrush x:Key="ListBorder" Color="#828790"/>
        <Style x:Key="ListBoxDefaultStyle" TargetType="{x:Type ListBox}">
            <Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
            <Setter Property="BorderBrush" Value="{StaticResource ListBorder}"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
            <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
            <Setter Property="ScrollViewer.PanningMode" Value="Both"/>
            <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBox}">
                        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="1" 
    

    SnapsToDevicePixels=“true”>
    <ScrollViewer Focusable=“false” Padding="{TemplateBinding Padding}">
    <ItemsPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
    </ScrollViewer>
    </Border>
    <ControlTemplate.Triggers>
    <Trigger Property=“IsEnabled” Value=“false”>
    <Setter Property=“Background” TargetName=“Bd” Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
    </Trigger>
    <Trigger Property=“IsGrouping” Value=“true”>
    <Setter Property=“ScrollViewer.CanContentScroll” Value=“false”/>
    </Trigger>
    </ControlTemplate.Triggers>
    </ControlTemplate>
    </Setter.Value>
    </Setter>
    </Style>
    <!– Resource dictionary entries should be defined here. –>
    </ResourceDictionary>

    复制代码

    在项目中如何选择使用这三个控件;

    1. 如果列表信息只做展示,但不提供选择功能,可以使用ItemsControl;

    2. ListView比ListBox增加了一个View属性。

    示例代码:

    ItemsControl vs ListBox (Selector)

    复制代码
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
    
        <span style="color: #008000;">&lt;!--</span><span style="color: #008000;">ItemsControl</span><span style="color: #008000;">--&gt;</span>
        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">TextBlock </span><span style="color: #ff0000;">Text</span><span style="color: #0000ff;">="ItemsControl"</span><span style="color: #ff0000;"> FontSize</span><span style="color: #0000ff;">="18"</span><span style="color: #0000ff;">/&gt;</span>
    
            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsControl </span><span style="color: #ff0000;">ItemsSource</span><span style="color: #0000ff;">="</span><span style="color: #808000;">{Binding .}</span><span style="color: #0000ff;">"</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsControl.ItemTemplate</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">DataTemplate</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Grid</span><span style="color: #0000ff;">&gt;</span>
                            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Ellipse </span><span style="color: #ff0000;">Width</span><span style="color: #0000ff;">="110"</span><span style="color: #ff0000;"> Height</span><span style="color: #0000ff;">="55"</span><span style="color: #ff0000;"> Fill</span><span style="color: #0000ff;">="#ebebee"</span><span style="color: #0000ff;">/&gt;</span>
    
                            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
                                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">TextBlock </span><span style="color: #ff0000;">Text</span><span style="color: #0000ff;">="</span><span style="color: #808000;">{Binding Priority}</span><span style="color: #0000ff;">"</span><span style="color: #ff0000;"> FontSize</span><span style="color: #0000ff;">="16"</span><span style="color: #ff0000;"> HorizontalAlignment</span><span style="color: #0000ff;">="Center"</span><span style="color: #0000ff;">/&gt;</span>
                                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">TextBlock </span><span style="color: #ff0000;">Text</span><span style="color: #0000ff;">="</span><span style="color: #808000;">{Binding Name}</span><span style="color: #0000ff;">"</span><span style="color: #ff0000;"> FontSize</span><span style="color: #0000ff;">="16"</span><span style="color: #ff0000;"> HorizontalAlignment</span><span style="color: #0000ff;">="Center"</span><span style="color: #0000ff;">/&gt;</span>
                            <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">Grid</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">DataTemplate</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ItemsControl.ItemTemplate</span><span style="color: #0000ff;">&gt;</span>
    
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsControl.ItemsPanel</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsPanelTemplate</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">WrapPanel </span><span style="color: #0000ff;">/&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ItemsPanelTemplate</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ItemsControl.ItemsPanel</span><span style="color: #0000ff;">&gt;</span>
    
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsControl.ItemContainerStyle</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Style</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Setter </span><span style="color: #ff0000;">Property</span><span style="color: #0000ff;">="Control.Margin"</span><span style="color: #ff0000;"> Value</span><span style="color: #0000ff;">="5"</span><span style="color: #0000ff;">/&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">Style</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ItemsControl.ItemContainerStyle</span><span style="color: #0000ff;">&gt;</span>
            <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ItemsControl</span><span style="color: #0000ff;">&gt;</span>
        <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
    
        <span style="color: #008000;">&lt;!--</span><span style="color: #008000;">ListBox</span><span style="color: #008000;">--&gt;</span>
        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">StackPanel </span><span style="color: #ff0000;">Grid.Row</span><span style="color: #0000ff;">="1"</span><span style="color: #0000ff;">&gt;</span>
            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">TextBlock </span><span style="color: #ff0000;">Text</span><span style="color: #0000ff;">="ListBox"</span><span style="color: #ff0000;"> FontSize</span><span style="color: #0000ff;">="18"</span><span style="color: #0000ff;">/&gt;</span>
            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ListBox </span><span style="color: #ff0000;">ItemsSource</span><span style="color: #0000ff;">="</span><span style="color: #808000;">{Binding .}</span><span style="color: #0000ff;">"</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ListBox.ItemTemplate</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">DataTemplate</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Grid</span><span style="color: #0000ff;">&gt;</span>
                            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Ellipse </span><span style="color: #ff0000;">Width</span><span style="color: #0000ff;">="110"</span><span style="color: #ff0000;"> Height</span><span style="color: #0000ff;">="55"</span><span style="color: #ff0000;"> Fill</span><span style="color: #0000ff;">="#ebebee"</span><span style="color: #0000ff;">/&gt;</span>
    
                            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
                                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">TextBlock </span><span style="color: #ff0000;">Text</span><span style="color: #0000ff;">="</span><span style="color: #808000;">{Binding Priority}</span><span style="color: #0000ff;">"</span><span style="color: #ff0000;"> FontSize</span><span style="color: #0000ff;">="16"</span><span style="color: #ff0000;"> HorizontalAlignment</span><span style="color: #0000ff;">="Center"</span><span style="color: #0000ff;">/&gt;</span>
                                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">TextBlock </span><span style="color: #ff0000;">Text</span><span style="color: #0000ff;">="</span><span style="color: #808000;">{Binding Name}</span><span style="color: #0000ff;">"</span><span style="color: #ff0000;"> FontSize</span><span style="color: #0000ff;">="16"</span><span style="color: #ff0000;"> HorizontalAlignment</span><span style="color: #0000ff;">="Center"</span><span style="color: #0000ff;">/&gt;</span>
                            <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">Grid</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">DataTemplate</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ListBox.ItemTemplate</span><span style="color: #0000ff;">&gt;</span>
    
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ListBox.ItemsPanel</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsPanelTemplate</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">/&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ItemsPanelTemplate</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ListBox.ItemsPanel</span><span style="color: #0000ff;">&gt;</span>
    
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ListBox.ItemContainerStyle</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Style</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Setter </span><span style="color: #ff0000;">Property</span><span style="color: #0000ff;">="Control.Width"</span><span style="color: #ff0000;"> Value</span><span style="color: #0000ff;">="120"</span><span style="color: #0000ff;">/&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Setter </span><span style="color: #ff0000;">Property</span><span style="color: #0000ff;">="Control.Margin"</span><span style="color: #ff0000;"> Value</span><span style="color: #0000ff;">="5"</span><span style="color: #0000ff;">/&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">Style</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ListBox.ItemContainerStyle</span><span style="color: #0000ff;">&gt;</span>
    
                <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ListBox.Template</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ControlTemplate</span><span style="color: #0000ff;">&gt;</span>
                        <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ScrollViewer </span><span style="color: #ff0000;">HorizontalScrollBarVisibility</span><span style="color: #0000ff;">="Auto"</span><span style="color: #ff0000;"> VerticalScrollBarVisibility</span><span style="color: #0000ff;">="Auto"</span><span style="color: #0000ff;">&gt;</span>
                            <span style="color: #0000ff;">&lt;</span><span style="color: #800000;">ItemsPresenter</span><span style="color: #0000ff;">/&gt;</span>
                        <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ScrollViewer</span><span style="color: #0000ff;">&gt;</span>
                    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ControlTemplate</span><span style="color: #0000ff;">&gt;</span>
                <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ListBox.Template</span><span style="color: #0000ff;">&gt;</span>
            <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">ListBox</span><span style="color: #0000ff;">&gt;</span>
        <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">StackPanel</span><span style="color: #0000ff;">&gt;</span>
    <span style="color: #0000ff;">&lt;/</span><span style="color: #800000;">Grid</span><span style="color: #0000ff;">&gt;</span></pre>
    
    复制代码

    C#

    复制代码
        public class Task
        {
            public string Name { get; set; }
    
        public int Priority { get; set; }
    }
    
    ObservableCollection</span><span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Task</span><span style="color: #0000ff;">&gt;</span><span style="color: #000000;"> _tasks = null;
    public MainWindow()
    {
        InitializeComponent();
    
        _tasks = new ObservableCollection</span><span style="color: #0000ff;">&lt;</span><span style="color: #800000;">Task</span><span style="color: #0000ff;">&gt;</span><span style="color: #000000;">()
        {
            new Task() { Name = "Shopping",Priority = 2 },
            new Task() { Name = "Laundry",Priority = 2 },
            new Task() { Name = "Email",Priority = 1 },
            new Task() { Name = "Writting",Priority = 2 },
            new Task() { Name = "Learning",Priority = 2 },
            new Task() { Name = "Working",Priority = 2 },
        };
    
        DataContext = _tasks;
    }</span></pre>
    
    复制代码

    运行效果:

    ListView View属性的使用

    复制代码
    <ListView ItemsSource="{Binding .}">
        <ListView.View>
            <GridView>
                <GridView.Columns>
                    <GridViewColumn Header="Task Name" DisplayMemberBinding="{Binding Name}" Width="100"/>
                    <GridViewColumn Header="Task Priority" DisplayMemberBinding="{Binding Priority}" Width="100"/>
                </GridView.Columns>
            </GridView>
        </ListView.View>
    </ListView>
    复制代码

    运行效果:

    感谢您的阅读,代码点击这里下载。

    展开全文
  • listBoxlistView实现不同的效果...
  • wpf修改ListViewListBox风格,介绍了在wpfListViewListBox的使用
  • WPF ListViewListBox(选中)项样式

    千次阅读 2020-02-05 14:40:40
    WPF ListViewListBox(选中)项自定义样式 想用ListBox或者ListView控件,做一个菜单栏等,却发现很难改变ListBoxItem/ListViewItem项在鼠标移过、选中的默认蓝色背景与边框。 首先尝试使用控件的Style来设置...

    WPF ListView与ListBox(选中)项自定义样式

    想用ListBox或者ListView控件,做一个菜单栏等,却发现很难改变ListBoxItem/ListViewItem项在鼠标移过、选中的默认蓝色背景与边框。

    首先尝试使用控件的Style来设置ItemTemplate上的Triggers,结果时不成功。

    经过查资料发现很少,最后在自定义List项时,发现对ListBoxItem/ListViewItem进行样式设计可以改变项的样式。具体实现如下所示。

    ListViewItem

    废话不说,我们首先上代码。

    1.在资源模块中定义好我们的Item样式

    					<Style x:Key="FocusVisual">
                            <Setter Property="Control.Template">
                                <Setter.Value>
                                    <ControlTemplate>
                                        <Rectangle Margin="0" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="0" StrokeDashArray="1 2"/>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                        <!-- Item项相关颜色 -->
                        <SolidColorBrush x:Key="Item.MouseOver.Background" Color="#DADADA"/>
                        <SolidColorBrush x:Key="Item.MouseOver.Border" Color="#3DDADADA"/>
                        <SolidColorBrush x:Key="Item.SelectedInactive.Background" Color="#FF0B7AFF"/>
                        <SolidColorBrush x:Key="Item.SelectedInactive.Border" Color="#3DDADADA"/>
                        <SolidColorBrush x:Key="Item.SelectedInactive.Foreground" Color="#FFFFFFFF"/>
                        <SolidColorBrush x:Key="Item.SelectedActive.Background" Color="#FF0B7AFF"/>
                        <SolidColorBrush x:Key="Item.SelectedActive.Border" Color="#FF0B7AFF"/>
                        <SolidColorBrush x:Key="Item.SelectedActive.Foreground" Color="#FFFFFFFF"/>
    
                        <!-- Item项样式 -->
                        <Style TargetType="{x:Type ListViewItem}">
                            <Setter Property="HorizontalContentAlignment" Value="Center"/>
    
                            <Setter Property="SnapsToDevicePixels" Value="True"/>
                            <Setter Property="Padding" Value="4,1"/>
                            <Setter Property="Background" Value="Transparent"/>
                            <Setter Property="Foreground" Value="Black"/>
                            <Setter Property="BorderBrush" Value="Transparent"/>
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                                            <ContentControl x:Name="Ct" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                            </ContentControl>
                                        </Border>
                                        <ControlTemplate.Triggers>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="IsMouseOver" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.MouseOver.Background}"/>
                                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.MouseOver.Border}"/>
                                            </MultiTrigger>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="Selector.IsSelectionActive" Value="False"/>
                                                    <Condition Property="IsSelected" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Background}"/>
                                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Border}"/>
                                                <Setter Property="Foreground" TargetName="Ct" Value="{StaticResource Item.SelectedInactive.Foreground}"/>
                                            </MultiTrigger>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="Selector.IsSelectionActive" Value="True"/>
                                                    <Condition Property="IsSelected" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Background}"/>
                                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Border}"/>
                                                <Setter Property="Foreground" TargetName="Ct" Value="{StaticResource Item.SelectedActive.Foreground}"/>
                                            </MultiTrigger>
                                            <Trigger Property="IsEnabled" Value="False">
                                                <Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                            </Trigger>
                                        </ControlTemplate.Triggers>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
    

    2.样式应用

        			<ListView Margin="2,5"
                              ItemsSource="{Binding Path=MelphiDataSource,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}}">
                        <ListView.Template>
                            <ControlTemplate TargetType="ListView">
                                <Border CornerRadius="15"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            BorderBrush="{TemplateBinding BorderBrush}">
                                    <Border.OpacityMask>
                                        <VisualBrush>
                                            <VisualBrush.Visual>
                                                <Border SnapsToDevicePixels="True"
                                            Background="Black"
                                            CornerRadius="{Binding CornerRadius, RelativeSource={RelativeSource AncestorType=Border}}"
                                            Width="{Binding ActualWidth, RelativeSource={RelativeSource AncestorType=Border}}"
                                            Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType=Border}}"/>
                                            </VisualBrush.Visual>
                                        </VisualBrush>
                                    </Border.OpacityMask>
                                    <ItemsPresenter>
    
                                    </ItemsPresenter>
                                </Border>
                            </ControlTemplate>
                        </ListView.Template>
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <UniformGrid Rows="1"/>
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <Grid Background="#01000000">
                                    <Grid.ToolTip>
                                        <StackPanel MinWidth="200">
                                            <TextBlock Text="{Binding Name, Mode=OneWay}"
                                                       FontWeight="Bold"/>
    
                                            <TextBlock Text="{Binding SelectedValue, Mode=OneWay}"/>
                                        </StackPanel>
                                    </Grid.ToolTip>
    
                                    <TextBlock Text="{Binding Name}" >
                                        <TextBlock.Style>
                                            <Style TargetType="{x:Type TextBlock}" >
                                                <Setter Property="Margin" Value="0"/>
                                                <Setter Property="HorizontalAlignment" Value="Center"/>
                                                <Setter Property="VerticalAlignment" Value="Center"/>
                                                <Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType=ContentControl}}"/>
                                            </Style>
                                        </TextBlock.Style>
                                    </TextBlock>
                                </Grid>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
    

    3.数据模型定义与绑定

     /// <summary>
        /// ListViewsView.xaml 的交互逻辑
        /// </summary>
        public partial class ListViewsView : UserControl
        {
            public ListViewsView()
            {
                InitializeComponent();
    
                // 获取数据源
                MelphiDataSource = MelphiDataService.GetDataSource();
            }
    
            private ObservableCollection<MelphiDataItem> melphiDataSource = new ObservableCollection<MelphiDataItem>();
    
            /// <summary>
            /// 数据源
            /// </summary>
            public ObservableCollection<MelphiDataItem> MelphiDataSource
            {
                get
                {
                    return melphiDataSource;
                }
                set
                {
                    melphiDataSource = value;
                }
            }
        }
    
        /// <summary>
        /// 数据服务
        /// </summary>
        public class MelphiDataService
        {
            /// <summary>
            /// 模拟获取数据源
            /// </summary>
            /// <returns></returns>
            public static ObservableCollection<MelphiDataItem> GetDataSource()
            {
                ObservableCollection<MelphiDataItem> melphiDatas = new ObservableCollection<MelphiDataItem>();
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataA",
                    IsEnabled = true,
                    SelectedValue = "Kea",
                    SelectionSource = new List<string>() { "Kea", "Lau", "Nuh" }
                });
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataB",
                    IsEnabled = true,
                    SelectedValue = "Lau",
                    SelectionSource = new List<string>() { "Kea", "Lau", "Nuh" }
                });
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataC",
                    IsEnabled = true,
                    SelectedValue = "invalid",
                    SelectionSource = new List<string>() { "invalid", "valid" }
                });
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataD",
                    IsEnabled = true,
                    SelectedValue = "invalid",
                    SelectionSource = new List<string>() { "invalid", "valid" }
                });
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataE",
                    IsEnabled = false,
                    SelectedValue = "0",
                    SelectionSource = new List<string>() { "0", "1", "2", "3", "4", "5", "6" }
                });
    
                var listsource = new List<string>();
                for (int i = 0; i <= 200; i+=20)
                {
                    listsource.Add(i.ToString());
                }
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataF",
                    IsEnabled = true,
                    SelectedValue = "100",
                    SelectionSource = listsource
                });
    
                melphiDatas.Add(new MelphiDataItem()
                {
                    Name = "DataG",
                    IsEnabled = true,
                    SelectedValue = "3",
                    SelectionSource = new List<string>() { "0", "1", "2", "3", "4", "5", "6" }
                });
    
                return melphiDatas;
            }
        }
    
    
        /// <summary>
        /// 数据项
        /// </summary>
        public class MelphiDataItem
        {
            /// <summary>
            /// 数据名称
            /// </summary>
            public string Name { get; set; }
    
            /// <summary>
            /// 数据标识
            /// </summary>
            public bool IsEnabled { get; set; }
    
            /// <summary>
            /// 设定值
            /// </summary>
            public string SelectedValue { get; set; }
    
            /// <summary>
            /// 设定值选定项集合
            /// </summary>
            public List<string> SelectionSource { get; set; }
    
        }
    

    4.效果

    在这里插入图片描述

    ListBoxItem

    对ListBox的项ListBoxItem而言,其定义和使用方式和ListViewItem几乎相同,其区别只是在于其类型为ListBoxItem。这里只展示ListBoxItem的定义,如下:

                        <Style x:Key="FocusVisual">
                            <Setter Property="Control.Template">
                                <Setter.Value>
                                    <ControlTemplate>
                                        <Rectangle Margin="0" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="0" StrokeDashArray="1 2"/>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                        <!-- Item项相关颜色 -->
                        <SolidColorBrush x:Key="Item.MouseOver.Background" Color="#DADADA"/>
                        <SolidColorBrush x:Key="Item.MouseOver.Border" Color="#3DDADADA"/>
                        <SolidColorBrush x:Key="Item.SelectedInactive.Background" Color="#FF0B7AFF"/>
                        <SolidColorBrush x:Key="Item.SelectedInactive.Border" Color="#3DDADADA"/>
                        <SolidColorBrush x:Key="Item.SelectedInactive.Foreground" Color="#FFFFFFFF"/>
                        <SolidColorBrush x:Key="Item.SelectedActive.Background" Color="#FF0B7AFF"/>
                        <SolidColorBrush x:Key="Item.SelectedActive.Border" Color="#FF0B7AFF"/>
                        <SolidColorBrush x:Key="Item.SelectedActive.Foreground" Color="#FFFFFFFF"/>
    
                        <!-- Item项样式 -->
                        <Style TargetType="{x:Type ListBoxItem}">
                            <Setter Property="HorizontalContentAlignment" Value="Center"/>
    
                            <Setter Property="SnapsToDevicePixels" Value="True"/>
                            <Setter Property="Padding" Value="4,1"/>
                            <Setter Property="Background" Value="Transparent"/>
                            <Setter Property="Foreground" Value="Black"/>
                            <Setter Property="BorderBrush" Value="Transparent"/>
                            <Setter Property="BorderThickness" Value="0"/>
                            <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                                        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                                            <ContentControl x:Name="Ct" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                            </ContentControl>
                                        </Border>
                                        <ControlTemplate.Triggers>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="IsMouseOver" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.MouseOver.Background}"/>
                                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.MouseOver.Border}"/>
                                            </MultiTrigger>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="Selector.IsSelectionActive" Value="False"/>
                                                    <Condition Property="IsSelected" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Background}"/>
                                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Border}"/>
                                                <Setter Property="Foreground" TargetName="Ct" Value="{StaticResource Item.SelectedInactive.Foreground}"/>
                                            </MultiTrigger>
                                            <MultiTrigger>
                                                <MultiTrigger.Conditions>
                                                    <Condition Property="Selector.IsSelectionActive" Value="True"/>
                                                    <Condition Property="IsSelected" Value="True"/>
                                                </MultiTrigger.Conditions>
                                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Background}"/>
                                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Border}"/>
                                                <Setter Property="Foreground" TargetName="Ct" Value="{StaticResource Item.SelectedActive.Foreground}"/>
                                            </MultiTrigger>
                                            <Trigger Property="IsEnabled" Value="False">
                                                <Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                            </Trigger>
                                        </ControlTemplate.Triggers>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
    

    总结

    在自定义控件样式,要学会使用VS提供的XAML模板编辑。其使用方法,在XAML的设计界面找到控件,然后右键–>编辑样式–>编辑副本。然后按照要求编辑生成一个默认的副本样式,认真学习并根据副本去设计自己样式。我相信,只要你肯努力和善于思考,你会变得更优秀。


    Over

    每次记录一小步…点点滴滴人生路…

    展开全文
  • <ListBox.ItemTemplate> " {Binding} " > </ListBox.ItemTemplate> </ListBox> <ListBox x:Name= " mb2 " Height= " 100 " > <ListBox.ItemTemplate> " {Binding} " > </ListBox.ItemTemplate> ...
    在网上很难找最简单的案例,都是一大片,看着都头疼;

    试试举一反三,如果把结果赋给DataContext这个属性,那就前台需要绑定ItemsSource="{Binding}",请注意。直接赋给ItemsSourc就不要绑定了;

    后台代码:
     List<string> list = new List<string>();
                for (int i = 0; i < 100; i++)
                {
                    list.Add("sas" + i);
                }
                this.mb.DataContext = list;
    
                List<string> mb2 = new List<string>();
                for (int i = 0; i < 100; i++)
                {
                    mb2.Add("mb2 -> " + i);
                }
                this.mb2.ItemsSource = mb2;       

     

    前台代码:
    <ListBox ItemsSource="{Binding}" x:Name="mb" Height="100">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Label Content="{Binding}"></Label>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
    
    <ListBox x:Name="mb2" Height="100">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Label Content="{Binding}"></Label>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

     

    转载于:https://www.cnblogs.com/kouweihong/p/5880454.html

    展开全文
  • ListBoxListView中子项全填充去除边线问题

    一、场景

    对于自定义集合类控件样式时,经常会遇到的一个问题就是,定义好子项样式后,添加到集合控件中时,发现和实际设计的样式存在细节偏差,子项并没有能够按照预期方式实现全填充,存在着部分的线条或者空白间隙。

    原始xaml

    <ListView SelectedIndex="0">
        <ListViewItem local:ControlExtensions.Data="{StaticResource bingren}" Content="病人管理"/>
        <ListViewItem local:ControlExtensions.Data="{StaticResource chuangwei}" Content="床位管理"/>
        <ListViewItem local:ControlExtensions.Data="{StaticResource yihu}" Content="医护管理"/>
        <ListViewItem local:ControlExtensions.Data="{StaticResource baobiao}" Content="报表管理"/>
        <ListViewItem local:ControlExtensions.Data="{StaticResource shebei}" Content="设备管理"/>
        <ListViewItem local:ControlExtensions.Data="{StaticResource xitong}" Content="系统设置"/>
        <!--<ListView.Template>
            <ControlTemplate>
                <ItemsPresenter></ItemsPresenter>
            </ControlTemplate>
        </ListView.Template>-->
    </ListView>
    

    运行效果:

    WPF-ListView-Border

    去除Border,设置BorderThickness宽度为0

    <ListView SelectedIndex="0" BorderThickness="0">
       ......
    </ListView>
    

    运行效果:

    WPF-ListView-Border-0

    二、解决方案

    实际通过比较可以发现,子项的右端存在着一个间距大约一个像素的间隙,内部子项并不是全填充,然后就遇到现在的问题,如何让子项全填充?一下为笔者找到的最佳方案-----重写ListView对应的Template,剔除控件自身的默认布局,以下为具体方案:

    重写ListBoxListView对应的Template

    <ListView>
        <ListViewItem IsSelected="True" local:ControlExtensions.Data="{StaticResource xitong}" Content="系统设置"/>
        <ListView.Template>
            <ControlTemplate>
                <ItemsPresenter></ItemsPresenter>
            </ControlTemplate>
        </ListView.Template>
    </ListView>
    

    运行效果:

    WPF-ListView-Template

    展开全文
  • 今天碰到一个需求,使用ListBox显示多文字。因为每个选项文字较长,ListBoxItem的宽度有限,这时候为了体现界面友好,增加ToolTip是一个好的选择:代码如下: MainWindow.xmal: <Window x:Class="_20200116_...
  • WPF 显示文件列表中使用 ListBox 变到ListView 最后使用DataGrid 故事背景:  需要检索某目录下文件,并列出来,提供选择和其他功能。 第一版需求:  列出文件供选择即可,代码如下: <ListBox ...
  • WPF listBox listview去掉滚动条

    千次阅读 2013-09-04 16:07:13
    <ListBox ScrollViewer.HorizontalScrollBarVisibility="Visible"></ListBox> <ListBox ScrollViewer.VerticalScrollBarVisibility="Visible"></ListBox> 或
  • 针对WPFListView的基础样式进行模板重写,可以选择去除ListView的背景颜色或添加自己想要的选中时或者鼠标移上去选择项的背景颜色
  • ItemsControl、ListBoxListView这三种控件在WPF中都可作为列表信息展示控件。我们可以通过修改这三个控件的样式来展示我们的列表信息。 既然都是展示列表信息的控件,那他们有什么相同点和不同点呢。 同:  1...
  • wpf ListBox 分页显示图片

    热门讨论 2012-12-04 12:04:49
    第一次上传自己的DMEO,望对名位有帮助~~
  • ListBoxListView在应用中,常常有需求关于每页显示固定数量的数据,然后通过Timer自动或者手动翻页操作,本文介绍到的就是该动作的实现。 一.重点  对于ListBoxListView来讲,后台绑定的ItemSource绑定的一般...
  • WPF中,对于ItemsControl本身,默认不包含选中默认样式,内部子项默认是全填充,ListBoxListView子项默认不全填充。
  • WPF listbox内嵌radiobutton

    2020-11-25 11:13:26
    1.xaml中添加Windows.Resource <...Style x:Key="radioButtonStyle" TargetType="{x:Type ListBox}"> <Setter Property="ItemContainerStyle"> <Setter.Value> <Style Ta
  • ListView Name="BoardListView" ScrollViewer.VerticalScrollBarVisibility="Hidden" Height="100" VerticalAlignment="Bottom"> <ListView.ItemsPanel> <ItemsPanelTemplate&...
  • 紧接上一篇《WPF笔记汇总之列表类控件与DataGrid控件》,这篇主要总结WPF中最复杂的控件之一,ListView控件,它类似ListBox和DataGrid,它可以实现上面两个控件的功能,但自定义制定的方式更加自由。
  • /// <summary> /// 自动列表序号 /// </summary>... [ValueConversion(typeof(Int32), typeof(ListViewItem))] public class IndexConverter : IValueConverter { public obje...
  • C# WPF带图标的listbox示例

    千次阅读 2018-05-31 14:25:10
     <ListBox Name="AppListBox" ItemTemplate="{DynamicResource ListBoxTemplate}" Background ="Transparent"   ItemsSource="{Binding MyModel}" ScrollViewer.CanContentScroll="True" Margin="0,0,30,62">  ...
  • wpf实现拖拽效果实例 实现从一个listbox拖拽一条数据放到另外一个listbox
  • WPF ListBox添加右键

    2013-12-10 20:30:52
    WPF ListBox添加右键 一个很小的实例,希望对大家有帮助。
  • ListviewListbox差不多,这里拿Listview举例。 熟悉wpf的人都知道listview里面包含着一个Scrollviewer,想要实现效果最大的难点在于如何获取Listview里的Scrollviewer。 废话不多说, 第一步,为Listview里的...
  • WPF技巧20190722 LIstbox/ListView 自动流动到数据最后一行一.需求:二. 实现方式1. 实现方式一1.1 绑定1.2 自动滚动1.2.1 ViewModel中定义更改列表方法:1.2.2 在主界面后台代码中增加自动滚动条方法:2 实现方式二:...
  • WPFListBox的绑定

    千次阅读 2019-04-30 15:40:04
    WPF中列表式控件派生自ItemsControl类,继承了ItemsSource属性。ItemsSource属性可以接收一个IEnumerable接口派生类的实例作为自己的值(所有可被迭代遍历的集合都实现了这个接口,如数组、List<T>等)。每一...
  • WPF ListView即时更新

    千次阅读 2018-08-07 23:50:00
    原文:WPF ListView即时更新1、ListView 的 ItemSource 使用 BindingList &lt; T &gt;;  注:由于 List &lt; T &gt; 没有实现 INotifyPropertyChanged 接口,  因此若使用 List &lt; T &...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,618
精华内容 647
关键字:

listboxlistviewwpf