WPF Litbox样式和模板

1、在项目中使用ListBox时,经常会将ItemContainerStyle和ItemTemplate的作用搞混,ItemTemplate可以搞定一切好似ItemContainerStyle有点多余。我们再来看下ItemContainerStyle和ItemTemplate。 ItemContainerStyle用于给每个Item的容器定义样式,其类型是Style。包含了操作Item的Triggers。 ItemTemplate是每个Item的现实样式,其类型是DataTemplate

在实际应用中,我们往往需要根据用户操作不断的改变ListBox中Items的显示样式。这里 总结一下ListBox中3种应用场景中的最优解决方案。

A.选中Item时改变Item项的背景颜色。

S.在 ItemContainerStyle中写ControlTemplate的样式给定背景色,使用Trigger在Selected为True时改变背景色,代码如下:

<Style x:Key="containerstyle1" TargetType="{x:Type ListBoxItem}">

<Setter Property="Template" >

<Setter.Value>

<ControlTemplate TargetType="{x:Type ListBoxItem}">

<Border x:Name="b1" Background="Red">

<ContentPresenter></ContentPresenter>

</Border>

<ControlTemplate.Triggers>

<Trigger Property="IsSelected" Value="True">

<Setter Property="Background" Value="Green" TargetName="b1"></Setter>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

B. 选中Item时改变Item项的部分显示。

S. 使用改变变量的方式,代码如下:

<Style x:Key="containerstyle1" TargetType="{x:Type ListBoxItem}">

<Setter Property="Template" >

<Setter.Value>

<ControlTemplate TargetType="{x:Type ListBoxItem}">

<Border x:Name="b1" Background="Red">

<Label x:Name="l1" Margin="5" Content="{Binding A1}" FontSize="26" Foreground="DarkBlue"></Label>

</Border>

<ControlTemplate.Triggers>

<Trigger Property="IsSelected" Value="True">

<Setter Property="Content" Value="{Binding A2}" TargetName="l1"></Setter>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

C. 选中Item时需要完全改变Item呈现的样式,如圆形变成矩形等等。

S. 改变Item项的DataTemplate,代码如下:

<DataTemplate x:Key="ItemTemplate" DataType="{x:Type ListBoxItem}">... </DataTemplate>

<DataTemplate x:Key="SelectedTemplate" DataType="{x:Type ListBoxItem}">... </DataTemplate>

<Style x:Key="SeatListStyle" TargetType="{x:Type ListBoxItem}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type ListBoxItem}">

<ContentPresenter></ContentPresenter>

<ControlTemplate.Triggers>

<Trigger Property="IsSelected" Value="True">

<Setter Property="ContentTemplate" Value="{StaticResource SelectedTemplate}" />

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="ContentTemplate" Value="{StaticResource ItemTemplate}"></Setter>

</Style>

2、使用举例

<ListBox
                Name="ChangeAdListbox"
                Grid.Row="0"
                Background="#77000000"
                VerticalAlignment="Bottom"
                HorizontalAlignment="Right"
                 ItemsSource="{Binding Items,ElementName=flipview}"
                SelectionChanged="ChangeAdListbox_SelectionChanged"
                Margin="0,0,20,5" d:IsHidden="True"
                >
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal"/>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="Background" Value="White"/>
                        <Setter Property="Width" Value="12"/>
                        <Setter Property="Height" Value="12"/>
                        <Setter Property="Margin" Value="4"/>
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListBoxItem">
                                    <Border x:Name="bd" BorderThickness="1" BorderBrush="White" Background="{TemplateBinding Background}">
                                    </Border>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="IsSelected" Value="True">
                                            <Setter Property="Background" Value="SkyBlue"/>
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListBox.ItemContainerStyle>
            </ListBox>
时间: 2024-11-02 17:49:00

WPF Litbox样式和模板的相关文章

wpf Button 样式原始模板

这是Button原始样式,看懂了爱怎么改就怎么改 <Window.Resources> <Style x:Key="ButtonFocusVisual"> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate> <Rectangle Stroke="Black" StrokeDashArray=&q

WPF QuickStart系列之样式和模板(Style and Template)

在WPF桌面程序中,当我们想构建一个统一的UI表现时(在不同操作系统下,显示效果一致),此时我们就需要使用到WPF中的样式和模板技术.简单来说,如果我们需要简单的给一个Button设置宽,高,Margin等,可以使用Style来指定这一系列的属性.可以把Style理解为一个属性的集合.如果需要完全改变控件的样子,就需要使用到Template技术,相当于给控件换一层皮,不过Button还是Button,它原有的行为(Click事件)还存在.而且我们仅需要在XAML中遍可以完成对样式和模板的定义和重

WPF QuickStart系列之样式和模板(Style and Template) Part1

在WPF桌面程序中,当我们想构建一个统一的UI表现时(在不同操作系统下,显示效果一致),此时我们就需要使用到WPF中的样式和模板技术.简单来说,如果我们需要简单的给一个Button设置宽,高,Margin等,可以使用Style来指定这一系列的属性.可以把Style理解为一个属性的集合.如果需要完全改变控件的样子,就需要使用到Template技术,相当于给控件换一层皮,不过Button还是Button,它原有的行为(Click事件)还存在.而且我们仅需要在XAML中遍可以完成对样式和模板的定义和重

关于WPF中关于样式和模板的区别

百度了下,改天整理. WPF中关于样式和模板的区别: 回答一: 1.WPF样式类似于Web应用程序中的CSS,在WPF中可以为控件定义统一的样式(Style).样式属于资源的一种,例如为Button定义统一的背景颜色和字体: <Window.Resources> <Style  TargetType="Button"> <Setter Property="Background" Value="Yellow" />

[WPF系列]-数据邦定之DataTemplate 对 ItemsControl 进行样式和模板处理

引言   即使 ItemsControl 不是 DataTemplate 所用于的唯一控件类型,将 ItemsControl 绑定到集合仍然很常见. 在 DataTemplate 中有哪些内容一节中,我们讨论了您的 DataTemplate 定义应当仅与数据表示相关.   为了明确何时不适合使用 DataTemplate,有必要了解 ItemsControl 提供的不同样式和模板属性.   实例演示   下面的示例旨在演示这些属性中每一个属性的功能. 本示例中的 ItemsControl 绑定到

WPF Style设置和模板化Template

WPF样式设置和模板化是一套功能(样式,模板,触发器和演示图版),可以为产品设置统一外观.类似于html的css,可以快速的设置一系列属性值到控件. 案例:ButtonStyle 这里创建了一个目标类型为Button的基础ButtonStyle,其他的Button就可以继承SystemButtonBase,可以统一基础的Style,根据需求设置需要的属性值,登录按钮可以使用StaticResource的方式查找到这个style. 1 <Style x:Key="SystemButtonBa

WPF自定义样式篇-DataGrid

WPF自定义样式篇-DataGrid 先上效果图: 样式: <!--DataGrid样式-->    <Style TargetType="DataGrid">        <Setter Property="RowHeaderWidth" Value="0"></Setter>        <Setter Property="AutoGenerateColumns"

求助 WPF ListViewItem样式问题

求助 WPF ListViewItem样式问题 .NET 开发 > Windows Presentation Foundation Вопрос 0 Нужно войти <Style TargetType="ListViewItem"> <!--<Setter Property="Margin" Value="0,1,0,0"/>--> <Setter Property="Height

在WPF中获取DataGridTemplateColumn模板定义的内容控件

xaml格式描述: <DataGrid Name="dataGrid" Grid.Row="1" ItemsSource="{Binding}"  >            <DataGrid.Columns>              <DataGridTemplateColumn Header="描述">                    <DataGridTemplateCo