根据 xaml 中的主题更改 ImageButton 源

Question

我想根据主题（即浅色与深色）更改 xaml 中 ImageButton 的来源。当我使用以下内容时，我得到 System.NullReferenceException 'Object reference not set to an instance of an object.'：

<ImageButton
        Grid.Row="1"
        Margin="10"
        Command="{Binding CreateCommand}"
        Source="{AppThemeBinding Light=add_box_black_48dp.svg, Dark=add_box_light_48dp.svg}"
        HorizontalOptions="End"
        VerticalOptions="End"/>

如果我将源更改为以下一切正常

Source="add_box_white_48dp"

我可以使用 AppThemeBinding 以这种方式更改 ImageButton Source吗？

<于 2022 年 6 月 4 日编辑以显示 xaml 有效和无效的案例。还更改了 svg 文件的名称以反映明暗情况>

我正在使用 Visual Studio Community 2022（64 位）- 预览版版本 17.3.0 预览 1.1

此 ImageButton xaml 抛出异常：

<ImageButton
    Margin="10"
    Command="{Binding CreateNewAccountCommand}"
    Source="{AppThemeBinding Light=add_light.svg, Dark=add_dark.svg}"
    HorizontalOptions="End"
    VerticalOptions="End"
    BackgroundColor="#376489"
    CornerRadius="8"
    WidthRequest="36"
    HeightRequest="36">
</ImageButton>

这个 ImageButton xaml 有效并且不会抛出异常

<ImageButton
    Margin="10"
    Command="{Binding CreateNewAccountCommand}"
    Source="add_light.svg"
    HorizontalOptions="End"
    VerticalOptions="End"
    BackgroundColor="#abdbe3"
    CornerRadius="8"
    WidthRequest="36"
    HeightRequest="36">
</ImageButton>

这也有效并且不会抛出异常

<ImageButton
    Margin="10"
    Command="{Binding CreateNewAccountCommand}"
    Source="add_dark.svg"
    HorizontalOptions="End"
    VerticalOptions="End"
    BackgroundColor="#376489"
    CornerRadius="8"
    WidthRequest="36"
    HeightRequest="36">
</ImageButton>

Answer 1

要工作 cross-platform，请参阅 .png 文件。这些由 Maui 自动构建：

每个图片资源需要Property/BuildAction: "MauiImage".
参考xaml中的.png:

Source="{AppThemeBinding Light=add_box_black_48dp.png, Dark=add_box_light_48dp.png}"

通过修改 Maui 项目的默认 MainPage 进行验证，即：

<Image Source="{AppThemeBinding Light=dotnet_bot.png, Dark=dotnet_bot.png}" ... />

这是指媒体项目 dotnet_bot.svg，（我推断）它被“MauiImage”转换为 .png 资源。

注意：也许计划能够取消扩展。这适用于 Android，但图像不显示在 Windows:

<!-- Doesn't work currently on Windows -->
<Image Source="{AppThemeBinding Light=dotnet_bot, Dark=dotnet_bot}" ... />

根据 xaml 中的主题更改 ImageButton 源

Change ImageButton source based on Theme in xaml

maui

.net-maui