【问题标题】:Change image based on Theme selection for Light or Dark根据浅色或深色的主题选择更改图像
【发布时间】:2015-05-10 08:43:23
【问题描述】:

我正在创建一个 Windows Phone 8.1 应用程序,在该应用程序中,我使用了许多应根据所选主题浅色或深色显示的图像。

使用正确的命名和缩放比例创建明暗图像。

我创建了以下 ThemeResource 来根据所选主题设置图像源。

<ResourceDictionary>
    <ResourceDictionary.ThemeDictionaries>
        <ResourceDictionary x:Key="Light">
            <Style x:Key="ShowImage" TargetType="Image">
                <Setter Property="Source" Value="Assets/image.png"/>                            
            </Style>
        </ResourceDictionary>
        <ResourceDictionary x:Key="Dark">
            <Style x:Key="ShowImage" TargetType="Image">
                <Setter Property="Source" value="Assets/image.png"/>
            </Style>
        </ResourceDictionary>                
    </ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>

以及必要时显示图像的 XAML。

<Grid>        
    <Image HorizontalAlignment="Center" 
           VerticalAlignment="Center" 
           Stretch="None" 
           Style="{ThemeResource ShowImage}">
    </Image>
</Grid>

当我使用选择的主题启动应用程序时,每次都会显示正确的图像。但是,当我选择不同的主题然后切换回我的应用程序时,我可以看到背景颜色已更新,但我的图像并未动态更新。

据我所知,应该使用 ThemeResource 来动态更新它,但我无法让它工作。 有人知道我的 XAML 代码有什么问题吗?

【问题讨论】:

    标签: c# xaml windows-phone-8.1 winrt-xaml


    【解决方案1】:

    您发布的代码对我来说非常好用。您能否发布有关如何重现该问题的更多详细信息。这就是我所做的。

    1. 打开应用
    2. 根据主题显示正确的图像
    3. 使用“开始”按钮最小化应用程序
    4. 更改了主题并恢复了应用

    它改变了背景和相应的图像。 请再次检查您是否犯了其他错误,并且在您发布的代码中,您将图像源设置为两个主题中的相同图像

    <Setter Property="Source" value="Assets/image.png"/>
    

    【讨论】:

    • 您好 Akshay,感谢您的回答。您描述的验证过程与我使用的相同。我在其中一个 Windows Phone 8.1 模拟器上进行了测试,并且还部署到了我自己的 Windows Phone 设备上。对于两种相同的行为。
    • 另外,我已经根据 MSDN link 中描述的命名约定命名了图像文件,因此这将导致 image.scale-240_theme-light.png。还有一个黑暗主题课程的文件。然后应使用名称image.png 来引用该文件。我使用的整个设置额外基于另一篇堆栈流文章link,由 Galinho 回答。有没有办法在运行时调试主题开关行为?
    • 如果您使用命名约定,为什么要创建 ThemeDictionary?只需设置Source="Assets/image.png" 即可完成相同的任务。使用命名约定,在应用程序重新加载到内存之前,图像源不会改变。在 ThemeDictionary 中使用两个不同的名称,以便图像可以在运行时更新。
    • 嗨 Akshay,所以我尝试在图像源中输入两个主题的完整文件名。这适用于切换,但缩放不再正常工作。所以我尝试接下来将文件名更改为例如image-light.scale-240_theme-light.png 然后在 Setter 中通过 imagelight.png 引用它。这适用于切换主题和缩放​​。感谢你的支持。我的问题现在解决了。
    • 这正是我的意思!很高兴知道它现在正在工作:)
    猜你喜欢
    • 1970-01-01
    • 2021-12-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-01-11
    • 2021-11-29
    • 2022-08-12
    • 1970-01-01
    相关资源
    最近更新 更多