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:


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


Hope it helps!