如何访问 CarouselView Xamarin.Forms 中的对象

Question

我有一个 Xamarin.Forms 应用程序，它在 CarouselView 中显示一个 ViewFlipper ( https://github.com/TorbenK/ViewFlipper )。

我希望 ViewFlipper 在轮播内更改页面时翻转回前面。 但我似乎无法弄清楚如何访问 ViewFlipper。

我有以下工作代码：

public class CarouselContent
{
    public string FrontImg { get; set; }
    public string BackImg { get; set; }
}

public class MainPage : ContentPage
{
    public MainPage()
    {
        var pages = new ObservableCollection<CarouselContent>();

        var page1 = new CarouselContent();
        page1.FrontImg = "page1Front";
        page1.BackImg = "page1Back";

        var page2 = new CarouselContent();
        page2.FrontImg = "page2Front";
        page2.BackImg = "page2Back";

        pages.Add(page1);
        pages.Add(page2);

        var carouselView = new Carousel(pages);

        Content = carouselView;
    }
}

public class Carousel : AbsoluteLayout
{
    private DotButtonsLayout dotLayout;
    private CarouselView carousel;

    public Carousel(ObservableCollection<CarouselContent> pages)
    {
        carousel = new CarouselView();

        var template = new DataTemplate(() =>
        {
            //create page
            var absLayout = new AbsoluteLayout();

            //create images for the flipper
            var frontImg = new Image
            {
                Aspect = Aspect.AspectFit
            };
            frontImg.SetBinding(Image.SourceProperty, "FrontImg");

            var backImg = new Image
            {
                Aspect = Aspect.AspectFit
            };
            backImg.SetBinding(Image.SourceProperty, "BackImg");

            //create flipper
            var flipper = new ViewFlipper.FormsPlugin.Abstractions.ViewFlipper();
            flipper.FrontView = frontImg;
            flipper.BackView = backImg;              

            //Add flipper to page
            absLayout.Children.Add(flipper);

            return absLayout;
        });

        carousel.ItemsSource = pages;
        carousel.ItemTemplate = template;

        Children.Add(carousel);
    }
}

我尝试将 ViewFlipper 添加到 CarouselContent 但我无法让它工作。 有任何想法吗？

编辑：

我尝试使用可绑定项目创建一个 AbsoluteLayout 并绑定 CarouselView 数据模板中 CarouselContent 中创建的项目，但行 '(b as BindableAbsLayout).Children.Add((View)v);' 在 BindableAbsLayout 中永远不会被调用。 我究竟做错了什么？

class BindableAbsLayout : AbsoluteLayout
{
    public static readonly BindableProperty ItemsProperty =
        BindableProperty.Create(nameof(Items), typeof(ObservableCollection<View>), typeof(BindableAbsLayout), null,
            propertyChanged: (b, o, n) =>
            {
                (n as ObservableCollection<View>).CollectionChanged += (coll, arg) =>
                {
                    switch (arg.Action)
                    {
                        case NotifyCollectionChangedAction.Add:
                            foreach (var v in arg.NewItems)
                                (b as BindableAbsLayout).Children.Add((View)v);
                            break;
                        case NotifyCollectionChangedAction.Remove:
                            foreach (var v in arg.NewItems)
                                (b as BindableAbsLayout).Children.Remove((View)v);
                            break;
                    }
                };
            });

    public ObservableCollection<View> Items
    {
        get { return (ObservableCollection<View>)GetValue(ItemsProperty); }
        set { SetValue(ItemsProperty, value); }
    }
}


public class CarouselContent
{
    private ViewFlipper.FormsPlugin.Abstractions.ViewFlipper _flipper;
    private ObservableCollection<View> _items;

    public ObservableCollection<View> Items
    {
        get { return _items; }
    }

    public CarouselContent(string frontImgStr, string backImgStr)
    {
        _items = new ObservableCollection<View>();

        _flipper = new ViewFlipper.FormsPlugin.Abstractions.ViewFlipper();

        var frontImg = new Image
        {
            Aspect = Aspect.AspectFit
        };
        frontImg.Source = frontImgStr;

        var backImg = new Image
        {
            Aspect = Aspect.AspectFit
        };
        backImg.Source = backImgStr;

        _flipper.FrontView = frontImg;
        _flipper.BackView = backImg;

        AbsoluteLayout.SetLayoutBounds(_flipper, new Rectangle(0.5, 0.05, 0.85, 0.85));
        AbsoluteLayout.SetLayoutFlags(_flipper, AbsoluteLayoutFlags.All);

        Items.Add(_flipper);
    }
}


public class Carousel : AbsoluteLayout
{
    private DotButtonsLayout dotLayout;
    private CarouselView carousel;

    public Carousel(ObservableCollection<CarouselContent> pages)
    {
        carousel = new CarouselView();

            var template = new DataTemplate(() =>
            {
                var absLayout = new BindableAbsLayout();
                absLayout.BackgroundColor = Color.FromHex("#68BDE4");
                absLayout.SetBinding(BindableAbsLayout.ItemsProperty,"Items");
                return absLayout;
            });

        carousel.ItemsSource = pages;
        carousel.ItemTemplate = template;

        Children.Add(carousel);
    }
}

Answer 1

不确定这里的最佳实践是什么，但您可以尝试通过 ItemSelected 事件访问它（每次在轮播视图中来回更改时都会触发）

接线

carousel.ItemSelected += carouselOnItemSelected;

获取您的 ViewFlipper

private void carouselOnItemSelected(object sender, SelectedItemChangedEventArgs selectedItemChangedEventArgs)
        {
            CarouselContent carouselContent = selectedItemChangedEventArgs.SelectedItem;
            ViewFlipper viewFlipper = carouselContent.Children[0];
            viewFlipper.FlipState = ViewFlipper.FrontView;
        }