how to add new Items to listview on a button click in uwp

Question

I have a Usercontrol which contains a listview and a button.

i want to list items to be automatically added in listview when button is clicked.

thank you

 public List<PhotosGrid> AddPicture = new List<PhotosGrid>();
 public EditPhotosUserControl()
        {
            this.InitializeComponent();
            AddPicture.Add(new PhotosGrid { Picture = "/Assets/FamilyOfficeImg/car1.png", placeHolder = "Car Side View", Caption = "Side View" });
            AddPicture.Add(new PhotosGrid { Picture = "/Assets/FamilyOfficeImg/interior.png", placeHolder = "Car Interior View", Caption = "Interior View" });
             PhotosGridView.ItemsSource = AddPicture;


        }

        private void AddButton_Click(object sender, RoutedEventArgs e)
        {
            AddPicture.Add(new PhotosGrid { Picture = "", placeHolder = "Car Interior View", Caption = "Interior View" });
            PhotosGridView.ItemsSource = AddPicture;


        }
 public class PhotosGrid
    {
        public string Picture { get; set; }
        public string placeHolder { get; set; }
        public string Caption { get; set; }
    }

Answer 1

First, you need to change your PhotosGrid Class to Implement INotifyPropertyChanged so that you do not need to repeatedly set ItemsSource.

Below is how I would do it.

public class PhotosGrid : INotifyPropertyChanged
{
    private string _picture;
    public string Picture
    {
        get { return _picture; }
        set { _picture = value; OnPropertyChanged("Picture"); }
    }

    private string _placeHolder;
    public string PlaceHolder
    {
        get { return _placeHolder; }
        set { _placeHolder = value; OnPropertyChanged("PlaceHolder"); }
    }

    private string _caption;
    public string Caption
    {
        get { return _caption; }
        set { _caption = value; OnPropertyChanged("Caption"); }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string name)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
    }
}

Next, you need to change the AddPicture from List to ObservableCollection so that updating the list will fire INotifyCollectionChanged and INotifyPropertyChanged can be utilized. The official Data Binding in Depth documentation has a table with all the necessary types for C#, C++, and CX.

So your UserControl will be:

public sealed partial class EditPhotosUserControl : UserControl
{
    public ObservableCollection<PhotosGrid> AddPicture = new ObservableCollection<PhotosGrid>();
    public EditPhotosUserControl()
    {
        this.InitializeComponent();
        AddPicture.Add(new PhotosGrid { Picture = "", PlaceHolder = "Car Side View", Caption = "Side View" });
        AddPicture.Add(new PhotosGrid { Picture = "", PlaceHolder = "Car Interior View", Caption = "Interior View" });
        PhotosGridView.ItemsSource = AddPicture;
    }

    private void Button_Tapped(object sender, TappedRoutedEventArgs e)
    {
        AddPicture.Add(new PhotosGrid { Picture = "", PlaceHolder = "Car Interior View", Caption = "Interior View" });
    }
}

This will take care of your i want new item to be added automatically when addButton is clicked

Final Output.

Good Luck.