为 CarouselView 设置 DataTemplate

Set up DataTemplate for CarouselView

您好,我正在尝试在我的 ViewModel 中设置 CarouselView。在这里,我对 ItemTemplate 的设置有问题。

设置

为了您的参考,我尝试定义 CarouselView carouselView:

CarouselView carouselView = new CarouselView()
    {
               
        ItemsSource = items,
        IndicatorView = indicatorView,
        ItemTemplate = viewDataTemplate
    };

IndicatorView 正在运行:

private IndicatorView indicatorView = new IndicatorView()
    {
        IndicatorColor = Color.LightGray,
        IndicatorSize = 10,
        SelectedIndicatorColor = Color.DarkGray,
        IndicatorsShape = IndicatorShape.Circle,
        VerticalOptions = LayoutOptions.End,
        HorizontalOptions = LayoutOptions.Center,
        Margin = new Thickness(0, 0, 0, 20)
    };

项目设置如下:

private ContentView[] CarouselItems()
        {
            ContentView[] items = new ContentView[5] {
                MapView(), SpeedView(), PaceView(), HeightView(), StepLengthView() };


            return items;

        }

        private ContentView StepLengthView()
        {
            ContentView view = new ContentView()
            {
                Content = new Label()
                {
                    Text = "Schrittlängenverlauf"
                }
            };

            return view;
        }

        private ContentView HeightView()
        {
            ContentView view = new ContentView()
            {
                Content = new Label()
                {
                    Text = "Höhenverlauf"
                }
            };

            return view;
        }

        private ContentView PaceView()
        {
            ContentView view = new ContentView()
            {
                Content = new Label()
                {
                    Text = "Balkendiagram: Pace"
                }
            };

            return view;
        }

        private ContentView SpeedView()
        {

            ContentView view = new ContentView()
            {
                Content = new Label()
                {
                    Text = "Geschwindigkeitsdiagram"
                }
            };

            return view;
        }

        private ContentView MapView()
        {
            Polygon route = new Polygon
            {
                StrokeWidth = 8,
                StrokeColor = Color.FromHex("#1BA1E2"),
                Geopath =
                {
                    new Position(47.6368678, -122.137305),
                    new Position(47.6368894, -122.134655),
                    new Position(47.6359424, -122.134655),
                    new Position(47.6359496, -122.1325521),
                    new Position(47.6424124, -122.1325199),
                    new Position(47.642463,  -122.1338932),
                    new Position(47.6406414, -122.1344833),
                    new Position(47.6384943, -122.1361248),
                    new Position(47.6372943, -122.1376912)
                }
            };

            Map map = new Map()
            {
                HasScrollEnabled = false,
                HasZoomEnabled = false,
            };

            map.MapElements.Add(route);

            ContentView view = new ContentView()
            {
                Content = map
            };

            return view;
        }

我希望我的 ItemSources 成为 ContentViews 的原因是因为我想在 CarouselView 中显示不同的想法(地图、图像、图表...)。

有错误的部分(编辑):

var viewDataTemplate = new DataTemplate(() =>
            {
                var grid = new Grid();

                var view = new ContentView();

                view.SetBinding(ContentView.ContentProperty, "Content");

                grid.Children.Add(view);

                return new ViewCell { View = grid };
            });

问题

如果我尝试 运行 我得到的代码

System.InvalidCastException: 'Specified cast is not valid.'

我认为是DataTemplate定义的问题:如果我这样注释掉相应的行:

CarouselView carouselView = new CarouselView()
    {
               
        ItemsSource = items,
        IndicatorView = indicatorView,
        //ItemTemplate = viewDataTemplate
    };

我没有收到错误,但是 CarouselView 当然没有正确显示视图(正如您在此处看到的:image)。

有没有人看到我的错误并可以帮助我。

来自CarouselView Microsoft docs

When using CarouselView, never set the root element of your DataTemplate objects to a ViewCell. This will result in an exception being thrown because CarouselView has no concept of cells.

你的viewDataTemplate不应该return一个ViewCell:

var viewDataTemplate = new DataTemplate(() =>
{
    var grid = new Grid();
    var view = new ContentView();
    view.SetBinding(ContentView.ContentProperty, "Content");
    grid.Children.Add(view);
    return grid;
});