Xamarin.Forms 监听Button的按下、释放事件

Xamarin.Forms 监听Button的按下、释放事件

工作中遇到这样的一个需求，模仿微信发生语音功能，需要实现按钮按下开始录音，按钮释放录音结束，

Xamarin.Forms中Button没有这样的事件，那么我们如何实现对Button按下，释放两个事件的监听呢？

当然这里我们再次用到了CustomRenderer，一旦遇到Xamrin.Forms无法实现的某些功能，我们就可以

通过CustomRenderer来处理。

首先：我们自定义一个VoiceRecordButton继承于Button

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Text;
using System.Windows.Input;
using Xamarin.Forms;

namespace XFPractice.CustomView
{
    public class VoiceRecordButton: Button
    {

        public ICommand StartCommand { get; set; }
        public ICommand EndCommand { get; set; }

        public VoiceRecordButton()
        {
            StartCommand = new Command(()=> {
                Debug.WriteLine(" StartCommand =========== ");
            });

            EndCommand = new Command(() => {
                Debug.WriteLine(" EndCommand =========== ");
            });
        }

    }
}

然后分别编写各个平台自己的VoiceRecordButtonRenderer：

Android：

通过IOnTouchListener来监听用户对Button的操作。

using Android.Views;
using XFPractice.CustomView;
using XFPractice.Droid.Renderers;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;
using static Android.Views.View;

[assembly: ExportRenderer(typeof(VoiceRecordButton), typeof(VoiceRecordButtonRenderer))]
namespace XFPractice.Droid.Renderers
{
    public class VoiceRecordButtonRenderer:ButtonRenderer,IOnTouchListener
    {
        VoiceRecordButton view;

        public bool OnTouch(Android.Views.View v, MotionEvent e)
        {
            switch(e.Action)
            {
                case MotionEventActions.Down:
                    view?.StartCommand?.Execute("");
                    break;
                case MotionEventActions.Up:
                     view?.EndCommand?.Execute("");
                    break;
            }
            return true;
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Button> e)
        {
            base.OnElementChanged(e);

            Control.SetOnTouchListener(this);

            if (e.NewElement != null)
                view = e.NewElement as VoiceRecordButton;
        }

    }
}

iOS:

通过对TouchDown、TouchUpInside、TouchUpOutside三个事件的处理。

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;

using Foundation;
using XFPractice.CustomView;
using XFPractice.iOS.Renderers;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(VoiceRecordButton), typeof(VoiceRecordButtonRenderer))]
namespace XFPractice.iOS.Renderers
{
    public class VoiceRecordButtonRenderer : ButtonRenderer
    {
        VoiceRecordButton view;

        public VoiceRecordButtonRenderer()
        {
            
        }


        protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
        {
            base.OnElementChanged(e);

            if (e.NewElement != null)
                view = e.NewElement as VoiceRecordButton;
            Control.TouchDown += Control_TouchDown;
            Control.TouchUpInside += Control_TouchUpInside;
            Control.TouchUpOutside += Control_TouchUpOutside;
        }

        private void Control_TouchUpOutside(object sender, EventArgs e)
        {
            view?.EndCommand?.Execute("");
        }

        private void Control_TouchUpInside(object sender, EventArgs e)
        {
            view?.EndCommand?.Execute("");
        }

        private void Control_TouchDown(object sender, EventArgs e)
        {
            view?.StartCommand?.Execute("");
        }
    }
}

UWP:

UWP有一个Holding事件，但是对鼠标无效，只对触摸有效，这里我们采用了PointerEventHandler来处理。

using XFPractice.CustomView;
using XFPractice.UWP.Renderers;
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Windows.UI.Input;
using Windows.UI.Xaml.Input;
using Xamarin.Forms.Platform.UWP;

[assembly: ExportRenderer(typeof(VoiceRecordButton), typeof(VoiceRecordButtonRenderer))]
namespace XFPractice.UWP.Renderers
{
    public class VoiceRecordButtonRenderer:ButtonRenderer
    {
        VoiceRecordButton view;


        public VoiceRecordButtonRenderer()
        {
        }

        

        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Button> e)
        {
            base.OnElementChanged(e);

            
            if (e.NewElement != null)
            {
                view = e.NewElement as VoiceRecordButton;
            }
            Control.AddHandler(PointerReleasedEvent, new PointerEventHandler(Control_PointerReleased), true);
            Control.AddHandler(PointerPressedEvent, new PointerEventHandler(Control_PointerPressed), true);
        }

        private void Control_PointerPressed(object sender, PointerRoutedEventArgs e)
        {
            view?.StartCommand?.Execute("");
        }

        private void Control_PointerReleased(object sender, PointerRoutedEventArgs e)
        {
            view?.EndCommand?.Execute("");
        }

        
         }
}

这样我们就能监听Button的按下、和释放操作。