从播放更改按钮图像来暂停使用椭圆模板点击时 [英] Changing a button Image from Play to Pause when clicked using an Ellipse template

查看:111
本文介绍了从播放更改按钮图像来暂停使用椭圆模板点击时的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有我想改变的背景图像,所以它看起来像单击​​时暂停按钮播放按钮,我已经看到了如何做到这一点许多导游然而我的椭圆形模板似乎让我的code多不同于任何我已经研究。这里是我的code:

 <按钮的Horizo​​ntalAlignment =左WIDTH =40HEIGHT =40点击=Button_Click_2>
        < Button.Template>
                <的ControlTemplate的TargetType ={X:类型按钮}>
                    <网格和GT;
                        <椭圆行程=黑>
                        < Ellipse.Fill>
                            <的ImageBrush的ImageSource =图像/ play.png/>
                        < /Ellipse.Fill>
                    < /椭圆>
                    < /网格和GT;
                < /控件模板>
            < /Button.Template>
        < /按钮>


解决方案

切换按钮解决方案(如在其他用户的答案的建议)可能会适合你最好的。尽管如此,我张贴的另一种方法只是为了完整起见。

XAML:

 <窗​​口x:类=WpfTestBench.PlayButton
    的xmlns =htt​​p://schemas.microsoft.com/winfx/2006/xaml/$p$psentation
    的xmlns:X =htt​​p://schemas.microsoft.com/winfx/2006/xaml
    的xmlns:wpfTestBench =CLR的命名空间:WpfTestBench
    标题=播放按钮样品>
<按钮宽度=40HEIGHT =40点击=Button_OnClick>
    < Button.Template>
        <的ControlTemplate的TargetType ={X:类型按钮}>
            <网格和GT;
                <椭圆行程=黑/>                <图像源=Play.png能见度={绑定路径= IsPlaying模块,
                    转换器= {wpfTestBench:BoolToVisibilityConverter},
                    ConverterParameter = {X:静态Visibility.Hidden}}/>                <图像源=Pause.png能见度={绑定路径= IsPlaying模块,
                    转换器= {wpfTestBench:BoolToVisibilityConverter},
                    ConverterParameter = {X:静态Visibility.Visible}}/>
            < /网格和GT;
        < /控件模板>
    < /Button.Template>
< /按钮>

codebehind:

 使用System.ComponentModel;
使用System.Windows;命名空间WpfTestBench
{
    公共部分类PLAYBUTTON
    {
        公共PLAYBUTTON()
        {
            的InitializeComponent();
            的DataContext =新SampleContext();
        }        私人无效Button_OnClick(对象发件人,RoutedEventArgs E)
        {
            VAR方面的DataContext =为SampleContext;            如果(上下文== NULL)
                返回;            context.IsPlaying = context.IsPlaying!;
        }
    }    公共类SampleContext:INotifyPropertyChanged的
    {
        私人布尔_isPlaying;        公共BOOL IsPlaying模块
        {
            {返回_isPlaying; }
            组
            {
                如果(_isPlaying ==值)
                    返回;                _isPlaying =价值;                OnPropertyChanged(IsPlaying模块);
            }
        }        公共事件PropertyChangedEventHandler的PropertyChanged;        受保护的虚拟无效OnPropertyChanged(字符串propertyName的)
        {
            VAR处理器=的PropertyChanged;            如果(处理!= NULL)
                处理器(这一点,新PropertyChangedEventArgs(propertyName的));
        }
    }
}

转换器:

 使用系统;
使用System.Globalization;
使用System.Windows;
使用System.Windows.Data;
使用System.Windows.Markup;命名空间WpfTestBench
{
    公共类BoolToVisibilityConverter:的MarkupExtension,的IValueConverter
    {
        私有静态BoolToVisibilityConverter _instance;        #区域的IValueConverter成员        公共对象转换(对象的值,类型TARGETTYPE,对象参数,CultureInfo的文化)
        {
            VAR知名度= Visibility.Hidden;            如果(参数!= NULL)
                可见=(能见度)参数;            返回知名度== Visibility.Visible
                ? (((布尔)值)Visibility.Visible:Visibility.Hidden)
                :(((布尔)值)Visibility.Hidden:Visibility.Visible);
        }        公共对象ConvertBack(对象的值,类型TARGETTYPE,对象参数,CultureInfo的文化)
        {
            返回null;
        }        #endregion        公众覆盖对象ProvideValue(的IServiceProvider的ServiceProvider)
        {
            返回_instance? (_instance =新BoolToVisibilityConverter());
        }
    }
}

I have a play button which I want to change the background image so it looks like a pause button when clicked, I have already seen many guides on how to do this however my Ellipse template seems to make my code much different from anything I have researched. Here is my Code:

        <Button HorizontalAlignment="Left" Width="40" Height="40" Click="Button_Click_2">
        <Button.Template>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Ellipse Stroke="Black">
                        <Ellipse.Fill>
                            <ImageBrush ImageSource="Images/play.png"/>
                        </Ellipse.Fill>
                    </Ellipse>
                    </Grid>
                </ControlTemplate>
            </Button.Template>
        </Button>

解决方案

ToggleButton solution (as suggested in the other user's answer) will probably suit you the best. Nevertheless, I'm posting another approach just for the completeness sake.

XAML:

<Window x:Class="WpfTestBench.PlayButton"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:wpfTestBench="clr-namespace:WpfTestBench"
    Title="Play button sample">
<Button Width="40" Height="40" Click="Button_OnClick">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Grid>
                <Ellipse Stroke="Black" />

                <Image Source="Play.png" Visibility="{Binding Path=IsPlaying, 
                    Converter={wpfTestBench:BoolToVisibilityConverter}, 
                    ConverterParameter={x:Static Visibility.Hidden}}" />

                <Image Source="Pause.png" Visibility="{Binding Path=IsPlaying, 
                    Converter={wpfTestBench:BoolToVisibilityConverter}, 
                    ConverterParameter={x:Static Visibility.Visible}}" />
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

Codebehind:

using System.ComponentModel;
using System.Windows;

namespace WpfTestBench
{
    public partial class PlayButton
    {
        public PlayButton()
        {
            InitializeComponent();
            DataContext = new SampleContext();
        }

        private void Button_OnClick(object sender, RoutedEventArgs e)
        {
            var context = DataContext as SampleContext;

            if (context == null)
                return;

            context.IsPlaying = !context.IsPlaying;
        }
    }

    public class SampleContext : INotifyPropertyChanged
    {
        private bool _isPlaying;

        public bool IsPlaying
        {
            get { return _isPlaying; }
            set
            {
                if (_isPlaying == value)
                    return;

                _isPlaying = value;

                OnPropertyChanged("IsPlaying");
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string propertyName)
        {
            var handler = PropertyChanged;

            if (handler != null)
                handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

Converter:

using System;
using System.Globalization;
using System.Windows;
using System.Windows.Data;
using System.Windows.Markup;

namespace WpfTestBench
{
    public class BoolToVisibilityConverter : MarkupExtension, IValueConverter
    {
        private static BoolToVisibilityConverter _instance;

        #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            var visibility = Visibility.Hidden;

            if (parameter != null)
                visibility = (Visibility)parameter;

            return visibility == Visibility.Visible
                ? (((bool)value) ? Visibility.Visible : Visibility.Hidden)
                : (((bool)value) ? Visibility.Hidden : Visibility.Visible);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return null;
        }

        #endregion

        public override object ProvideValue(IServiceProvider serviceProvider)
        {
            return _instance ?? (_instance = new BoolToVisibilityConverter());
        }
    }
}

这篇关于从播放更改按钮图像来暂停使用椭圆模板点击时的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆