Wpf组合框样式触发器和绑定
问题描述:
我正在创建一个可以通过遥控器或键盘控制的wpf应用程序。我试图创建一个ComboBox,当焦点移动到它时,文本会发光。通过点击遥控器上的确定(或在键盘上输入),会出现下拉菜单,允许用户进行选择。 为了使键盘导航工作,我创建了一个扩展组合框的自定义控件。一切正常,但我在设计时遇到了麻烦。 我希望ComboBox成为一个带有上述发光效果的文本框,但是我无法确定放置触发器的位置。 在下面的Xaml中,我收到一个“FlowMenuComboBoxContentTemplateGlow”找不到的错误。我也遇到了麻烦,我需要在文本框中绑定以显示选定项目的文本。 任何人都可以帮忙吗? 感谢Wpf组合框样式触发器和绑定
<!--Flow Menu Text-->
<Style x:Key="FlowMenuText"
TargetType="TextBlock">
<Setter Property="Foreground"
Value="LightGray" />
<Setter Property="FontFamily"
Value="Segoe UI Light, Lucida Sans Unicode, Verdana" />
<Setter Property="FontSize"
Value="24" />
<Setter Property="TextOptions.TextHintingMode"
Value="Animated" />
</Style>
<!--Flow Menu KN ComboBox ContentTemplate-->
<DataTemplate x:Key="FlowMenuComboBoxContentTemplate">
<TextBlock Text="WHAT SHOULD I BIND TO?" Style="{DynamicResource FlowMenuText}">
<TextBlock.Effect>
<DropShadowEffect x:Name="FlowMenuComboBoxContentTemplateGlow" BlurRadius="8" Color="LightGray" ShadowDepth="0" Opacity="0" />
</TextBlock.Effect>
</TextBlock>
</DataTemplate>
<!--Flow Menu KNComboBox-->
<Style x:Key="FlowMenuComboBox"
TargetType="ComboBox">
<Setter Property="BorderBrush"
Value="{x:Null}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBox}">
<Grid x:Name="MainGrid" SnapsToDevicePixels="true">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Popup x:Name="Popup" AllowsTransparency="true" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom">
<Border x:Name="DropDownBorder" BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" BorderThickness="1" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
<ScrollViewer x:Name="DropDownScrollViewer">
<Grid RenderOptions.ClearTypeHint="Enabled">
<Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
<Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=DropDownBorder}" Height="{Binding ActualHeight, ElementName=DropDownBorder}" Width="{Binding ActualWidth, ElementName=DropDownBorder}"/>
</Canvas>
<ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
</Grid>
</ScrollViewer>
</Border>
</Popup>
<ContentPresenter ContentTemplate="{DynamicResource FlowMenuComboBoxContentTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Content="{TemplateBinding SelectionBoxItem}" ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsHitTestVisible="true" Margin="{TemplateBinding Padding}"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Grid>
<!-- THIS CURRENTLY THROWS AN ERROR
<ControlTemplate.Triggers>
<EventTrigger RoutedEvent="GotFocus">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FlowMenuComboBoxContentTemplateGlow" Storyboard.TargetProperty="Opacity" From="0"
To="1" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="LostFocus">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FlowMenuComboBoxContentTemplateGlow" Storyboard.TargetProperty="Opacity" From="1"
To="0" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</ControlTemplate.Triggers>-->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
答
移动触发到ItemTemplate中使用相对源得到修复了这个问题的comboboxitem的isFocused路径。
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<Grid>
<Border x:Name="FlowMenuComboBoxItemTemplatePosterGlow" Style="{DynamicResource PosterBorder}" BorderThickness="1" Opacity="0">
<Border.Effect>
<BlurEffect KernelType="Gaussian" Radius="3" />
</Border.Effect>
</Border>
<Grid Margin="5,5,5,5">
<TextBlock Text="{Binding}" Style="{DynamicResource FlowMenuText}">
<TextBlock.Effect>
<DropShadowEffect x:Name="FlowMenuComboBoxItemTemplateGlow" BlurRadius="8" Color="LightGray" ShadowDepth="0" Opacity="0" />
</TextBlock.Effect>
</TextBlock>
</Grid>
</Grid>
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ComboBoxItem}},Path=IsFocused}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FlowMenuComboBoxItemTemplatePosterGlow" Storyboard.TargetProperty="Opacity" From="0"
To="1" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FlowMenuComboBoxItemTemplateGlow" Storyboard.TargetProperty="Opacity" From="0"
To="1" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FlowMenuComboBoxItemTemplatePosterGlow" Storyboard.TargetProperty="Opacity" From="1"
To="0" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FlowMenuComboBoxItemTemplateGlow" Storyboard.TargetProperty="Opacity" From="1"
To="0" Duration="0:0:0.5" />
</Storyboard>
</BeginStoryboard>
</DataTrigger.ExitActions>
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</Setter.Value>
</Setter>
我无法回答我的问题,另外4个小时,但我通过将触发器移动到组合框内容模板来解决此问题。当超时过期时,我会发布完整的答案。 – Oli 2012-04-20 16:30:26