首页 > 解决方案 > Xamarin.Forms。像 Telegram 一样滑动到上一页

问题描述

如何创建向后滑动?

在 iOS 中:

[assembly: ExportRenderer(typeof(HIPSTO.Controls.CustomContentPage), typeof(HIPSTO.iOS.Platform.Renderers.IOSPageRenderer))]     
namespace HIPSTO.iOS.Platform.Renderers 
{
    public class IOSPageRenderer : PageRenderer        
    {         
      public override void ViewWillAppear(bool animated)            
      {              
        base.ViewWillAppear(animated);

        ViewController.NavigationController.InteractivePopGestureRecognizer.Enabled = true;
        ViewController.NavigationController.InteractivePopGestureRecognizer.Delegate = new UIKit.UIGestureRecognizerDelegate();
       }
    }
}

但它只适用于边缘。从任何地方都需要。没有安卓的想法

如下图所示:

在此处输入图像描述

标签: androidxamarin.iosswipe

解决方案


首先,您可以通过 android 中的 NavigationPageRenderer 来实现。

这是这个演示的 GIF

在此处输入图像描述

TransitionNavigationPageRender.cs

[assembly: ExportRenderer(typeof(SwipePageDemo.Controls.TransitionNavigationPage), typeof(TransitionNavigationPageRenderer))]
namespace SwipePageDemo.Droid.Renderers
{
public class TransitionNavigationPageRenderer : NavigationPageRenderer
{


    public TransitionNavigationPageRenderer(Context context) : base(context)
    {
    }



    protected override void SetupPageTransition(Android.Support.V4.App.FragmentTransaction transaction, bool isPush)
    {

                if (isPush)
                {

                }
                else
                {
                    transaction.SetCustomAnimations(Resource.Animation.enter_left, Resource.Animation.exit_right,
                                                    Resource.Animation.enter_right, Resource.Animation.exit_left);
                }

    }
}
}

enter_left.xml

<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
  android:propertyName="enter_from_left"
  android:shareInterpolator="false">
<translate
  android:fromXDelta="-100%" android:toXDelta="0%"
  android:fromYDelta="0%" android:toYDelta="0%"
  android:duration="300"/>
</set>

enter_right.xml

<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
  <translate
     android:fromXDelta="100%" android:toXDelta="0%"
     android:fromYDelta="0%" android:toYDelta="0%"
     android:duration="300" />
</set>

exit_left.xml

<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
 <translate
  android:fromXDelta="0%" android:toXDelta="-100%"
  android:fromYDelta="0%" android:toYDelta="0%"
  android:duration="300"/>
</set>

exit_right.xml

<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<translate
  android:fromXDelta="0%" android:toXDelta="100%"
  android:fromYDelta="0%" android:toYDelta="0%"
  android:duration="300" />
</set>

如果您想了解有关 Page Transition 的更多详细信息,可以参考此链接。 https://github.com/jsuarezruiz/xamarin-forms-page-transitions

但它只适用于边缘。从任何地方都需要

你可以通过类的threshold属性来实现它SwipeGestureRecognizer

SwipeGestureRecognizer 类还包括一个 Threshold 属性,可以选择将其设置为一个 uint 值,该值表示必须达到的最小滑动距离,以与设备无关的单位识别滑动。此属性的默认值为 100,这意味着任何少于 100 个与设备无关的单位的滑动都将被忽略。如果你想增加可以滑动的区域,你可以像下面的代码一样减少这个阈值的数据。

        var leftSwipeGesture = new SwipeGestureRecognizer { Direction = SwipeDirection.Right };
        leftSwipeGesture.Threshold = 50;
        leftSwipeGesture.Swiped += (sender, e) => Navigation.PopAsync();
       stackLayout.GestureRecognizers.Add(leftSwipeGesture);

我将 leftSwipeGesture.Threshold 的值更改为 50,这是滑动的 GIF。 在此处输入图像描述


推荐阅读