Xamarin.Forms中的二维滚动

时间:2014-12-15 05:27:43

标签: android xamarin.ios xamarin.android windows-phone-8.1 xamarin.forms

是xamarin.forms的新手,我正在尝试使用二维滚动创建一个自己的滚动查看器。我已经使用Android,我已经通过从FrameLayout派生它并使用所有action_down初始化卷轴来实现相同的行为,它出现的事件很好。

但现在真正的问题是我找不到类似于Android的任何东西(在xamarin.forms默认布局和控件中),而且我很难想出一个粗略的想法。

该场景在视图中加载了几十个TextBlocks,就像网格布局一样,它应该垂直和水平以及对角滚动。

我是否应该通过为每个平台创建一个单独的滚动来使用渲染器来处理它,或者在xamarin.forms中是否可以使用它来为它提供一个提示。

提前致谢。

Dinesh kumar

1 个答案:

答案 0 :(得分:0)

没有自定义渲染器是不可能的。除了在iOS中,行为在那里按预期工作。但是,这目前不适用于Windows Phone。

这是我编写的一个示例课程。只需将某些内容传递给包含换行符的text属性即可。我会推荐来自http://i-tools.org/lorem的东西,只输出纯文本,每行1个句子,每个段落1行,如果你被困在想法中,用'\ n'结束每一行。

public class BothDirectionsScrollPage : ContentPage
{
    public BothDirectionsScrollPage(string title, string text)
    {
        this.Title = title;
        var count = 0;
        var splittext = text.Split('\n');
        var stack = new StackLayout();
        foreach (var line in splittext)
        {
            var label = new Label
            {
                Font = Font.SystemFontOfSize(NamedSize.Medium),
                LineBreakMode = LineBreakMode.NoWrap,
                FormattedText = new FormattedString()
                {
                    Spans = {new Span {Text = line}}
                }
            };
            stack.Children.Add(label);
            count++;
        }
        var scroll = new ScrollView
        {
            Padding = 0,
            WidthRequest = 500,
            Content = stack,
            VerticalOptions = LayoutOptions.FillAndExpand,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Orientation = ScrollOrientation.Horizontal
        };
        Content = new ScrollView()
        {
            Content = scroll,
            VerticalOptions = LayoutOptions.FillAndExpand,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Orientation = ScrollOrientation.Vertical,

        };
    }
}

这是您需要在Android项目中包含的自定义渲染器。

using System;
using Android.Views;
using Your.Namespace.Droid.Renderers
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(ScrollView), typeof(CustomScrollViewRenderer))]

namespace Your.Namespace.Droid.Renderers
{
        /// <summary>
    /// Used to allow horizontal and vertical scroll views. Xamarin.Android does not bubble the     events down correctly.
    /// </summary>
    public class CustomScrollViewRenderer : ScrollViewRenderer
    {

        private float StartX, StartY;
        private int IsHorizontal = -1;

        protected override void OnElementChanged(VisualElementChangedEventArgs e)
        {
            base.OnElementChanged(e);
            if (((ScrollView) e.NewElement).Orientation == ScrollOrientation.Horizontal) IsHorizontal = 1;

        }

        public override bool DispatchTouchEvent(MotionEvent e)
        {
            switch (e.Action)
            {
                case MotionEventActions.Down:
                    StartX = e.RawX;
                    StartY = e.RawY;
                    this.Parent.RequestDisallowInterceptTouchEvent(true);
                    break;
                case MotionEventActions.Move:
                    if (IsHorizontal*Math.Abs(StartX - e.RawX) < IsHorizontal*Math.Abs(StartY - e.RawY))
                        this.Parent.RequestDisallowInterceptTouchEvent(false);
                    break;
                case MotionEventActions.Up:
                    this.Parent.RequestDisallowInterceptTouchEvent(false);
                    break;
            }

            return base.DispatchTouchEvent(e);
        }

    }
}

归功于Xavyer http://forums.xamarin.com/discussion/20834/horizontal-scrollview-within-vertical-scrollview