CODEWITHSUNDEEP
c#imagexamlxamarinxamarin.forms
Rauf
Rauf

Reputation: 12842

Load number of Images at a Time

I have about 500 static images as EmbeddedResource. Right now I show the images with the help of a slider. So when the slider value changes, I load the corresponding image.

        private void pageSlider_ValueChanged(object sender, ValueChangedEventArgs e)
        {
            var newStep = Math.Round(e.NewValue / StepValue);

            pageSlider.Value = newStep * StepValue;
            pageNumber.Text = pageSlider.Value.ToString();
            pageImage.Source = ImageSource.FromResource("SApp.Images.SPages.page" + pageSlider.Value.ToString() + ".jpg",typeof(AboutPage).GetTypeInfo().Assembly);
        }

Now, as the slide is not that much user friendly to iterate thru 500 images (total image size 40 MB), what is the right way to load the images. I thought to load it in Carousal control, but the current layout is TabbedPage, so I cannot do this. Other option is to load all the images to ListView, but will it make issue with memory ? Or ListView with Paging ?

Upvotes: 0

Views: 187

Answers (2)

Cfun
Cfun

Reputation: 9681

  1. Use a CollectionView and Load data incrementally. Or use it pull to refresh capability by wrapping it inside a RefreshView, you will be able to load your images async.

Edit

From source:

CollectionView is a view for presenting lists of data using different layout specifications. It aims to provide a more flexible, and performant alternative to ListView.

For information, you can use Pull to Refresh (Xamarin.Forms RefreshView) in both ListView or CollectionView.

  1. Beside that, for a faster image loading and smoother scrolling on Android only, you can use glidex.forms package, Official repo/docs.

Upvotes: 1

Cherry Bu - MSFT
Cherry Bu - MSFT

Reputation: 10346

I thought to load it in Carousal control, but the current layout is TabbedPage, so I cannot do this. Other option is to load all the images to ListView, but will it make issue with memory ? Or ListView with Paging ?

Maybe you can try to use FFImageLoading to display image in ListView, or just update image source when silder value update.

There are some features:

  1. Configurable disk and memory caching

  2. Multiple image views using the same image source (url, path, resource) will use only one bitmap which is cached in memory (less memory usage)

  3. Error and loading placeholders support

  4. Images can be automatically downsampled to specified size (less memory usage)

Upvotes: 2

Related Questions