lundi 29 février 2016

ListView not updating on new inserted items into ObservableCollection on UWP for Windows 10

Im trying to understand how all is connected and I need some help. So far I can do insert, update, delete into sqlite database but I cant make the UI show the changes from the database automatically without me to update the ItemsSource on the ListView whenever changes are made to the database. i.e.:

In my App.xaml.cs

public App()
        {
            this.InitializeComponent();
            this.Suspending += OnSuspending;

            //Connection to the database and create the table if not there
            string path = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "db.sqlite");
            SQLiteConnection conn = new SQLiteConnection(path);
            conn.CreateTable<CheckListItemModel>();
        }

Than in my MainPage.xaml i have a simple page with two buttons and the Listview

<Page
    x:Class="Personal_Checklist_2.MainPage"
    xmlns="http://ift.tt/o66D3f"
    xmlns:x="http://ift.tt/mPTqtT"
    xmlns:local="using:Personal_Checklist_2"
    xmlns:d="http://ift.tt/pHvyf2"
    xmlns:mc="http://ift.tt/pzd6Lm"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="100" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0" Orientation="Horizontal" >
            <Button Content="Add Sample To Db" Click="Add_Sample_To_Db_Click" Margin="10,0,10,0" />
            <Button Content="Clear Tasks" Click="Clear_Tasks_Click" />
        </StackPanel>

        <ListView Name="lvListView" Grid.Row="1" >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Title}" />
                        <TextBlock Text="{Binding Id}" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</Page>

In MainPage.xaml.cs code-behind I also keep as simple as I know just to add new row into the table and clear the table

using Personal_Checklist_2.DataModels;
using System.IO;
using System.Linq;
using SQLite;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using System.Collections.ObjectModel;

namespace Personal_Checklist_2
{
    public sealed partial class MainPage : Page
    {
        static string path = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "db.sqlite");
        ObservableCollection<CheckListItemModel> Tasks = new ObservableCollection<CheckListItemModel>();

        public MainPage()
        {
            this.InitializeComponent();
            using (var conn = new SQLiteConnection(path))
            {
                var query = conn.Table<CheckListItemModel>();
                Tasks = new ObservableCollection<CheckListItemModel>(query.ToList());

                lvTasksList.ItemsSource = Tasks.ToList(); //<<<--- If I dont do this, list is not updated
            }
        }

        private void Add_Sample_To_Db_Click(object sender, RoutedEventArgs e)
        {
            var Task = new CheckListItemModel()
            {
                taskTitle = "Sample Task"
            };

            using (var conn = new SQLiteConnection(path))
            {
                conn.Insert(Task);
                var query = conn.Table<CheckListItemModel>();
                Tasks = new ObservableCollection<CheckListItemModel>(query.ToList());
                lvTasksList.ItemsSource = Tasks.ToList(); //<<<--- If I dont do this, list is not updated
            }
        }

        private void Clear_Tasks_Click(object sender, RoutedEventArgs e)
        {
            using (var conn = new SQLiteConnection(path))
            {
                conn.DeleteAll<CheckListItemModel>();
                var query = conn.Table<CheckListItemModel>();
                Tasks = new ObservableCollection<CheckListItemModel>(query.ToList());
                lvTasksList.ItemsSource = Tasks.ToList(); //<<<--- If I dont do this, list is not updated
            }
        }
    }
}

The database table model looks like this CheckListItemModel.cs

using SQLite;
using System;
using System.ComponentModel;

namespace Personal_Checklist_2.DataModels
{
    class CheckListItemModel : INotifyPropertyChanged
    {
        #region Private fields on DataModel
        private string _taskTitle;
        #endregion

        #region Public properties on DataModel
        [PrimaryKey, AutoIncrement]
        public int taskId { get; set; }

        public string taskTitle
        {
            get { return _taskTitle; }
            set { _taskTitle = value; NotifyPropertyChanged("taskTitle"); }
        }
        #endregion

        #region INotifyPropertyChanged implementation
        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion
    }
}

But it doesn't look right to me this way. Is there a way to achieve this without setting the listview.ItemsSource everytime some changes in db.sqlite and how?

Aucun commentaire:

Enregistrer un commentaire