Adding Images to a FlipView Dynamically

Hi everyone,

I was looking for a way to load images in a FlipView control dynamically and here's my solution.

We'll be creating 3 FlipViewItems and setting their Background property to 3 ImageBrush objects.

Note that, first you need to have a FlipView on your page.

Ok, let's start coding!

  1. First create 3 ImageBrush objects:

    FlipView flip1 =newFlipView();
    ImageBrush brush1 = newImageBrush();
    brush1.ImageSource =
    new BitmapImage(new Uri("ms-appx:///Assets/image1.png"));
    ImageBrush brush2 = newImageBrush();
    brush2.ImageSource =
    new BitmapImage(new Uri("ms-appx:///Assets/image2.png"));
    ImageBrush brush3 = newImageBrush();
    brush3.ImageSource =
    new BitmapImage(new Uri("ms-appx:///Assets/image3.png"));
     
  2. Then create 3 FlipViewItem objects and assign their Background property as the ImageBrush objects that we recently created:

    FlipViewItem flipvw1 = newFlipViewItem();
    flipvw1.Background = brush1;
    FlipViewItem flipvw2 = newFlipViewItem();
    flipvw2.Background = brush2;
    FlipViewItem flipvw3 = newFlipViewItem();
    flipvw3.Background = brush3;
     
  3. And finally add these FlipViewItems to a FlipView object:

    flip1.Items.Add(flipvw1);
    flip1.Items.Add(flipvw2);
    flip1.Items.Add(flipvw3);

And run it! You'll be displaying 3 images in a Flipview control now.

ss1.png

Hope it helps!

Up Next
    Ebook Download
    View all
    Learn
    View all
    Araf Global is a software consultancy company founded in 2016 focusing on cutting edge technologies.