I am new to Xamarin Forms. So therefore I have a trouble with the UI updating. I had create a collection view to display a list of data. Besides that I also created a button for the user to update remarks. While the user click the button, it will call OnRemarksButtonClickedAsync(APIPatrolD obj) and update the patrold_remark to the ObservationList. I already debug and ensure that the remarks had been store in the DAPIPatrolDSiapImbasList but it unable to update to the UI. Did anyone known why?
Below is my source code.
APIDATA Class
public class APIPatrolH
{
public string patrolh_ID { get; set; }
public DateTime patrolh_planDateTime { get; set; }
public DateTime patrolh_actualDateTime { get; set; }
public string patrolh_actualBy { get; set; }
public string patrolh_route { get; set; }
public string patrolh_routeDesc { get; set; }
public APIPatrolD[] patrolh_patrold { get; set; }
}
public class APIPatrolD
{
public string patrold_ID { get; set; }
public string patrold_loc { get; set; }
public int patrold_seq { get; set; }
public string patrold_desc { get; set; }
public byte[] patrold_image { get; set; }
public string patrold_GPS { get; set; } //latitude,longtitue. If 0,0 then no gps tracking
public string patrold_takenGPS { get; set; } //filled by apps
public DateTime patrold_takenDateTime { get; set; } //filled by apps - scan date time
public string patrold_remark { get; set; } //filled by apps
}
Base View Model
public class BaseViewModel : INotifyPropertyChanged
#region INotifyPropertyChanged
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged([CallerMemberName] string propertyName = "")
{
var handler = PropertyChanged;
handler?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
View Model
public string _patrold_remark;
public string patrold_remark
{
get { return _patrold_remark; }
set
{
_patrold_remark = value;
OnPropertyChanged();
}
}
public ObservableCollection<APIPatrolD> _DAPIPatrolDSiapImbasList;
public ObservableCollection<APIPatrolD> DAPIPatrolDSiapImbasList
{
get { return _DAPIPatrolDSiapImbasList; }
set
{
if (_DAPIPatrolDSiapImbasList != value)
{
_DAPIPatrolDSiapImbasList = value;
OnPropertyChanged();
}
}
}
public SecurityPortalDetailsPageViewModel(DAPIPatrolH dAPIPatrolH, int v)
{
DAPIPatrolDSiapImbasList = new ObservableCollection<APIPatrolD>();
}
private async void OnRemarksButtonClickedAsync(APIPatrolD obj)
{
// To Do display a customize PopUps=
var result = await App.Current.MainPage.Navigation.ShowPopupAsync(new CustomizePopups(obj));
foreach (APIPatrolD aPIPatrolD in DAPIPatrolDSiapImbasList) {
if (aPIPatrolD.patrold_loc == obj.patrold_loc) {
aPIPatrolD.patrold_remark = (string)result;
break;
}
}
OnPropertyChanged("DAPIPatrolDSiapImbasList");
}
UI Page
<CollectionView Grid.Row="2"
Grid.ColumnSpan="2"
ItemsSource="{Binding DAPIPatrolDSiapImbasList,Mode=TwoWay}">
<CollectionView.EmptyView>
<StackLayout>
<Label Text="Tiada Rekod" HorizontalOptions="CenterAndExpand" TextColor="Black" FontAttributes="Bold" FontSize="18" VerticalOptions="CenterAndExpand"/>
</StackLayout>
</CollectionView.EmptyView>
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid Padding="10,5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="0.5*"/>
<ColumnDefinition Width="1.2*"/>
<ColumnDefinition />
<ColumnDefinition Width="0.1"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="55"/>
<RowDefinition Height="25"/>
<RowDefinition Height="25"/>
<RowDefinition Height="3" />
</Grid.RowDefinitions>
<Label FontSize="15" FontAttributes="Bold" Text="{Binding patrold_seq}" TextColor="#403f3f" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand"/>
<Label FontSize="15" FontAttributes="Bold" Grid.Column="1" Text="{Binding patrold_loc}" TextColor="#403f3f" VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
<Label FontSize="15" FontAttributes="Bold" Grid.Column="2" Text="{Binding patrold_desc}" TextColor="#403f3f" VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
<Label FontSize="15" FontAttributes="Bold" Grid.ColumnSpan="5" Grid.Row="1" Text="{Binding patrold_takenDateTime, StringFormat='{dd/MM/yy hh:mm tt}'}" TextColor="#403f3f" VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
<Label FontSize="15" FontAttributes="Bold" Grid.ColumnSpan="5" Grid.Row="2" x:Name="Remarks" Text="{Binding patrold_remark}" TextColor="#403f3f" VerticalOptions="CenterAndExpand" HorizontalOptions="StartAndExpand"/>
<Button Text="Pemerhatian" FontSize="9" FontAttributes="Bold" Grid.Column="3" BackgroundColor="Red" HeightRequest="30" WidthRequest="120" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand"
Command="{Binding Path=BindingContext.RemarksCommand, Source={x:Reference _SecurityPortalDetailsPage}}"
CommandParameter="{Binding .}"
TextTransform="None"
/>
<controls:CFrame Grid.Row="3" Grid.ColumnSpan="5" BackgroundColor="LightGray"/>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>