We Keep Coding

Binding a string variable to a label

I am trying to move from WinForms to WPF, and am stuck on binding.
I have a label:
<Label Name="labelState" Content="{Binding state}" HorizontalAlignment="Right" Margin="10,10,10,10" FontSize="12" />
In the cs of the same userControl (named FormInput), I have :
public string state { get; set; }
public FormInput()
{
state = "ok";
InitializeComponent();
}
Why doesn't this work?
Thank you.

When you are binding something in WPF you need to use INotifyPropertyChanged
Implement a class follows,
class TestObject : INotifyPropertyChanged
{
private string _state;
public string State
{
get
{
return _state;
}
set
{
if (_state == value) return;
_state = value;
OnPropertyChanged("State");
}
}
#region INotifyPropertyChanged Members
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
#endregion
}
and in your FormInput
public FormInput()
{
InitializeComponent();
TestObject t = new TestObject();
labelState.DataContext = t;
t.State = "ok";
}
and XAML as follows,
<Label Name="labelState" Content="{Binding State}" HorizontalAlignment="Right" >

PropertyChangedEventHandler does not work

I have a following label and a slider in my UserControl xaml
<Label x:Name="labelValX" Content="{Binding Path=xValue}" HorizontalAlignment="Left" Width="88" Height="44"/>
<Slider x:Name="sliderSpeed" Value="{Binding slideValue, Mode=TwoWay}" HorizontalAlignment="Left" Margin="10,35,0,0" VerticalAlignment="Top" Width="173" Height="53" Minimum="10" Maximum="100" />
and a specific SetGetAccValues.cs class:
public class SetGetAccValues : UserControl, INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private string _xval;
public string xValue
{
get { return _xval; }
set
{
if (value != _xval)
{
_xval = value;
OnPropertyChanged("xValue");
}
}
}
public byte _slideValue;
public byte slideValue {
get
{
return _slideValue;
}
set
{
if (value != _slideValue)
{
_slideValue = value;
OnPropertyChanged("slideValue");
}
}
}
protected virtual void OnPropertyChanged(string propName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propName));
if (propName.Equals("slideValue"))
{
speedAccMeter(slideValue);
}
}
}
An in my other GetAccNotifications.cs class, I have following part, where I'm defining my xValue string to a specific value:
Y = ((double)(sbyte)value) / 64.0;
Y = Math.Round(Y, 2);
SetGetAccValues set = new SetGetAccValues();
set.xValue = Y.ToString();
The problem occurs when the OnPropertyChanged is triggered with "xValue" as the propName, the PropertyChangedEventHandler remains always null, but when it is triggered with "slideValue" as propName it is actually not null. Why does it remain null in the xValue case ?.

I believe the PropertyChanged event is firing before the datacontext is finished loading.
You can listen to the DataContextChanged event in your usercontrol, so that when the new datacontext is available, you can set your properties.
public AccView()
{
InitializeComponent();
this.DataContextChanged += OnDataContextChanged;
this.DataContext = new SetGetAccValues();
}
private void OnDataContextChanged(object sender, DependencyPropertyChangedEventArgs dependencyPropertyChangedEventArgs)
{
Y = ((double)(sbyte)value) / 64.0;
Y = Math.Round(Y, 2);
(dependencyPropertyChangedEventArgs.NewValue as SetGetAccValues).xValue = Y.ToString();
}

I think you didn't bind DataContext. You should set DataContext with code behind in your case.
In SetGetAccValues.xaml.cs
public SetGetAccValues()
{
DataContext = this;
}

How to programmatically set data binding using C# xaml

How do you programmatically set the DataContext and create a data binding in C# Xaml?
Given a Class
class Boat : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
internal void OnPropertyChanged(String info)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(info));
}
}
private int width;
public int Width
{
get { return this.width; }
set {
this.width = value;
OnPropertyChanged("Width");
}
}
}
I am trying to programmatically set the Width of a Xaml Rectangle using data binding.
Boat theBoat = new Boat();
this.UI_Boat.DataContext = this.theBoat;
this.UI_Boat.SetBinding(Rectangle.WidthProperty, this.theBoat.Width);//Incorrect
this.UI_Boat.SetBinding(Rectangle.WidthProperty, "Width"); //Incorrect
Where the Xaml look similar to this:
<Rectangle x:Name="UI_Boat" Fill="#FFF4F4F5" HorizontalAlignment="Center" Height="100" Stroke="Black" VerticalAlignment="Center" Width="{Binding}"/>

this.UI_Boat.SetBinding(Rectangle.WidthProperty, new Binding()
{
Path = "Width",
Source = theBoat
});

WPF Binding to a property in second ViewModel

How do I get the text bound to txtMessage from the second view model? When I had only one view model, the text was working fine. It does not work anymore when I moved the actual download code to second view model. Am I missing something? Any help appreciated.
Xaml:
<DockPanel DockPanel.Dock="Top">
<TextBlock x:Name="txtMessage" DockPanel.Dock="Top" Margin="5" Text="{Binding viewModel1.Message}" />
<StackPanel DockPanel.Dock="Top" Orientation="Horizontal" Margin="5,5">
<ProgressBar Width="300" Visibility="{Binding IsDownloading, Converter={converter:VisibilityConverter}}" IsIndeterminate="True" />
<Button Content="Cancel" />
</StackPanel>
</DockPanel>
<Button Content="Download" Width="120" Margin="0,0,5,0" Name="btnSubmit" Click="btnSubmit_Click" />
CodeBehind:
public partial class DownloadWindow: Window
{
DownloadWindowViewModel viewModel = new DownloadWindowViewModel();
public DownloadWindow()
{
InitializeComponent();
this.DataContext = viewModel;
}
private void btnSubmit_Click(object sender, RoutedEventArgs e)
{
viewModel.IsDownloading = true;
viewModel.Download();
}
}
viewModel:
public class DownloadWindowViewModel: INotifyPropertyChanged
{
Thread downloadThread;
public DownloadViewModel viewModel1;
public DownloadWindowViewModel()
{
viewModel1 = new DownloadViewModel();
}
private bool _isDownloading; = false;
public bool IsDownloading
{
get
{
return _isDownloading;
}
set
{
_isDownloading; = value;
OnPropertyChanged("IsDownloading");
}
}
public void Download()
{
viewModel1.Download();
}
public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
viewModel1:
public class DownloadViewModel: INotifyPropertyChanged
{
Thread _thread;
public void Download()
{
ThreadStart threadStart = delegate()
{
StartDownload();
};
_thread = new Thread(threadStart);
_thread.IsBackground = true;
_thread.Start();
}
private void StartDownload()
{
for (int i = 10; i < 1500; i++)
{
Thread.Sleep(5000);
Message = "Downloading " + i.ToString();
}
}
private string _message = "";
public string Message
{
get
{
return _message;
}
set
{
if (_message != value)
{
_message = value;
OnPropertyChanged("Message");
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string propertyName)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}

Your viewModel1 has to be a property, and it's a field at the moment. Change it to:
public DownloadViewModel viewModel1 { get; set; }
Explanation why such restriction exists, can be found here (primarily due to notification/verifications mechanisms simply not working for fields):
Why does WPF support binding to properties of an object, but not fields?

Changing Background color property of listbox item via databinding

I am trying to make ListBox which updates its content according to some changing data.
The XAML is as follows
StackPanel Orientation="Vertical">
<ListBox x:Name="listWatch" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid ShowGridLines="True">
<Grid Grid.Column="0" Background="{Binding Path=Color">
<TextBlock Text="{ Binding Path=LTP}" Padding="2 2 2 2"/>
</Grid>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button x:Name="btn" Click="btn_Click" Content="Button" />
The class i used for form data strucure is as follows
public class WatchRow : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
string _color;
decimal _lTP;
public WatchRow(decimal LTP,string color)
{
this.LTP = LTP;
this.Color = color;
}
public string Color
{
get { return _color; }
set{
_color = value;
OnPropertyChanged(_color);
}
}
public decimal LTP
{
get { return _lTP; }
set
{
_lTP = value;
OnPropertyChanged(_lTP.ToString());
}
}
protected void OnPropertyChanged(string info)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(info));
}
}
}
public class Watch:ObservableCollection<WatchRow>
{
public Watch():base()
{
}
}
And the code behind file is like
Watch watch = new Watch();
private void PhoneApplicationPage_Loaded_1(object sender, RoutedEventArgs e)
{
watch.Add(new WatchRow(132, "black"));
watch.Add(new WatchRow(123, "red"));
listWatch.ItemsSource = watch;
watch[0].Color = "green";
}
private void btn_Click(object sender, RoutedEventArgs e)
{
watch[0].Color = "green";
}
My problem is that i am not able to change the color of the list box item by setting the color property(watch[0].Color = "green";) in btn_Click as shown in the code. But the same code works in PhoneApplicationPage_Loaded_1. I don't know what i'm wrong. Any Ideas?

I believe the problem is a slight change to how you are using PropertyChanged. When you are calling OnPropertyChanged, pass through the name of the property that you are changing, rather than the value. For example:
public string Color
{
get { return _color; }
set{
_color = value;
OnPropertyChanged(_color);
}
}
Should be:
public string Color
{
get { return _color; }
set{
_color = value;
OnPropertyChanged("Color");
}
}
Also, I'm not sure if this is necessarily a problem, but this is how I've always created the OnPropertyChanged function:
Instead of:
protected void OnPropertyChanged(string info)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(info));
}
}
Try:
private void OnPropertyChanged(String info)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(info));
}
}
Also, as Magnus Johansson mentioned, define a brush, and bind the Color, rather than a string. So the Color property would be (see his explanation for further details on this):
private Color _color;
public Color Color
{
get { return _color; }
set{
_color = value;
OnPropertyChanged("Color");
}
}

Using Mvvm you can resolve your problem:
I've tested this code and it works. You need to split the code in three separate files, like this:
the viewModel
public class WatchViewModel
{
public ObservableCollection<WatchRow> WatchRows { get; set; }
public void GetWatchRows()
{
WatchRows= new ObservableCollection<WatchRow>();
}
public void AddWatchRow(int value, string color)
{
var item=new WatchRow(value, color);
WatchRows.Add(item);
}
}
The model
public class WatchRow : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
string _color;
decimal _lTP;
public WatchRow(decimal LTP, string color)
{
this.LTP = LTP;
this.Color = color;
}
public string Color
{
get { return _color; }
set
{
_color = value;
OnPropertyChanged(_color);
}
}
public decimal LTP
{
get { return _lTP; }
set
{
_lTP = value;
OnPropertyChanged(_lTP.ToString());
}
}
protected void OnPropertyChanged(string info)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(info));
}
}
}
And the view (code behind of your xaml page)
public partial class MainPage : PhoneApplicationPage
{
private WatchViewModel watch;
public MainPage()
{
InitializeComponent();
watch = new WatchViewModel();
watch.GetWatchRows();
watch.AddWatchRow(132, "green");
watch.AddWatchRow(123, "red");
base.DataContext = watch;
listWatch.ItemsSource = watch.WatchRows;
}
private void btn_Click(object sender, RoutedEventArgs e)
{
watch.AddWatchRow(132, "pink");
watch.AddWatchRow(113, "yellow");
}
}