Im new to WPF and Iv been breaking my head over this for past couple of days. I am trying to set a basic binding of textbox to a string property. I followed the MS tutorial but nothing seems to be working.
Here's email class, I am trying to bind its subject property to display in a textbox
public class Email : INotifyPropertyChanged
{
private string _subject;
public string Subject
{
get { return _subject; }
set
{
_subject = value;
OnPropertyChanged("Subject");
}
}
private string _contents;
public string Contents
{
get { return _contents; }
set
{
_contents = value;
OnPropertyChanged("Contents");
}
}
private Category _category;
public Category Category
{
get { return _category; }
set
{
_category = value;
OnPropertyChanged("Category");
}
}
public Email()
{
}
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string info)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(info));
}
}
}
Here's the email setter inside UserControl that parents the textbox:
private Email _email;
public Email Email
{
get { return _email; }
set
{
_email = value;
if (_email != null)
{
Binding myBinding = new Binding("Subject");
myBinding.Source = _email;
tbSubject.SetBinding(TextBlock.TextProperty, myBinding);
}
}
}
tbSubject is never getting set to anything, its always empty even if email passed is not null and has a subject! If I do just this:
public Email Email
{
get { return _email; }
set
{
_email = value;
if (_email != null)
{
tbSubject.Text = _email.Subject;
}
}
}
it works fine. I dont understand what I am doing wrong.
I think I've got it. Here's the change I had to make:
public partial class EmailContentsTemplate : UserControl, INotifyPropertyChanged
{
private Email _email;
public Email Email
{
get { return _email; }
set
{
_email = value;
OnPropertyChanged("Email");
}
}
public EmailContentsTemplate()
{
InitializeComponent();
DataContext = this;
Binding myBinding = new Binding("Email.Subject");
myBinding.Source = this;
tbSubject.SetBinding(TextBlock.TextProperty, myBinding);
}
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string info)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(info));
}
}
}
So I changed source to "this" and made the user control implement INotifyPropertyChanged. Now it works.
Alternatively I got it working through XAML
<TextBox x:Name="tbSubject" Grid.Column="1" Grid.Row="1" Margin="3" Text="{Binding Email.Subject}"/>
Related
I am new to Xamarin but i tried to use BindingContext to set image path
First i tried with
private string _imagePath;
public string ImagePath
{
get
{
return _imagePath;
}
set
{
if (_imagePath != value)
{
_imagePath = value;
OnPropertyChanged();
}
}
}
.
.
.
ImagePath = "TriangleSide_A.png";
.
.
.
<Image Source="{Binding ImagePath}" HeightRequest="300" WidthRequest="300"/>
But no luck then i tried with Auto Property
public string ImagePath {get;set;}
Thats work only with
public string ImagePath {get;} = "TriangleSide_A.png";
According to your description, I don't know how you implement INotifyPropertyChanged interface, generally, I do like this:
public class ViewModelBase : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
The RaisePropertyChanged likes your OnPropertyChanged method, with the PropertyName that has changed. If we go to our property, we now need to update it, to raise this event, every time the property is changed.
From your code, you don't add propertyname in your OnPropertyChanged, so the ImagePath can not be updated.
Please take a look the following code:
<StackLayout>
<Image
HeightRequest="300"
Source="{Binding ImagePath}"
WidthRequest="300" />
<Button
x:Name="btn1"
Clicked="Btn1_Clicked"
Text="change image source" />
</StackLayout>
public partial class Page32 : ContentPage, INotifyPropertyChanged
{
private string _imagePath;
public string ImagePath
{
get { return _imagePath; }
set
{
if (_imagePath != value)
{
_imagePath = value;
RaisePropertyChanged("ImagePath");
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
public Page32()
{
InitializeComponent();
ImagePath = "a11.jpg";
this.BindingContext = this;
}
private void Btn1_Clicked(object sender, EventArgs e)
{
ImagePath = "a12.jpg";
}
}
Update:
If you want to use binding in mvvm mode, I do some code that you can take a look:
This is ImageOnClick model, contain some properties.
public class ImageOnClick:ViewModelBase
{
private string _imagePath;
public string ImagePath
{
get { return _imagePath; }
set
{
if (_imagePath != value)
{
_imagePath = value;
RaisePropertyChanged("ImagePath");
}
}
}
}
Now binding this model to contentpage
public partial class Page32 : ContentPage
{
private ImageOnClick imagemodel;
public Page32()
{
InitializeComponent();
imagemodel = new ImageOnClick() { ImagePath = "a11.jpg" };
this.BindingContext = imagemodel;
}
private void Btn1_Clicked(object sender, EventArgs e)
{
imagemodel.ImagePath = "a12.jpg";
}
}
About mvvm binding, you can also take a look:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/data-bindings-to-mvvm
Your Initial code is correct, but you can set the _imagePath to Auto Property like so:
private string _imagePath { get; set; }
public string ImagePath
{
get
{
return _imagePath;
}
set
{
if (_imagePath != value)
{
_imagePath = value;
OnPropertyChanged();
}
}
}
The reason
public string ImagePath {get;set;}
doesn't work is because you need to have the OnPropertyChanged() in the setter.
Code Behind File:
namespace WindowsTrainingTasks
{
public interface INotifyPropertyChanged
{
event PropertyChangedEventHandler PropertyChanged;
}
public class SampleViewModel :INotifyPropertyChanged
{
private string _name="Johnson";
public string Name
{
get
{
return _name;
}
set
{
_name = value;
onPropertyChanged("Name");
}
}
private string _mobile="9876543210";
public string Mobile
{
get
{
return _mobile;
}
set
{
_mobile = value;
onPropertyChanged("Mobile");
}
}
public event PropertyChangedEventHandler PropertyChanged;
public void onPropertyChanged(string property)
{
PropertyChangedEventHandler _PropertyChanged = PropertyChanged;
_PropertyChanged(this, new PropertyChangedEventArgs(property));
}
public SampleViewModel()
{
}
}
}
I'm not sure why you've chosen to declare your own INotifyPropertyChanged interface - it's already in the framework.
Additionally you need to do a null check before invoking the delegates on the event:
public void onPropertyChanged(string property)
{
var _PropertyChanged = PropertyChanged;
if (_PropertyChanged != null)
_PropertyChanged(this, new PropertyChangedEventArgs(property));
}
otherwise if nothing has been registered for the event then you will get a NullReferenceException.
I am trying to implement MVVM, but my view is not updating when the view model changes. This is my view model:
public class ViewModelDealDetails : INotifyPropertyChanged
{
private Deal selectedDeal;
public Deal SelectedDeal
{
get { return selectedDeal; }
set
{
selectedDeal = value;
OnPropertyChanged();
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
}
}
In my XAML for the view I have this:
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<StackPanel>
<TextBlock Text="{Binding Path=SelectedDeal.Title, Mode=TwoWay}"></TextBlock>
</StackPanel>
</Grid>
The deal class:
public class Deal
{
private string title;
private float price;
public Deal()
{
this.title = "Example";
}
public Deal(string title, float price)
{
this.title = title;
this.price = price;
}
public string Title
{
get { return title; }
set { title = value; }
}
public float Price
{
get { return price; }
set { price = value; }
}
}
When the application starts the value is correct, but when SelectedDeal changes, the view doesn't. What am I missing?
The path of your binding is nested.To make it work, your Deal class should implement INotifyPropertyChanged too. Otherwise, it will not be triggered unless SelectedDeal is changed. I would suggest you make your view models all inherited from BindableBase. It would make your life much easier.
public class ViewModelDealDetails: BindableBase
{
private Deal selectedDeal;
public Deal SelectedDeal
{
get { return selectedDeal; }
set { SetProperty(ref selectedDeal, value); }
}
}
public class Deal: BindableBase
{
private string title;
public string Title
{
get { return title; }
set { SetProperty(ref title, value); }
}
}
The above code should work.
BTW:
If you have no access to the code of Deal class, then to trigger the binding you will have to recreate an instance of SelectedDeal each time when the value of Title is changed.
I have a MainPage.xaml where is ListBox and Button. When I click on the button then MainPage is navigated to AddPage.xaml. This page is for adding new items, there are two TextBoxes and submit Button. When I click on that submit Button,then data from TextBoxes are saved to XML file and then is called GoBack().
I need to refresh ListBox in my MainPage.xaml when Im going back from AddPage.xaml, but it doesnt work automaticly. How can I do that?
My MainViewModel.cs
public class MainViewModel : INotifyPropertyChanged
{
public ObservableCollection<Context> Contexts { get; private set; }
public MainViewModel()
{
this.Contexts = new ObservableCollection<Context>();
}
public bool IsDataLoaded
{
get;
private set;
}
public void LoadData()
{
try
{
var file = IsolatedStorageFile.GetUserStoreForApplication();
XElement xElem;
using (IsolatedStorageFileStream read = file.OpenFile("contexts.xml", FileMode.Open))
{
xElem = XElement.Load(read);
}
var contexts = from context in xElem.Elements("Context")
orderby (string)context.Element("Name")
select context;
foreach (XElement xElemItem in contexts)
{
Contexts.Add(new Context
{
Name = xElemItem.Element("Name").Value.ToString(),
Note = xElemItem.Element("Note").Value.ToString(),
Created = xElemItem.Element("Created").Value.ToString()
});
}
}
catch (Exception ex)
{
MessageBox.Show(ex.Message);
}
this.IsDataLoaded = true;
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(String propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (null != handler)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
and Context.cs
public class Context : INotifyPropertyChanged
{
private string _name;
public string Name
{
get
{
return _name;
}
set
{
if (value != _name)
{
_name = value;
NotifyPropertyChanged("Name");
}
}
}
private string _note;
public string Note
{
get
{
return _note;
}
set
{
if (value != _note)
{
_note = value;
NotifyPropertyChanged("Note");
}
}
}
private string _created;
public string Created
{
get
{
return _created;
}
set
{
if (value != _created)
{
_created = value;
NotifyPropertyChanged("Created");
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(String propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (null != handler)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
You'll need to tell the main page that there is new data to reload.
At it's simplest, something like this:
protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (e.NavigationMode == NavigationMode.Back)
{
(this.DataContext as MainViewModel).LoadData();
}
}
Tip: You aren't raising a property changed notification for your View Model's properties.
On the load event of the MainPage, call LoadData. You should also clear the observable collection when you call the LoadData method before adding anything to it because simply loading the data will cause duplicate entries in your collection.
I have a listbox to which I'm binding HistoryItems , where HistoryItems is a ObservableCollection of History.
Here is the listbox declaration :
<ListBox x:Name="RecentListBox" SelectionChanged="RecentListBox_SelectionChanged" ItemsSource="{Binding HistoryItems,Converter={StaticResource HistoryValueConverter} }" ItemsPanel="{StaticResource ItemsPanelTemplate1_Wrap}" ItemTemplate="{StaticResource RecentViewModelTemplate}">
Here is the History class :
public class History : INotifyPropertyChanged
{
public History() { }
int _id;
string _date;
string _url;
string _name;
public History(int id, string date,string url,string name)
{
this.id = id;
this.date = date;
this.url = url;
this.name = name;
}
public int id
{
get
{
return _id;
}
set
{
if (value != _id)
{
_id = value;
NotifyPropertyChanged("id");
}
}
}
public string date
{
get
{
return _date;
}
set
{
if (!value.Equals(_date))
{
_date = value;
NotifyPropertyChanged("string");
}
}
}
public string url
{
get
{
return _url;
}
set
{
if (!value.Equals(_url))
{
_url = value;
NotifyPropertyChanged("url");
}
}
}
public string name
{
get
{
return _name;
}
set
{
if (!value.Equals(_name))
{
_name = value;
NotifyPropertyChanged("name");
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(String propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (null != handler)
{
// App.viewModel.HistoryItems = (App.Current as App).dataHandler.retrieveHistory_DB();
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
When I start the app the list gets populated, but after I do some modifs in some pivot children, and go back to the main panorama view, I try to update the HistoryItems in OnNavigatedTo :
App.ViewModel.HistoryItems = (App.Current as App).dataHandler.retrieveHistory_DB();
but the listbox doesn't get updated (and the function returns the correct data). What could the problem be? History is INotifyPropertyChanged and the HistoryItems is a ObservableCollection<History> so there should be no problem.. What is causing the list to not update?
Since you are replacing HistoryItems when you refresh it doesn't matter that it's an ObservableCollection.
You can either clear the HistoryItems and then add the new items when you refresh. Or the ViewModel should implement INotifyPropertyChanged and the HistoryItems setter should raise the event.
Rewrite the setter for ViewModel.HistoryItems so that instead of doing this
_historyItems = value;
it does this
if (_historyItems == null)
_historyItems = new ObservableCollection<HistoryItem>();
_historyItems.Clear();
foreach (var hi in value)
_historyItems.Add(hi);
You need NotifyPropertyChanged for App.ViewModel in the Setter of HistoryItems