WPF随笔之 解决无法改变ListBox、ListView,选中样式,如前景色Foreground问题
关于WPF的资料极少,在使用的期间遇到过很多问题,也解决过很多问题,今天决定记录下来一些东西,共享给大家,互勉进步
(需求:如下图,我想在选中的时候将文字变成白色)
最近在使用ListBox(ListView比ListBox了个View,问题是一样的)的时候,发现ListBox相对其他控件而言比较特别,用设置其他控件的方式去设设置Trigger都无法改变TextBlock的前景色(当然期间尝试了n种方法,历尽艰辛,这里省略约1w字)。
这是原代码,Template里面有两个TextBlock控件,一个未进行设置Foreground,一个是设置了Foreground:
1 <ListBox 2 BorderThickness="0" 3 ItemsSource="{Binding WorkStationList, Mode=TwoWay}" 4 SelectedItem="{Binding WorkStationSelectedItem, Mode=TwoWay}" 5 Grid.IsSharedSizeScope="True"> 6 <ListBox.ItemTemplate> 7 <DataTemplate> 8 <Border BorderBrush="{DynamicResource GrayBrush7}" 9 BorderThickness="0 0 0 1" 10 Padding="10 5" > 11 <Grid> 12 <Grid.RowDefinitions> 13 <RowDefinition Height="auto" /> 14 <RowDefinition Height="auto" /> 15 </Grid.RowDefinitions> 16 <Grid.ColumnDefinitions> 17 <ColumnDefinition Width="30" /> 18 <ColumnDefinition Width="auto" /> 19 <ColumnDefinition /> 20 </Grid.ColumnDefinitions> 21 <TextBlock 22 Grid.Column="0" 23 Grid.RowSpan="2" 24 Text="{Binding Order}" 25 VerticalAlignment="Center"/> 26 <Path 27 Grid.Column="1" 28 Grid.RowSpan="2" 29 Name="Part_Icon" 30 Stretch="Fill" 31 Height="24" 32 Width="28" 33 Margin="0 0 10 0" 34 Fill="{DynamicResource GrayBrush5}" 35 Data="M1098,919 L1098,921 L1101,921 L1101,923 L1089,923 L1089,921 L1092,921 L1092,919 L1083.15385,919 C1081.96431,919 1081,918.005077 1081,916.777778 L1081,901.222222 C1081,899.994923 1081.96431,899 1083.15385,899 L1106.84615,899 C1108.03569,899 1109,899.994923 1109,901.222222 L1109,916.777778 C1109,918.005077 1108.03569,919 1106.84615,919 L1098,919 Z M1084,901 C1083.44772,901 1083,901.447715 1083,902 L1083,916 C1083,916.552285 1083.44772,917 1084,917 L1106,917 C1106.55228,917 1107,916.552285 1107,916 L1107,902 C1107,901.447715 1106.55228,901 1106,901 L1084,901 Z" /> 36 37 <TextBlock 38 Grid.Column="2" 39 Grid.Row="0" 40 Text="{Binding WORKCENTER_NAME}" 41 VerticalAlignment="Center" 42 Margin="5" /> 43 <TextBlock 44 Grid.Column="2" 45 Grid.Row="1" 46 Foreground="{DynamicResource GrayBrush1}" 47 Text="{Binding WORKSTATION_NAME}" 48 VerticalAlignment="Center" 49 Margin="10 5 0 5" /> 50 51 </Grid> 52 </Border> 53 </DataTemplate> 54 </ListBox.ItemTemplate> 55 </ListBox>
在调试的过程中,通过实时属性发现其他未设置Foreground属性的TextBlock是继承于系统预定义颜色,而设置了Foreground的TextBlock,始终是设定的颜色(比如GrayBrush5不变)。继承系统颜色的TextBlock在选中不选中状态切换时,颜色可以黑白变化。而设定的颜色的TextBlock无论怎么设定触发器,依旧保持不变。这给予我一定的解题思路:就是不在Contemplate里面设置控件的默认值,而是通过Trigger去设定它不选中时候是什么样的,选中后是什么样的,解决代码如下:
1 <ListBox 2 BorderThickness="0" 3 ItemsSource="{Binding WorkStationList, Mode=TwoWay}" 4 SelectedItem="{Binding WorkStationSelectedItem, Mode=TwoWay}" 5 Grid.IsSharedSizeScope="True"> 6 <ListBox.ItemTemplate> 7 <DataTemplate> 8 <Border BorderBrush="{DynamicResource GrayBrush7}" 9 BorderThickness="0 0 0 1" 10 Padding="10 5" > 11 <Grid> 12 <Grid.RowDefinitions> 13 <RowDefinition Height="auto" /> 14 <RowDefinition Height="auto" /> 15 </Grid.RowDefinitions> 16 <Grid.ColumnDefinitions> 17 <ColumnDefinition Width="30" /> 18 <ColumnDefinition Width="auto" /> 19 <ColumnDefinition /> 20 </Grid.ColumnDefinitions> 21 <TextBlock 22 Grid.Column="0" 23 Grid.RowSpan="2" 24 Text="{Binding Order}" 25 VerticalAlignment="Center"/> 26 <Path 27 Grid.Column="1" 28 Grid.RowSpan="2" 29 Name="Part_Icon" 30 Stretch="Fill" 31 Height="24" 32 Width="28" 33 Margin="0 0 10 0" 34 Data="M1098,919 L1098,921 L1101,921 L1101,923 L1089,923 L1089,921 L1092,921 L1092,919 L1083.15385,919 C1081.96431,919 1081,918.005077 1081,916.777778 L1081,901.222222 C1081,899.994923 1081.96431,899 1083.15385,899 L1106.84615,899 C1108.03569,899 1109,899.994923 1109,901.222222 L1109,916.777778 C1109,918.005077 1108.03569,919 1106.84615,919 L1098,919 Z M1084,901 C1083.44772,901 1083,901.447715 1083,902 L1083,916 C1083,916.552285 1083.44772,917 1084,917 L1106,917 C1106.55228,917 1107,916.552285 1107,916 L1107,902 C1107,901.447715 1106.55228,901 1106,901 L1084,901 Z" /> 35 36 <TextBlock 37 Grid.Column="2" 38 Grid.Row="0" 39 Text="{Binding WORKCENTER_NAME}" 40 VerticalAlignment="Center" 41 Margin="5" /> 42 <TextBlock 43 Grid.Column="2" 44 Grid.Row="1" 45 x:Name="Part_WorkStationName" 46 Text="{Binding WORKSTATION_NAME}" 47 VerticalAlignment="Center" 48 Margin="10 5 0 5" /> 49 50 </Grid> 51 </Border> 52 <DataTemplate.Triggers> 53 <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=ListBoxItem}}" Value="False"> 54 <Setter TargetName="Part_WorkStationName" Property="Foreground" Value="{DynamicResource GrayBrush1}" /> 55 <Setter TargetName="Part_Icon" Property="Fill" Value="{DynamicResource GrayBrush5}" /> 56 </DataTrigger> 57 <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=ListBoxItem}}" Value="True"> 58 <Setter TargetName="Part_WorkStationName" Property="Opacity" Value="0.8" /> 59 <Setter TargetName="Part_Icon" Property="Fill" Value="{StaticResource WhiteBrush}" /> 60 </DataTrigger> 61 </DataTemplate.Triggers> 62 </DataTemplate> 63 </ListBox.ItemTemplate> 64 </ListBox>
修改好后的效果图如下图,当当当当~~~~很好,非常靓仔
TextBlock