1. 程式人生 > >菜鳥的Xamarin.Forms前行之路——按鈕的按下擡起事件的監控(可擴展至其他事件)

菜鳥的Xamarin.Forms前行之路——按鈕的按下擡起事件的監控(可擴展至其他事件)

override 點擊 names div prot tco nco nbsp 容易

提問:監控按鈕的點擊事件,可以通過按鈕的Click事件,或者Command綁定,那麽如何監控按鈕的按下與擡起,或者移動,長按,雙擊等事件?

解決方法:各個平臺自定義渲染依賴註入.

共享項目PCL:

1先定義一個繼承Button的實體類NewButton.cs

    public class NewButton : Button
    {
        public event EventHandler Pressed;
        public event EventHandler Released;

        public virtual void OnPressed()
        {
            Pressed?.Invoke(this, EventArgs.Empty);
        }

        public virtual void OnReleased()
        {
            Released?.Invoke(this, EventArgs.Empty);
        }
    }

2定義一個NewButton的控件TestControl(相當新建一個頁面,只不過是個部分頁面,繼承contentView而不是contentpage )

xaml:

<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Sample.TestControl">
<ContentView.Content>
<StackLayout x:Name="TheContent">
</StackLayout>
</ContentView.Content>
</ContentView>

cs:

    public partial class TestControl: ContentView
    {
        public TestControl()
        {
            InitializeComponent();
            var myButton = new NewButton
            {
                Text = "自定義按鈕",
                HorizontalOptions = LayoutOptions.FillAndExpand
            };
            TheContent.Children.Add(myButton);

            myButton.Pressed += (sender, args) =>
            {
                myButton.BackgroundColor = Color.Red;
            };
            myButton.Released += (sender, args) =>
            {
                myButton.BackgroundColor = Color.Blue;
            };
        }
    }

Android項目:

添加一個NewButtonRenderer.cs文件自定義渲染並註入:

[assembly: ExportRenderer(typeof(NewButton), typeof(NewButtonRenderer))]
namespace Sample.Droid
{
    class NewButtonRenderer: ButtonRenderer
    {
        protected override void  OnElementChanged(ElementChangedEventArgs<Button> e)
        {
            base.OnElementChanged(e);

            var TestButton = e.NewElement as NewButton;

            var thisButton = Control as Android.Widget.Button;
            thisButton.Touch += (object sender, TouchEventArgs args) =>
            {
                if (args.Event.Action == MotionEventActions.Down)
                {
                    TestButton.OnPressed();
                }
                else if (args.Event.Action == MotionEventActions.Up)
                {
                    TestButton.OnReleased();
                }
            };
        }
    }
}

Ios項目:

類似安卓項目,也是自定義渲染和註入

[assembly: ExportRenderer(typeof(NewButton), typeof(NewButtonRenderer))]
namespace Sample.iOS
{
    public class NewButtonRenderer : ButtonRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Button> e)
        {
            base.OnElementChanged(e);

            var TestButton = e.NewElement as NewButton;

            var thisButton = Control as UIButton;
            thisButton.TouchDown += delegate
            {
                TestButton.OnPressed();
            };
            thisButton.TouchUpInside += delegate
            {
                TestButton.OnReleased();
            };
        }
    }
}

這樣共享項目和2個平臺之間的方法就實現了統一,在按下與擡起的時候,都能夠監控事件

用法: 

在布局頁面引入控件(上述TestControl)所在的命名空間,然後引入控件即可,例:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:controls="clr-namespace:Sample"
             x:Class="Sample.TestPage">
    <StackLayout>
        <controls:TestControl />
    </StackLayout>
</ContentPage>

擴展:

因為這些方法都是自己在平臺自定義渲染的,所以可以很方便的監控原生事件,例如長按,雙擊等等,只需要基本了解一下安卓和蘋果的東西,再結合上述的例子,就很容易擴展了

git項目地址: https://github.com/weiweu/TestProject/tree/dev

  

菜鳥的Xamarin.Forms前行之路——按鈕的按下擡起事件的監控(可擴展至其他事件)