在wpf中突出显示不同颜色的选定栏

问题描述：

默认情况下，酒吧的颜色是钢蓝色。

我想，其中当用户选择一个条，应当以不同的颜色，即红色高亮显示，以指示是指该产品的功能性。请指导我如何实现这一目标。

目前我已经使用了以下columndatapoint风格。

<Style 
 
       x:Key="MyColumnDataPointStyle" 
 
       TargetType="charting:ColumnDataPoint"> 
 
     <Setter Property="Background" Value="SteelBlue"/> 
 
     <Setter Property="Template"> 
 
      <Setter.Value> 
 
       <ControlTemplate TargetType="charting:ColumnDataPoint"> 
 
        <Border 
 
           BorderBrush="{TemplateBinding BorderBrush}" 
 
           BorderThickness="{TemplateBinding BorderThickness}" 
 
           Opacity="1" 
 
           x:Name="Root"> 
 
         <VisualStateManager.VisualStateGroups> 
 
          <VisualStateGroup x:Name="CommonStates"> 
 
           <VisualStateGroup.Transitions> 
 
            <VisualTransition GeneratedDuration="0:0:0.1"/> 
 
           </VisualStateGroup.Transitions> 
 
           <VisualState x:Name="Normal"/> 
 
           <VisualState x:Name="MouseOver"> 
 
            <Storyboard> 
 
             <DoubleAnimation 
 
                Storyboard.TargetName="MouseOverHighlight" 
 
                Storyboard.TargetProperty="Opacity" 
 
                To="0.6" 
 
                Duration="0"/> 
 
            </Storyboard> 
 
           </VisualState> 
 
          </VisualStateGroup> 
 
          <VisualStateGroup x:Name="SelectionStates"> 
 
           <VisualStateGroup.Transitions> 
 
            <VisualTransition GeneratedDuration="0:0:0.1"/> 
 
           </VisualStateGroup.Transitions> 
 
           <VisualState x:Name="Unselected"/> 
 
           <VisualState x:Name="Selected"> 
 
            <Storyboard> 
 
             <DoubleAnimation 
 
                Storyboard.TargetName="SelectionHighlight" 
 
                Storyboard.TargetProperty="Opacity" 
 
                To="0.6" 
 
                Duration="0"/> 
 
            </Storyboard> 
 
           </VisualState> 
 
          </VisualStateGroup> 
 
          <VisualStateGroup x:Name="RevealStates"> 
 
           <VisualStateGroup.Transitions> 
 
            <VisualTransition GeneratedDuration="0:0:0.5"/> 
 
           </VisualStateGroup.Transitions> 
 
           <VisualState x:Name="Shown"> 
 
            <Storyboard> 
 
             <DoubleAnimation 
 
                Storyboard.TargetName="Root" 
 
                Storyboard.TargetProperty="Opacity" 
 
                To="1" 
 
                Duration="0"/> 
 
            </Storyboard> 
 
           </VisualState> 
 
           <VisualState x:Name="Hidden"> 
 
            <Storyboard> 
 
             <DoubleAnimation 
 
                Storyboard.TargetName="Root" 
 
                Storyboard.TargetProperty="Opacity" 
 
                To="0" 
 
                Duration="0"/> 
 
            </Storyboard> 
 
           </VisualState> 
 
          </VisualStateGroup> 
 
         </VisualStateManager.VisualStateGroups> 
 
         <Grid 
 
            Background="{TemplateBinding Background}"> 
 
          <Rectangle> 
 
           <Rectangle.Fill> 
 
            <LinearGradientBrush> 
 
             <GradientStop 
 
                Color="#77ffffff" 
 
                Offset="0"/> 
 
             <GradientStop 
 
                Color="#00ffffff" 
 
                Offset="1"/> 
 
            </LinearGradientBrush> 
 
           </Rectangle.Fill> 
 
          </Rectangle> 
 
          <Border 
 
             BorderBrush="#ccffffff" 
 
             BorderThickness="1"> 
 
           <Border 
 
              BorderBrush="#77ffffff" 
 
              BorderThickness="1"/> 
 
          </Border> 
 
          <Rectangle x:Name="SelectionHighlight" Fill="Red" Opacity="0"/> 
 
          <Rectangle x:Name="MouseOverHighlight" Fill="White" Opacity="0"/> 
 
         </Grid> 
 
         <ToolTipService.ToolTip> 
 
          <StackPanel> 
 
           <ContentControl 
 
              Content="{TemplateBinding FormattedIndependentValue}" 
 
              FontWeight="Bold"/> 
 
           <ContentControl 
 
              Content="{TemplateBinding FormattedDependentValue}"/> 
 
          </StackPanel> 
 
         </ToolTipService.ToolTip> 
 
        </Border> 
 
       </ControlTemplate> 
 
      </Setter.Value> 
 
     </Setter> 
 
    </Style>

答

要在MVVM模式我想创建一个视图模型类为您ColumnDataPoint做到这一点。此ViewModel包含一个bool属性，例如称为IsActive。然后，您可以绑定在酒吧的的DataContext到视图模型，并在你的风格，你可以设置绑定到该物业的DataTrigger。要更改属性，你可以创建一个在您的ViewModel一个命令，它会一下吧

这里的时候被执行是一个小例子：

 <Rectangle Fill="SteelBlue" 
       DataContext="{Binding YourViewModel}"> 
     <Rectangle.Style> 
      <Style TargetType="Rectangle"> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding IsActive}" Value="true"> 
         <Setter Property="Stroke" Value="Chartreuse"/> 
         <Setter Property="StrokeThickness" Value="5"/> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </Rectangle.Style> 
     <i:Interaction.Triggers> 
      <i:EventTrigger EventName="MouseLeftButtonUp"> 
       <command:EventToCommand Command="{Binding ClickingBarCommand}"/> 
      </i:EventTrigger> 
     </i:Interaction.Triggers> 
    </Rectangle>

要使用“i”和“命令”命名空间中必须添加

的xmlns：ⅰ= “CLR-名称空间：System.Windows.Interactivity;装配= System.Windows.Interactivity” 的xmlns：命令= “http://www.galasoft.ch/mvvmlight”

希望这对您有所帮助

欢呼

在wpf中突出显示不同颜色的选定栏

相关推荐