码迷,mamicode.com
首页 > Windows程序 > 详细

wpf 自定义ListBox

时间:2017-12-15 22:40:05      阅读:311      评论:0      收藏:0      [点我收藏+]

标签:iss   body   pst   cte   ted   disable   tac   als   add   

 

技术分享图片

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>
View Code
技术分享图片
<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>
View Code

 

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>
View Code
技术分享图片
<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>
View Code

另外提供一个比较常用的需求,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>
View Code

 

wpf 自定义ListBox

标签:iss   body   pst   cte   ted   disable   tac   als   add   

原文地址:http://www.cnblogs.com/callyblog/p/8044963.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!