Xamarin 形成类似视频滚动的 tiktok

问：

我试图创建一个像 tiktok 一样的视频滚动，使用 xamarin 表单。我已经设法创建了视频列表的数据模型，并且带有视频的视频列表显示但未全屏显示。

我的问题：在我的 xalm 代码中，我只想全屏显示一个视频，而不是用户全屏显示下一个或上一个视频（如 tiktok）

这是我的 xalm 代码：

<?xml version="1.0" encoding="UTF-8" ?>
<ContentPage
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:videoplayer="clr-namespace:Octane.Xamarin.Forms.VideoPlayer;assembly=Octane.Xamarin.Forms.VideoPlayer"
    x:Class="lf.MyPages.Lomy.Discover" x:Name="leafDiscoverPage">


    <Grid>

         <CollectionView x:Name="VideosCollectionView"
                        ItemsLayout="VerticalList"
                        RemainingItemsThreshold="1"
                        Scrolled="OnScrolled"
                        RemainingItemsThresholdReached="OnRemainingItemsThresholdReached">
            <CollectionView.ItemTemplate>
               <DataTemplate>
    <Grid HeightRequest="{Binding Source={x:Reference leafDiscoverPage}, Path=Height}"
          WidthRequest="{Binding Source={x:Reference leafDiscoverPage}, Path=Width}">
        <!-- Replace 'octane:VideoPlayer' with your actual video player control namespace -->
        <videoplayer:VideoPlayer Source="{Binding UserVideoBlobAdress}"
                            AutoPlay="{Binding IsPlaying}"
                            HorizontalOptions="FillAndExpand"
                            VerticalOptions="FillAndExpand" />
        <!-- Add other UI elements as needed -->
    </Grid>
</DataTemplate>

            </CollectionView.ItemTemplate>
        </CollectionView>

    </Grid>
</ContentPage>

我的.cs代码：

public partial class Discover : ContentPage
    {
        MyUser UserConnected;
        ObservableRangeCollection<UserVideoModel> MyListVideo;
        private int _videoCount = 0;


        public LeafDiscover ()
        {
            InitializeComponent ();
            MyListVideo = new ObservableRangeCollection<UserVideoModel>();

            // Initialize your ListVideo with initial video links
            UserConnected = (MyUser)App.GetProperties("UserConnected");

            OnInitVideoList();

        }

        public void UpdateVideoUrl(List<UserVideoModel> tmpuservideo)
        {
            foreach (var tmpvide in tmpuservideo)
            {
                tmpvide.UserVideoBlobAdress = "https://fo.blob.net/app/"+tmpvide.UserVideoBlobAdress;
            }
        }


        async void OnInitVideoList()
        {
            var MyInitVideo = await VideosManager.GetVideoAsync(UserConnected.MyId.ToString(), false, "");
            UpdateVideoUrl(MyInitVideo);

            foreach (var tmpvide in MyInitVideo)
            {
                Console.WriteLine("mook "+ tmpvide.UserVideoBlobAdress);
            }


            MyListVideo.AddRange(MyInitVideo);

            VideosCollectionView.ItemsSource = MyListVideo;


        }

        private void OnRemainingItemsThresholdReached(object sender, EventArgs e)
        {
            if (_videoCount >= 20)
            {
                // Load more videos or handle the end of the list
                _videoCount = 0;
            }
        }

        private void OnScrolled(object sender, ItemsViewScrolledEventArgs e)
        {
            // Determine the visible item and update playback
            var centerIndex = e.CenterItemIndex;
            UpdateVideoPlayback(centerIndex);
        }

        private void UpdateVideoPlayback(int centerIndex)
        {
            for (int i = 0; i < MyListVideo.Count; i++)
            {
                MyListVideo[i].IsPlaying = i == centerIndex;
            }
        }

        protected override void OnAppearing()
        {
            base.OnAppearing();
            // Optionally start playing the first video or the video in the center
            if (MyListVideo.Count > 0)
            {
                MyListVideo[0].PlayVideo(); // or another index if needed
            }
        }

        protected override void OnDisappearing()
        {
            base.OnDisappearing();
            // Stop all videos
            foreach (var video in MyListVideo)
            {
                video.StopVideo();
            }
        }


    }