如何访问故事板动画中的 ToggleButton 内容

Question

我在 UI 中有一个切换按钮，希望在单击它时执行一些操作。

此按钮的 xaml：

      <ToggleButton x:Name="markToggle" Click="markToggle_Click" Style="{StaticResource StyleMarkToggle}" >
         <ToggleButton.Content>
           <StackPanel x:Name="markToggle_Button" Orientation="Horizontal">
             <Image x:Name="Icon" Source="{Binding MarkToggleIcon}" Stretch="None" />
             <TextBlock x:Name="Counter" TextWrapping="Wrap" Text="{Binding ButtonText}" Margin="6,0,0,0" />
           </StackPanel>
         </ToggleButton.Content>
      </ToggleButton>

单击此切换按钮时，我想更改文本块的前景色（名称：计数器）。 如何从 Storyboard.Target（或 TargetName）访问此文本框元素？

这是“StyleMarkToggle”样式的 xaml 代码。

（以下代码中仅显示视觉状态“已检查”。）

<VisualState x:Name="Checked">
 <Storyboard>
      <ColorAnimation Duration="0" To="White" Storyboard.TargetName="{Binding ElementName=Counter}" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" />
 </Storyboard>

它显示了这个运行时错误：

MS.Internal.WrappedException: Cannot resolve TargetName System.Windows.Controls.TextBlock. ---> System.InvalidOperationException: Cannot resolve TargetName System.Windows.Controls.TextBlock.
   at MS.Internal.XcpImports.VisualStateManager_GoToStateInternal(Control reference, FrameworkElement root, VisualStateGroup group, VisualState state, Boolean useTransitions, Boolean& refreshInheritanceContext)
   at System.Windows.VisualStateManager.RetryGoToStateAfterRefreshingInheritanceContext(Control control, FrameworkElement templateRoot, VisualStateGroup group, VisualState state, Boolean useTransitions)
   at System.Windows.VisualStateManager.GoToState(Control control, String stateName, Boolean useTransitions)
   at System.Windows.Controls.Primitives.ToggleButton.ChangeVisualState(Boolean useTransitions)
   at System.Windows.Controls.Primitives.ToggleButton.OnApplyTemplate()
   at System.Windows.FrameworkElement.OnApplyTemplate(IntPtr nativeTarget)

Answer 1

您可以不使用Storyboard，而是将TextBlock 元素的Foreground 属性绑定到ToggleButton 元素的IsChecked 属性，然后使用Converter 从bool 转换到SolidColorBrush。

这是修改后的 XAML：

<ToggleButton x:Name="markToggle" Click="markToggle_Click" Style="{StaticResource StyleMarkToggle}" >
    <ToggleButton.Content>
        <StackPanel x:Name="markToggle_Button" Orientation="Horizontal">
            <Image x:Name="Icon" Source="{Binding MarkToggleIcon}" Stretch="None" />
            <TextBlock Foreground="{Binding ElementName=markToggle, Path=IsChecked, Converter={StaticResource BoolToColorConverter}}" x:Name="Counter" TextWrapping="Wrap" Text="{Binding ButtonText}" Margin="6,0,0,0" />
        </StackPanel>
    </ToggleButton.Content>
</ToggleButton>

以及转换器的代码：

public class BoolToColorConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if ((bool)value)
            return new SolidColorBrush(Colors.White);
        else
            return new SolidColorBrush(Colors.Black);
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }