Android上的Xamarin.Forms手势

时间:2017-10-24 21:42:55

标签: android xamarin xamarin.forms

可以使用Gesture在SnapChat上滑动页面吗?我有类似的东西,但它没有用。当然我有接口和课程,但我不知道如何实现它一切正常。我想在SnapChat上滑动左侧页面和右侧页面,并在滑动时更改颜色背景。

  SwipeListener swipeListener = new SwipeListener(przeglad, this);

  public void onLeftSwipe(View view)
    {
        if (view == przeglad)
        {
            Page ne = new SrchPage();
        }
    }

接口:

public interface ISwipeCallBack
{
    void onLeftSwipe(View view);
    void onRightSwipe(View view);
    void onTopSwipe(View view);
    void onBottomSwipe(View view);
    void onNothingSwiped(View view);
}

刷卡类:

 public class SwipeListener : PanGestureRecognizer
{

    private ISwipeCallBack mISwipeCallback;
    private double translatedX = 0, translatedY = 0;

    public SwipeListener(View view , ISwipeCallBack iSwipeCallBack)
    {

        mISwipeCallback = iSwipeCallBack;
        var panGesture = new PanGestureRecognizer();
        panGesture.PanUpdated += OnPanUpdated;
        view.GestureRecognizers.Add(panGesture);
    }

    void OnPanUpdated(object sender, PanUpdatedEventArgs e)
    {

        View Content = (View)sender;

        switch (e.StatusType)
        {

            case GestureStatus.Running:

                try
                {
                    translatedX = e.TotalX;
                    translatedY = e.TotalY;
                }
                catch (Exception err)
                {
                    System.Diagnostics.Debug.WriteLine("" + err.Message);
                }
                break;

            case GestureStatus.Completed:

                System.Diagnostics.Debug.WriteLine("translatedX : " + translatedX);
                System.Diagnostics.Debug.WriteLine("translatedY : " + translatedY);

                if (translatedX < 0 && Math.Abs(translatedX) > Math.Abs(translatedY))
                {
                    mISwipeCallback.onLeftSwipe(Content);
                }
                else if (translatedX > 0 && translatedX > Math.Abs(translatedY))
                {
                    mISwipeCallback.onRightSwipe(Content);
                }
                else if (translatedY < 0 && Math.Abs(translatedY) > Math.Abs(translatedX))
                {
                    mISwipeCallback.onTopSwipe(Content);
                }
                else if (translatedY > 0 && translatedY > Math.Abs(translatedX))
                {
                    mISwipeCallback.onBottomSwipe(Content);
                }
                else
                {
                    mISwipeCallback.onNothingSwiped(Content);
                }

                break;

        }
    }

}

XML:

<Grid RowSpacing="10" Padding="30" VerticalOptions="Center"  x:Name="przeglad">

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>

                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>

                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

             <Button  Grid.Row="2"  Text="{resource:TranslateExtension Szukaj}"
                BorderRadius="30"
                BackgroundColor="#80FFFFFF"

                FontSize="18"
                TextColor="#330025"
                BorderWidth="4"
                BorderColor="#ffdbdb"
                Clicked="Button_Clicked_1"
              FontAttributes="Bold"/>

             <Button  Grid.Row="3"  Text="{resource:TranslateExtension Mapa}"
                BorderRadius="30"
                BackgroundColor="#80FFFFFF"
                FontSize="18"
                TextColor="#330025"                    
                BorderWidth="4"
                BorderColor="#ffdbdb"
                Clicked="Button_Clicked"
               FontAttributes="Bold"/>

        </Grid>

1 个答案:

答案 0 :(得分:0)

我认为您需要的是ViewPager,它涵盖了您原始视图的透明背景。

例如,像这样创建你的布局:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  <ImageView
      android:id="@+id/img"
      android:layout_height="match_parent"
      android:layout_width="match_parent"
      android:src="@drawable/BG" />
  <android.support.v4.view.ViewPager android:id="@+id/viewpager"
                                     android:layout_height="match_parent"
                                     android:layout_width="match_parent"
                                     android:background="@android:color/transparent" />
</FrameLayout>

在代码中,首先为ViewPager创建一个适配器:

public class MyVPAdapter : PagerAdapter
{
    private Context context;
    private List<PItemModel> list;

    public MyVPAdapter(Context _context, List<PItemModel> _list)
    {
        context = _context;
        list = _list;
    }

    public override int Count
    {
        get { return list.Count; }
    }

    public override bool IsViewFromObject(View view, Java.Lang.Object obj)
    {
        return view == obj;
    }

    public override void DestroyItem(View container, int position, Java.Lang.Object view)
    {
        var viewpager = container.JavaCast<ViewPager>();
        viewpager.RemoveView(view as View);
    }

    public override Java.Lang.Object InstantiateItem(View container, int position)
    {
        ImageView tile = new ImageView(context);
        tile.SetImageResource(list[position].TileId);
        var viewpager = container.JavaCast<ViewPager>();
        viewpager.AddView(tile);
        return tile;
    }
}

在代码背后:

protected override void OnCreate(Bundle savedInstanceState)
{
    base.OnCreate(savedInstanceState);

    // Create your application here
    SetContentView(Resource.Layout.layout2);

    ViewPager pager = FindViewById<ViewPager>(Resource.Id.viewpager);
    List<PItemModel> list = new List<PItemModel>();
    list.Add(new PItemModel() { TileId = Resource.Drawable.BackButton });
    list.Add(new PItemModel() { TileId = Resource.Drawable.solidimg });
    var adapter = new MyVPAdapter(this, list);
    pager.Adapter = adapter;
} 

PItemModel很简单:

public class PItemModel
{
    public int TileId { get; set; }
}

最后一个问题,您在上一个案例的评论中提供的链接喜欢在照片上添加图块,ViewPager应放在TextureView上,用于展示相机流。在这里,我只使用ImageView进行演示。

<强>更新

很抱歉,我刚刚意识到您正在使用XF进行开发,而不是应该为视图创建Custom Renderer,并在Android客户端项目中实现上面的代码,{{1}中的代码应该移动到客户端项目中的视图渲染器的实现中。