单击 xaml 时更改按钮上的图像

Question

当单击同一个按钮时，我试图在按钮的两个图像之间进行切换 我的 xml 代码是

<Button x:Name="BidderOne"
            Click="BidderOne_Click" Height="5" 
            Grid.Row="2"
            BorderBrush="#FFE7E3E3"
             HorizontalAlignment="Center" 
             VerticalAlignment="Center"
             Margin="350,0,0,280" 
            >
        <Button.Template>
            <ControlTemplate>
                <Image x:Name="BidderOneImage" 
                       Source="/Assets/Star.png"

                       Width="50"/>
            </ControlTemplate>
        </Button.Template>
    </Button>

我不知道在我的课上写什么，但我发现的内容与此类似

 private void BidderOne_Click(object sender, RoutedEventArgs e)
    {
        var selectedBidder = sender as Button;
        //   Button btn = new Button();
        //  btn = BidderOne;
        ControlTemplate dt = BidderOne.Template;
        Image btnImage = (Image)dt.TargetType = ;
        var img = (Image)(selectedBidder.ContentTemplateRoot as StackPanel).Children[0];
        var uri = new Uri("/Assetes/ClubsLogo.png", UriKind.Relative);
     //   var sri = Windows.UI.Xaml.Application.("Assetes/ClubsLogo.png", UriKind.Relative);
        imgOn.UriSource=uri;
        img.Source = imgOn; 
    }

Answer 1

不建议在运行时更改Control 的ControlTemplate。对于这些情况，您应该创建一个自定义控件。

我写了一个简单的ImageButton 只是为了让您了解创建解决问题所需的内容。

代码如下：

public sealed class ImageButton : Button
{
    private Image _image;

    public ImageButton()
    {
        this.DefaultStyleKey = typeof (Button);

        _image = new Image();
    }

    protected override void OnApplyTemplate()
    {
        base.OnApplyTemplate();

        this.Content = _image;
        OnImage1SourceChanged(null, null);
    }

    public ImageSource Image1Source
    {
        get { return (ImageSource)GetValue(Image1SourceProperty); }
        set { SetValue(Image1SourceProperty, value); }
    }

    public static readonly DependencyProperty Image1SourceProperty =
        DependencyProperty.Register("Image1Source",
            typeof (ImageSource),
            typeof (ImageButton),
            new PropertyMetadata(null, OnImage1SourceChangedCallback));

    private static void OnImage1SourceChangedCallback(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var imageButton = d as ImageButton;
        if (imageButton == null) return;
        imageButton.OnImage1SourceChanged((ImageSource)e.OldValue, (ImageSource)e.NewValue);
    }

    private void OnImage1SourceChanged(ImageSource oldValue, ImageSource newValue)
    {
        if (_image != null)
        {
            _image.Source = Image1Source;
        }
    }

    public ImageSource Image2Source
    {
        get { return (ImageSource)GetValue(Image2SourceProperty); }
        set { SetValue(Image2SourceProperty, value); }
    }

    public static readonly DependencyProperty Image2SourceProperty =
        DependencyProperty.Register("Image2Source",
            typeof (ImageSource),
            typeof (ImageButton),
            new PropertyMetadata(null));

    protected override void OnTapped(TappedRoutedEventArgs e)
    {
        base.OnTapped(e);

        if (_image != null)
        {
            _image.Source = Image2Source;
        }
    }
}

然后你像这样使用它：

<controls:ImageButton Width="60" Height="60" Image1Source="/Assets/Images/Chat/ic_comment_favorite_yellow.png" Image2Source="/Assets/Images/Flags/afghanistan.png"/>

Answer 2

试试这个

已编辑

private void BidderOne_Click(object sender, RoutedEventArgs e) {
    var selectedBidder = sender as Button;
    // WRONG -> Image image = selectedBidder.Template.FindName("BidderOneImage", selectedBidder) as Image;
    Image image = VisualTreeHelper.GetChild(selectedBidder, 0) as Image;
    image.Source = new BitmapImage(new Uri("NEW IMAGE URI"));
}