C# 是否可以在转盘视图上显示多个项目？

我想在xamarin表单的旋转木马视图上同时显示3个项目

我正在使用可在此处找到的自定义旋转视图：。 但是，每个视图仅显示1个项目

这是我所做工作的一个例子

  public class Example : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;


        private string _titulo;
        public string Titulo
        {
            get
            {
                return _titulo;
            }
            set
            {
                _titulo = value;
                OnPropertyChanged(nameof(Titulo));
            }
        }

        private Color _cor;
        public Color Cor
        {
            get
            {
                return _cor;
            }
            set
            {
                _cor = value;
                OnPropertyChanged(nameof(Cor));
            }
        }

        public Example(string a, Color b)
        {
            Titulo = a;
            Cor = b;
        }

        #region INotifyPropertyChanged Implementation
        void OnPropertyChanged([CallerMemberName] string propertyName = "")
        {
            if (PropertyChanged == null)
                return;

            PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
        #endregion
    }

    public class TesteViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        private ObservableCollection<Example> _fonte;
        public ObservableCollection<Example> Fonte
        {
            get
            {
                return _fonte;
            }
            set
            {
                _fonte = value;
                OnPropertyChanged(nameof(Fonte));
            }
        }

        public TesteViewModel()
        {
            Fonte = new ObservableCollection<Example>()
            {
                new Example("Gratidão", Color.Red),
                new Example("Vitórias", Color.Green),
                new Example("Objectivos do ano", Color.Blue)
            };
        }

        #region INotifyPropertyChanged Implementation
        void OnPropertyChanged([CallerMemberName] string propertyName = "")
        {
            if (PropertyChanged == null)
                return;

            PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
        #endregion

    }

    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class teste : ContentPage
    {

        public teste()
        {
            BindingContext = new TesteViewModel();
            InitializeComponent();
            carrouusel.SetBinding(CardsView.ItemsSourceProperty, nameof(TesteViewModel.Fonte));
        }

    }

---

我想在每个视图中并排显示3个项目。如图所示：

如果您想在每个视图中并排显示3个项目，您可以自定义card:CarouseView的内容视图，现在您只需在其中放置一个框架，您可以将其更改为：

<cards:CarouselView.ItemTemplate>
    <DataTemplate>
        <ContentView>

            <StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" HeightRequest="100" WidthRequest="300">

                <Frame HeightRequest="100" WidthRequest="100" Padding="0" HasShadow="false" IsClippedToBounds="true" CornerRadius="0" BackgroundColor="Red">
                    <Label Text="Titulo" TextColor="Black"/>
                </Frame>

                <Frame HeightRequest="100" WidthRequest="100" Padding="0" HasShadow="false" IsClippedToBounds="true" CornerRadius="0" BackgroundColor="Green">
                    <Label Text=" Titulo" TextColor="Black"/>
                </Frame>

                <Frame HeightRequest="100" WidthRequest="100" Padding="0" HasShadow="false" IsClippedToBounds="true" CornerRadius="0" BackgroundColor="Yellow">
                    <Label Text="Titulo" TextColor="Black"/>
                </Frame>

            </StackLayout>

        </ContentView>
    </DataTemplate>
</cards:CarouselView.ItemTemplate>

---

并为图像提供widthrequest和heightRequest。

如果您想在每个视图中并排显示3个项目，您可以自定义card:CarouseView的内容视图，现在您只在其中放置一个框架，您可以将其更改为：

<cards:CarouselView.ItemTemplate>
    <DataTemplate>
        <ContentView>

            <StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" HeightRequest="100" WidthRequest="300">

                <Frame HeightRequest="100" WidthRequest="100" Padding="0" HasShadow="false" IsClippedToBounds="true" CornerRadius="0" BackgroundColor="Red">
                    <Label Text="Titulo" TextColor="Black"/>
                </Frame>

                <Frame HeightRequest="100" WidthRequest="100" Padding="0" HasShadow="false" IsClippedToBounds="true" CornerRadius="0" BackgroundColor="Green">
                    <Label Text=" Titulo" TextColor="Black"/>
                </Frame>

                <Frame HeightRequest="100" WidthRequest="100" Padding="0" HasShadow="false" IsClippedToBounds="true" CornerRadius="0" BackgroundColor="Yellow">
                    <Label Text="Titulo" TextColor="Black"/>
                </Frame>

            </StackLayout>

        </ContentView>
    </DataTemplate>
</cards:CarouselView.ItemTemplate>

---

并为图像提供宽度请求和高度请求。

我在此处创建的HorizontalListView处理此场景：

您只需将ColumnCount设置为3，然后根据需要捕捉到“开始”或“居中”：

<renderedViews:HorizontalListView Grid.Row="3"
                                  Margin="-16,8"
                                  CollectionPadding="8,8"
                                  ItemSpacing="8"
                                  ColumnCount="3"
                                  ItemsSource="{Binding SillyPeopleLoader.Result}"
                                  SnapStyle="Start">

您还可以在此处找到博客文章的详细信息：

---

我在这里创建的HorizontalListView处理此场景：

您只需将ColumnCount设置为3，然后根据需要捕捉到“开始”或“居中”：

<renderedViews:HorizontalListView Grid.Row="3"
                                  Margin="-16,8"
                                  CollectionPadding="8,8"
                                  ItemSpacing="8"
                                  ColumnCount="3"
                                  ItemsSource="{Binding SillyPeopleLoader.Result}"
                                  SnapStyle="Start">

您还可以在此处找到博客文章的详细信息：

---

这个被标记为正确的答案不是我想要实现的。这个被标记为正确的答案不是我想要实现的。是的。它将显示。但当滑动到下一个项目时，动画也会显示下3个项目，而不仅仅是1个。我希望滑动显示当前内容视图中显示的3个项目中显示的下一个元素。@Kelve是否希望第一个视图显示3个项目，下一个视图仅显示1个项目？@Kelve或者希望旋转视图可滚动，项目逐个显示，并且contentView上始终有3个项目？是@Jack，第二个选项。我想显示第一个项目，即选中的项目和接下来的两个项目。当用户进行滑动时，内容视图中显示的下一项将被选中。@Kelve我认为您必须使用旋转视图而不是旋转视图。是的。它将显示。但当滑动到下一个项目时，动画也会显示下3个项目，而不仅仅是1个。我希望滑动显示当前内容视图中显示的3个项目中显示的下一个元素。@Kelve是否希望第一个视图显示3个项目，下一个视图仅显示1个项目？@Kelve或者希望旋转视图可滚动，项目逐个显示，并且contentView上始终有3个项目？是@Jack，第二个选项。我想显示第一个项目，即选中的项目和接下来的两个项目。当用户进行滑动时，将选择内容视图中显示的下一项。@Kelve我认为您必须使用，而不是CarouselView.Hi。只有一个问题，可以有循环列表吗？嗨。只有一个问题，有没有可能有循环列表？