zoukankan      html  css  js  c++  java
  • wpf 自定义ListBox

    ListBox的样式比较简单,包括两部分: 

    • ListBoxItem项的样式; 
    • ListBox的样式; 

    完整代码:

    复制代码
    <Style x:Key="DefaultListBoxItem" TargetType="{x:Type ListBoxItem}">
            <Setter Property="Foreground" Value="{StaticResource TextForeground}" />
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <!--<Setter Property="VerticalContentAlignment" Value="Center" />-->
            <Setter Property="MinHeight" Value="25" />
            <Setter Property="Margin" Value="0" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Padding" Value="3,0,0,0" />
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border x:Name="Border" Background="{TemplateBinding Background}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                            <ContentPresenter Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Border" Property="Background" Value="{StaticResource ItemSelectedBackground}" />
                                <Setter Property="Foreground" Value="{StaticResource ItemSelectedForeground}" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Border" Property="Background" Value="{StaticResource ItemMouseOverBackground}" />
                                <Setter Property="Foreground" Value="{StaticResource ItemMouseOverForeground}" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Border" Property="Opacity" Value="{StaticResource DisableOpacity}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    复制代码
    复制代码
    <Style x:Key="DefaultListBox" TargetType="{x:Type ListBox}">
            <Setter Property="BorderBrush" Value="{StaticResource ControlBorderBrush}" />
            <Setter Property="Background" Value="{StaticResource ItemsContentBackground}" />
            <Setter Property="BorderThickness" Value="1" />
            <Setter Property="ItemContainerStyle" Value="{StaticResource DefaultListBoxItem}"></Setter>
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="VirtualizingStackPanel.IsVirtualizing" Value="False"></Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBox}">
                        <Border Name="Border" Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                            <ScrollViewer>
                                <ItemsPresenter />
                            </ScrollViewer>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Border" Property="Opacity" Value="{StaticResource DisableOpacity}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    复制代码

    ListBox默认是支持虚拟化的,当加载大数据时需要开启虚拟化,或者定义一个虚拟化的样式:

    复制代码
    <!--支持虚拟化的ListBox-->
        <Style x:Key="VirtualListBox" TargetType="{x:Type ListBox}" BasedOn="{StaticResource DefaultListBox}">
            <Setter Property="ScrollViewer.CanContentScroll" Value="True" />
            <Setter Property="VirtualizingStackPanel.IsVirtualizing" Value="True"></Setter>
            <Setter Property="VirtualizingStackPanel.VirtualizationMode" Value="Recycling" />
            <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" />
        </Style>
    复制代码
    复制代码
    <ListBox Margin="5" SelectionMode="Multiple"  >
                    <ListBoxItem  Style="{StaticResource RadioButtonListBoxItem}">男</ListBoxItem>
                    <ListBoxItem  Style="{StaticResource RadioButtonListBoxItem}">女</ListBoxItem>
                    <ListBoxItem  Style="{StaticResource RadioButtonListBoxItem}">其他</ListBoxItem>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <CheckBox>2222333333333333333</CheckBox>
                    <TextBox Width="200"></TextBox>
                    <ListBoxItem IsSelected="True">111</ListBoxItem>
                </ListBox>
                <ListBox Margin="5" Grid.Column="1">
                    <ListBoxItem  Style="{StaticResource RadioButtonListBoxItem}">男</ListBoxItem>
                    <ListBoxItem  Style="{StaticResource RadioButtonListBoxItem}">女</ListBoxItem>
                    <ListBoxItem  Style="{StaticResource RadioButtonListBoxItem}">其他</ListBoxItem>
                </ListBox>
    复制代码

    另外提供一个比较常用的需求,ListBox单选RadioButton效果样式,如上图右边的那个ListBox效果: 

    复制代码
    <Style x:Key="RadioButtonListBoxItem" TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource DefaultListBoxItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border x:Name="Border" Background="{TemplateBinding Background}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                            <RadioButton  IsChecked="{Binding IsSelected,RelativeSource={RelativeSource TemplatedParent},Mode=TwoWay}">
                                <RadioButton.Content>
                                    <ContentPresenter Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                                </RadioButton.Content>
                            </RadioButton>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Border" Property="Background" Value="{StaticResource ItemSelectedBackground}" />
                                <Setter Property="Foreground" Value="{StaticResource ItemSelectedForeground}" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Border" Property="Background" Value="{StaticResource ItemMouseOverBackground}" />
                                <Setter Property="Foreground" Value="{StaticResource ItemMouseOverForeground}" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter TargetName="Border" Property="Opacity" Value="{StaticResource DisableOpacity}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    复制代码
  • 相关阅读:
    win10 ,本地连接无法识别网络 ,无线正常,
    vba 声音
    win10 优化
    比较火和常用的命令
    手机电脑平板 查图纸、查点位图、查通病、自学维修知识等通通都有的工具
    e4a mysql
    e4a 对话框的 多选单选颜色日期时间
    e4s 文本操作 数组操作
    e4a sqlite案例
    e4a-窗口切换
  • 原文地址:https://www.cnblogs.com/sjqq/p/8458663.html
Copyright © 2011-2022 走看看