具有不同图像的切换按钮答案

【问题标题】：toggle button with different images具有不同图像的切换按钮
【发布时间】：2013-11-06 09:03:47
【问题描述】：

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

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;
    }
}

【问题讨论】：

你确定它和XNA有关吗？
它与 silverlight 相关，我将它与 xna 一起使用。

标签： c# silverlight xna

【解决方案1】：

我建议设置您的 ToggleButton 的样式，以针对“暂停”和“运行”两种情况显示两种不同的 VisualState（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”。

【讨论】：

【解决方案2】：

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

【讨论】：