0

我有一个带有在 XAML 中定义的图像的按钮，如下所示：

<Button x:Name="buttonTest">
    <Button.Template>
        <ControlTemplate>
                <Border HorizontalAlignment="Center" VerticalAlignment="Center" >
                    <Image x:Name="imageTest" Width="57" Height="81" Source="/Images/sample.png" />
                </Border>
        </ControlTemplate>
    </Button.Template>
</Button>

单击按钮时如何更改图像的来源？

4

3 回答 3

0

我可能会使用切换按钮而不是按钮来执行此操作，因为它具有 IsChecked 属性，您可以在该属性上创建图像开关。

首先，您需要一些转换器从真/假到图像路径，也可以使其成为可以反复使用的通用转换器，将其添加到您的项目中并设置一个 xmlns 以在您的 xaml 中指向它.

public class BooleanSwitchConverter : DependencyObject, IValueConverter
    {
        public object TrueValue
        {
            get { return (object)GetValue(TrueValueProperty); }
            set { SetValue(TrueValueProperty, value); }
        }
        public static readonly DependencyProperty TrueValueProperty =
            DependencyProperty.Register("TrueValue", typeof(object), typeof(BooleanSwitchConverter), new PropertyMetadata(null));

        public object FalseValue
        {
            get { return (object)GetValue(FalseValueProperty); }
            set { SetValue(FalseValueProperty, value); }
        }
        public static readonly DependencyProperty FalseValueProperty =
            DependencyProperty.Register("FalseValue", typeof(object), typeof(BooleanSwitchConverter), new PropertyMetadata(null));

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            return ((bool)value) ? TrueValue : FalseValue;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }

然后使用 IsChecked 上的 Binding 将您的 Button 替换为这样的切换按钮来选择图像。

<ToggleButton>
            <ToggleButton.Template>
                <ControlTemplate TargetType="ToggleButton">
                    <Border>
                        <Image>
                            <Image.Source>
                                <Binding Path="IsChecked" RelativeSource="{RelativeSource TemplatedParent}">
                                    <Binding.Converter>
                                        <local:BooleanSwitchConverter 
                                            TrueValue="1.jpg" 
                                            FalseValue="2.jpg"/>
                                    </Binding.Converter>
                                </Binding>
                            </Image.Source>
                        </Image>
                    </Border>
                </ControlTemplate>
            </ToggleButton.Template>
        </ToggleButton>
于 2013-07-11T12:48:43.747 回答
0

您可以使用这样的触发器（在示例中为简单起见使用了矩形）：

<Button x:Name="buttonTest" Width="200" Height="200">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border HorizontalAlignment="Center" VerticalAlignment="Center" >
                <Rectangle x:Name="Image" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}" Fill="Yellow"></Rectangle>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="IsPressed" Value="True">
                    <Setter TargetName="Image" Property="Fill" Value="Red"></Setter>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
</Button>
于 2013-07-11T12:52:11.963 回答
0

所以我终于想通了，用户 Gambi 在另一个线程中提供了答案。

于 2013-07-12T06:10:00.573 回答