How can I create an image gallery from a folder in Windows Phone 8 using XAML and C#?

Question

I am building a Windows Phone 8 app which needs, from a created button (pressing it), to access an image gallery with some predetermined images (not the default Windows Phone gallery app). Then the goal would be that the image gallery returns the image (or the path) of the chosen item in that gallery (I don't know what of both itwill return) to the app I am building to use that image on a listbox control.

Could you tell me how can I create the image gallery that I need using XAML and C#, please?

Thank you so much!

Answer 1

Create a class ,

PhotoItem.cs

public class PhotoItem { public string PhotoName { get; set; } public BitmapImage Photo { get; set; }

public static List<PhotoItem> GetPhotos()
{
    return new List<PhotoItem>()
    {
        new PhotoItem(){PhotoName="Image1",Photo = new BitmapImage(new Uri("/Images/Image1.jpg", UriKind.Relative))},
        new PhotoItem(){PhotoName="Image2",Photo = new BitmapImage(new Uri("/Images/Image2.jpg", UriKind.Relative))},
    };
}

}

PhotoItemViewModel.cs

public class PhotoItemViewModel : INotifyPropertyChanged
    {
        private ObservableCollection<PhotoItem> photoList;
        public ObservableCollection<PhotoItem> PhotoList
        {
            get
            {
                return photoList;
            }
            set
            {
                photoList = value;
                NotifyPropertyChanged();
            }
        }

        public void LoadData()
        {
            PhotoList = new ObservableCollection<PhotoItem>(PhotoItem.GetPhotos());
        }

        public event PropertyChangedEventHandler PropertyChanged;
        public void NotifyPropertyChanged([CallerMemberName] string propertyName = null)
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }

XAML

   <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <phone:LongListSelector ItemsSource="{Binding PhotoList}">
            <phone:LongListSelector.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding PhotoName}"></TextBlock>
                        <Image Source="{Binding Photo}"></Image>
                    </StackPanel>
                </DataTemplate>
            </phone:LongListSelector.ItemTemplate>
        </phone:LongListSelector>
    </Grid>

And in CodeBehind.cs

 public MainPage()
        {
            InitializeComponent();
            this.Loaded += MainPage_Loaded;
        }

        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            viewModel.LoadData();
            DataContext = viewModel;
        }