Question

下面给出的代码用于切换图像。它工作，但当我点击按钮时，白色矩形显示为按钮的前景。还有更好的办法吗？

private void music_click(object sender, RoutedEventArgs e)
{
    System.Diagnostics.Debug.WriteLine("music clickedddd");
    switch (key)
    {
        case 1:
            var brush = new ImageBrush();
            BitmapImage image = new BitmapImage(new Uri(@"Images/music pause button.png", UriKind.Relative));
            brush.ImageSource = image;
            music.Background = brush;

            key = 0;
            System.Diagnostics.Debug.WriteLine("music clickedddd pause");
            break;

        case 0:
            var brush2 = new ImageBrush();
            BitmapImage image2 = new BitmapImage(new Uri(@"Images/Music on.png", UriKind.Relative));
            brush2.ImageSource = image1;
            music.Background = brush2;

            key = 1;
            System.Diagnostics.Debug.WriteLine("music clickedddd play");
            break;
    }
}

Answer 1

我建议为ToggleButton设置样式，以便为两个“暂停”和“正在运行”的情况显示两个不同的VisualStates（ToggleButton控件支持两个VisualStates“Checked”和“Unchecked”）。我该怎么做？好吧，我尝试了以下代码，它的工作原理：

<UserControl
x:Class="SilverlightApplication2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<UserControl.Resources>
    <ControlTemplate x:Key="MySpecialToggleButton" TargetType="ToggleButton">
        <Grid>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CheckStates">
                    <VisualState x:Name="Checked">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="RunningIcon">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PausedIcon">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Collapsed</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unchecked"/>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Image x:Name="PausedIcon" Source="/SilverlightApplication2;component/assets/paused.png" Visibility="Visible" Width="16" Height="16"/>
            <Image x:Name="RunningIcon" Source="/SilverlightApplication2;component/assets/running.png" Visibility="Collapsed" Width="16" Height="16"/>
        </Grid>
    </ControlTemplate>
</UserControl.Resources>

<ToggleButton Height="20" Width="20" Template="{StaticResource MySpecialToggleButton}"/>

我假设您仍然希望处理切换以开始播放音乐或停止播放音乐，您仍然可以处理后面的代码中的点击，但您不必再更改按钮外观。而且您无需跟踪按钮是否被切换（您的变量名为“key”），您可以随时询问您的按钮是否已选中或未选中。而且你不需要它，只需使用专门的ToggleButton事件“Checked”和“Unchecked”。

Answer 2

您应该尝试将StoryBorads（http://msdn.microsoft.com/en-us/library/ms742868(v=vs.110).aspx）用于此类动画。

切换按钮与不同的图像

2 个答案: