XAML Windows Phone 8.1 按钮应更改 backgroundImage答案

【问题标题】：XAML Windows Phone 8.1 Button should change backgroundImageXAML Windows Phone 8.1 按钮应更改 backgroundImage
【发布时间】：2016-04-04 21:38:05
【问题描述】：

我知道这种问题被问了很多。但是我自己解决不了。

要实现的挑战是一个没有任何样式的简单按钮，除了用于几种状态（默认、按下和悬停）的不断变化的背景图像。

到目前为止我所做的代码在我的 App.xaml 文件中：

            <Style x:Key="likeActionButton" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal">
                                    </VisualState>
                                    <VisualState x:Name="PointerOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames
                                                Storyboard.TargetName="HoverBackground"
                                                Storyboard.TargetProperty = "Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames
                                                Storyboard.TargetName="PressedBackground"
                                                Storyboard.TargetProperty = "Visibility">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border>
                                <Grid>
                                    <Image Source="Assets/ActionsIcons/like-action.png"></Image>
                                    <Image x:Name="HoverBackground" Source="Assets/ActionsIcons/like-action-onHover.png" Visibility="Collapsed"></Image>
                                    <Image x:Name="PressedBackground" Source="Assets/ActionsIcons/like-action-on-pressed.png" Visibility="Collapsed"></Image>
                                </Grid>        
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

[从某处调用按钮样式]

                    <Button Style="{StaticResource likeActionButton}"/>

所以这个 XAML 代码似乎什么都不做，因为根本没有图像..

干杯，

克里斯

【问题讨论】：

在有按钮的页面上是否找到按钮样式不清楚。我建议您将其移出 app.xaml 并将其与该页面上的按钮放在一起。还可以在调试模式下运行程序并监视输出窗口...您可能会看到绑定问题或其他 xaml 故障项。
你给源的路径是错误的，添加 ms-appx:/// 到路径 Source="ms-appx:///Assets/ActionsIcons/like-action.png"
@OmegaMan 输出窗口不显示任何错误或警告。并且将 XAML 代码移动到当前页面也无法正常工作。 @Archana我真的认为可能是这样，但按钮仍然不存在。我试图添加一个背景属性以使按钮至少以某种方式可见。我不明白为什么这也不起作用？ ` `
好的。我设法使按钮可见。源的正确路径是：ms-appx:///Assets\ActionIcons\like-action.png。为什么必须是反斜杠？我不明白。但是，hover 和 pressed 的不同状态仍然不起作用

标签： xaml windows-phone-8.1

【解决方案1】：

看起来需要一个初始斜线来准确定位图像的位置，因为该图像相对于当前的 xaml 路径。

改变

Source="Assets/ActionsIcons/like-action-on-pressed.png"

到包的根目录用

Source="/Assets/ActionsIcons/like-action-on-pressed.png"

看起来这些不是动态数据绑定图像。动态图像需要ms-appx:///，因为它们没有在 xaml 中声明，并且需要特殊的命名法才能正确路径。

我相信添加ms-appx:/// 的建议是可行的，因为它提供了一个可以解决的正确路径，但如果只是将/ 添加到路径中，则这是多余的。

为了更好地理解，请阅读How to load file resources (XAML) (Windows)

【讨论】：

它只适用于前缀ms-appx/// 我对上面帖子下反斜杠的评论是无稽之谈，因为我幸运地解决了另一个打字错误。到目前为止一切顺利......现在我有一个正常状态的漂亮背景图像。如果我按下（并按住）按钮，我有另一个背景图像，但是为什么释放按钮后图像消失了？我越来越认为我必须将 UI 元素从Button 更改为Checkbox，因为我只想做一些背景计算，这些计算在再次点击Button/Checkbox 时应该是可逆的......
哈利路亚...终于。我既不是在寻找Button，也不是在寻找Checkbox。关键字是ToggleButton...我问题中的模板也适用于TargetType="ToggleButton"。
@Ulpin 欢迎来到 Xaml 的多面世界。很高兴你解决了。