如何以编程方式更改 Windows Phone 中设置器值中的图像

Posted 2023-04-12

【中文标题】如何以编程方式更改 Windows Phone 中设置器值中的图像

【英文标题】：How to change an Image in a Setter Value in Windows Phone programatically

【发布时间】：2015-12-26 16:04:38

【问题描述】：

我在资源字典中定义了一个资源，如下所示：

<x:Int32 x:Key="HubSectionHeaderCharacterSpacing">-10</x:Int32>
<x:Double x:Key="HubSectionHeaderFontSize">19</x:Double>
<Thickness x:Key="HubSectionHeaderMarginThickness">-1,5,0,31.5</Thickness>
<Thickness x:Key="HubSectionMarginThickness">19,0,0,0</Thickness>
<Style x:Key="MainMenuHubSectionStyle2" TargetType="HubSection">
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="HubSection">
                <Grid Background="WhiteSmoke">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="80"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.RenderTransform>
                        <CompositeTransform x:Name="WrappingTransform"/>
                    </Grid.RenderTransform>
                    <Viewbox HorizontalAlignment="Center" Margin="0">
                        <Image Source="ms-appx:///Assets/Logos/Logo.png" Stretch="Fill"/>
                    </Viewbox>
                    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="TemplateBinding ContentTemplate" HorizontalAlignment="TemplateBinding HorizontalContentAlignment" Margin="0" Grid.Row="1" VerticalAlignment="TemplateBinding VerticalContentAlignment"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我有一个使用这种风格的 HubSection。如何以编程方式访问此资源并替换

<Viewbox HorizontalAlignment="Center" Margin="0">
    <Image Source="ms-appx:///Assets/Logos/Logo.png" Stretch="Fill"/>
</Viewbox>

还有其他图片？

【问题讨论】：

为什么不能只绑定到字符串属性并在运行时更改它？

因为我不知道该怎么做。我没有使用 MVVM，所以把这个字符串属性放在哪里（应该是什么类型，“ImageSource”？）

【参考方案1】：

这是一个肮脏的 hack，但由于您只有一个属性要替换，您可以利用 Tag 属性来存储您的图片网址：

<Style x:Key="MainMenuHubSectionStyle2" TargetType="HubSection">
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="HubSection">
                <Grid Background="WhiteSmoke">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="80"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.RenderTransform>
                        <CompositeTransform x:Name="WrappingTransform"/>
                    </Grid.RenderTransform>
                    <Viewbox HorizontalAlignment="Center" Margin="0">
                        <Image Source="TemplateBinding Tag" Stretch="Fill"/>
                    </Viewbox>
                    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="TemplateBinding ContentTemplate" HorizontalAlignment="TemplateBinding HorizontalContentAlignment" Margin="0" Grid.Row="1" VerticalAlignment="TemplateBinding VerticalContentAlignment"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

那么你可以这样使用它：

<HubSection Tag="ms-appx:///Assets/Logos/Logo.png">
</HubSection>

否则，您可能必须创建自己的类型，从 HubSection 继承并添加必要的属性。

或者，您可以按照 RenDishen 的建议使用良好的数据绑定。例如：

<Style x:Key="MainMenuHubSectionStyle2" TargetType="HubSection">
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="HubSection">
                <Grid Background="WhiteSmoke">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="80"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.RenderTransform>
                        <CompositeTransform x:Name="WrappingTransform"/>
                    </Grid.RenderTransform>
                    <Viewbox HorizontalAlignment="Center" Margin="0">
                        <Image Source="Binding Path=Logo" Stretch="Fill"/>
                    </Viewbox>
                    <ContentPresenter x:Name="ContentPresenter" ContentTemplate="TemplateBinding ContentTemplate" HorizontalAlignment="TemplateBinding HorizontalContentAlignment" Margin="0" Grid.Row="1" VerticalAlignment="TemplateBinding VerticalContentAlignment"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

然后，您必须为 HubSection 的 DataContext 属性分配一个具有 Logo 属性的对象，并相应地填充它。