need help on MVVM structure - mvvm

Question

I am new to Xarmain Forms programming and try to follow the MVVM model. However, I am not sure if I am doing it correctly. The program I write works, but
I would like some experts' opinions on whether I am doing it right or not in terms of MVVM.
I see a lot of example having the OnPropertyChanged somewhere in the programs. Do I need it somewhere in my program?
Any way to simplify?
My program read the text file in the system pathe and the text file contains some URLs and my XAML will display what the URL points to.
+++++++++++++++++++++++++++++++++++++++++++++++++
Folder name: Model
Class name: ListViewNewsItem.cs
namespace SCAC.Models
{
public class ListViewNewsItem
{
public string NewsLink { get; internal set; }
}
}
+++++++++++++++++++++++++++++++++++++++++++++++++++
Folder Name: ViewModels
Class Name: ListViewNewsViewModel.cs
namespace SCAC.ViewModels
{
public class ListViewNewsViewModel : ViewModel
{
private ObservableCollection<ListViewNewsItem> newsItem;
private static string documentPath = ReturnDocumentPath(); // Get the system path
public ListViewNewsViewModel()
{
GenerateNews(); // code below
}
public ObservableCollection<ListViewNewsItem> NewsItem
{
get { return newsItem; }
set
{
this.newsItem = value;
}
}
public void GenerateNews()
{
// File
string line;
string toReadFile = Path.Combine(documentPath + "Images.txt");
NewsItem = new ObservableCollection<ListViewNewsItem>();
StreamReader toRead = new StreamReader(toReadFile);
while ((line = toRead.ReadLine()) != null)
{
Console.WriteLine("This is the url: " + line);
var newsDetail = new ListViewNewsItem()
{
NewsLink = line
};
NewsItem.Add(newsDetail);
}
toRead.Close();
}
}
}
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Folder Name: Views
XAML file Name: NewsView.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:localvm="clr-namespace:SCAC.ViewModels"
mc:Ignorable="d"
x:Class="SCAC.Views.NewsView" >
<!-- ontentPage.BindingContext>
<localvm:ListViewNewsViewModel />
</ -->
<ContentPage.Content>
<ScrollView>
<StackLayout BindableLayout.ItemsSource="{Binding NewsItem}">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Frame Padding="10, 10, 10, 10" HeightRequest="200">
<Image Source="{Binding ImageLink}" Aspect="Fill"></Image>
</Frame>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</ScrollView>
</ContentPage.Content>
</ContentPage>
Code behind: NewsView.xaml.cs
namespace SCAC.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class NewsView : ContentPage
{
public NewsView()
{
InitializeComponent();
BindingContext = new ListViewNewsViewModel();
}
}
}

Answer 1

I think you did a quite good job in MVVM structure. Get the data in the ViewModel, set the binding in the Xaml, set the right bindingContext to contect View and ViewModel. Everything looks well so far.
The Model-View-ViewModel (MVVM) architectural pattern was invented
with XAML in mind. The pattern enforces a separation between three
software layers — the XAML user interface, called the View; the
underlying data, called the Model; and an intermediary between the
View and the Model, called the ViewModel. The View and the ViewModel
are often connected through data bindings defined in the XAML file.
The BindingContext for the View is usually an instance of the
ViewModel.
ViewModels generally implement the INotifyPropertyChanged interface, which means that the class fires a PropertyChanged event whenever one of its properties changes.
You does not need to implement the INotifyPropertyChanged interface because there is only one property in your ViewModel: ObservableCollection<ListViewNewsItem> NewsItem.
ObservableCollection implements the INotifyCollectionChanged interface by default so you don't have to implement the INotifyPropertyChanged interface in ViewModel to notify the data changes.
If you have a simple property like public DateTime DateTime, then you usually need to write it like:
class ClockViewModel : INotifyPropertyChanged
{
DateTime dateTime;
public event PropertyChangedEventHandler PropertyChanged;
public DateTime DateTime
{
set
{
if (dateTime != value)
{
dateTime = value;
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs("DateTime"));
}
}
}
get
{
return dateTime;
}
}
}
You can read the document to learn more about MVVM with data-binding.