How to update content of a CarouselView

MagnusWallonMagnusWallon ✭✭✭USMember ✭✭✭

Hi,
I have a CarouselView were the content should shift depending on some user input. The CarouselView sets fine the first time but when I change the content of the ObservableCollection it dosn't effect the content of the CarouselView. I now when I did likely things with a listView I could cler the content and then add the bindable again but I don't see any options for that with CarouselView. Does someone know how to do this or can see what I'm doing wrong?

Function that refreshes the content:

        void setShowMore() {
            this.Images = new ObservableCollection<Img>();
            if (choosenEO.subPages[showMoreCounter].imgs.Count > 0)
            {
                for (var i = 0; i< choosenEO.subPages[showMoreCounter].imgs.Count; i++)
                {
                    this.Images.Add(new Img() { src = choosenEO.subPages[showMoreCounter].imgs[i].src });
                }
            }
            System.Diagnostics.Debug.WriteLine("Length of Images:" + this.Images.Count);
                this.BindingContext = this;
        }

And in xaml:

                    <cv:CarouselView x:Name="caroView" ItemsSource="{Binding Images}" BackgroundColor="Lime" HeightRequest="200" WidthRequest="200">
                        <cv:CarouselView.ItemTemplate>
                            <DataTemplate>
                                <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="Red">
                                    <Label Text="{Binding src}"/>
                                    <Image Aspect="AspectFill" Source="{Binding src}" />
                                </StackLayout>
                            </DataTemplate>
                        </cv:CarouselView.ItemTemplate>
                    </cv:CarouselView>

Best regards
/magnus

Tagged:

Best Answer

  • MagnusWallonMagnusWallon ✭✭✭ US ✭✭✭
    Accepted Answer

    Hi again maybe I was unclear but the problem was actually pretty simple. Whwn I Created a new ObservableCollection everytime I called for an update it broke the binding or something.
    So now I initiate my ObservableCollection in the beginning and just clears it in in my setShowMore function and it works.
    New code that works:

         void setShowMore() {
                    //this.Images = new ObservableCollection<Img>(); //<------ error here
                this.Images.Clear(); // <-----  this works
                    if (choosenEO.subPages[showMoreCounter].imgs.Count > 0)
                    {
                        for (var i = 0; i< choosenEO.subPages[showMoreCounter].imgs.Count; i++)
                        {
                            this.Images.Add(new Img() { src = choosenEO.subPages[showMoreCounter].imgs[i].src });
                        }
                    }
                    System.Diagnostics.Debug.WriteLine("Length of Images:" + this.Images.Count);
                        this.BindingContext = this;
                }
    

Answers

  • DhruvGohilDhruvGohil ✭✭ USMember ✭✭

    try this ItemsSource="{Binding Images,Mode=TwoWay}"

  • MagnusWallonMagnusWallon ✭✭✭ USMember ✭✭✭

    Hi unfortunately that didn't make any difference :(

    /magnus

  • MagnusWallonMagnusWallon ✭✭✭ USMember ✭✭✭

    Doesn't anyone know how to refresh a CarouselView with new content?

    Best regard
    /magnus

  • DhruvGohilDhruvGohil ✭✭ USMember ✭✭

    You are changing the collection but view is not updating , right ?
    If so you have to implement INotifyPropertyChanged

    https://developer.xamarin.com/guides/xamarin-forms/xaml/xaml-basics/data_bindings_to_mvvm/

  • MagnusWallonMagnusWallon ✭✭✭ USMember ✭✭✭
    Accepted Answer

    Hi again maybe I was unclear but the problem was actually pretty simple. Whwn I Created a new ObservableCollection everytime I called for an update it broke the binding or something.
    So now I initiate my ObservableCollection in the beginning and just clears it in in my setShowMore function and it works.
    New code that works:

         void setShowMore() {
                    //this.Images = new ObservableCollection<Img>(); //<------ error here
                this.Images.Clear(); // <-----  this works
                    if (choosenEO.subPages[showMoreCounter].imgs.Count > 0)
                    {
                        for (var i = 0; i< choosenEO.subPages[showMoreCounter].imgs.Count; i++)
                        {
                            this.Images.Add(new Img() { src = choosenEO.subPages[showMoreCounter].imgs[i].src });
                        }
                    }
                    System.Diagnostics.Debug.WriteLine("Length of Images:" + this.Images.Count);
                        this.BindingContext = this;
                }
    
Sign In or Register to comment.