We Keep Coding

How to communicate backend status messages to frontend?

I have a WPF project and a Console one, the point of the WPF is to be the frontend UI and the console application is the logic that does the actual work.
In my backend I have a class with a method that does the work.
public static class BackendClass
{
public static void DoWork(ref string output)
{
//actual work
}
}
From the MVVM frontend my view model starts a task for this method and I want to be able to show status messages on the frontend about it. Things like "Started work.", "Doing so-and-so.", "Finished." and etc.
The code in my view model is:
class ViewModel : INotifyPropertyChanged
{
static string backendOutput;
public string BackendOutput
{
get => backendOutput;
set
{
if (backendOutput != value)
{
backendOutput = value;
OnPropertyChanged("BackendOutput");
}
}
}
public RelayCommand ExecuteCommand { get; private set; }
Task executionTask;
public event PropertyChangedEventHandler PropertyChanged;
public ViewModel()
{
executionTask = new Task(() => BackendClass.DoWork(ref BackendOutput));
}
void OnExecute()
{
executionTask.Start();
ExecuteCommand.RaiseCanExecuteChanged();
}
bool CanExecute()
{
return (executionTask.Status != TaskStatus.Running &&
executionTask.Status != TaskStatus.WaitingToRun);
}
public void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
The "BackendOutput" property is data binded to a text block in the WPF window.
I was thinking of passing the "BackendOutput" property so the "DoWork" method can append its status messages to it, thus raising the changed event, updating the frontend.
However if I try to assign it outside of the constructor I get the error that a property can't be a field initializer or something like that and in this case I get "property can't be passed as a ref parameter".
So how should I alert the frontend of what status messages the back is pumping?

ViewModel communicates with View via PropertyChanged event. So Model also can have an event. ViewModel subscribes to that event, updates property with event data, View gets updated.
Events are kind of protected delegates. So as a first step try to introduce a delegate:
public static void DoWork(Action<string> notifier)
{
notifier("output value");
}
and
executionTask = new Task(() => BackendClass.DoWork(str => { BackendOutput = str; }));

Mahapps 1.3 dialogs and Avalon.Wizard

I've integrated the popular UI library Mahapps with the Avalon.Wizard control.
It integrates nicely, but I have an issue with the Mahapps dialogs. The Wizard control defines an InitializeCommand to handle the entering on a wizard page.
Apparently the InitializeCommand is triggered before the Dependency Property attached to the View is initialized (DialogParticipation.Register).
This cause the following error:
Context is not registered. Consider using DialogParticipation.Register in XAML to bind in the DataContext.
A sample project that reproduce the issue is available here.
Any suggestion on how to fix this?

The page Xaml isn't created at the initialize command, so you can't use the DialogCoordinator at this point.
Here is a custom interface with a LoadedCommand which can you implement at the ViewModel and call it at the Xaml code behind.
public interface IWizardPageLoadableViewModel
{
ICommand LoadedCommand { get; set; }
}
The ViewModel:
public class LastPageViewModel : WizardPageViewModelBase, IWizardPageLoadableViewModel
{
public LastPageViewModel()
{
Header = "Last Page";
Subtitle = "This is a test project for Mahapps and Avalon.Wizard";
InitializeCommand = new RelayCommand<object>(ExecuteInitialize);
LoadedCommand = new RelayCommand<object>(ExecuteLoaded);
}
public ICommand LoadedCommand { get; set; }
private async void ExecuteInitialize(object parameter)
{
// The Xaml is not created here! so you can't use the DialogCoordinator here.
}
private async void ExecuteLoaded(object parameter)
{
var dialog = DialogCoordinator.Instance;
var settings = new MetroDialogSettings()
{
ColorScheme = MetroDialogColorScheme.Accented
};
await dialog.ShowMessageAsync(this, "Hello World", "This dialog is triggered from Avalon.Wizard LoadedCommand", MessageDialogStyle.Affirmative, settings);
}
}
And the View:
public partial class LastPageView : UserControl
{
public LastPageView()
{
InitializeComponent();
this.Loaded += (sender, args) =>
{
DialogParticipation.SetRegister(this, this.DataContext);
((IWizardPageLoadableViewModel) this.DataContext).LoadedCommand.Execute(this);
};
// if using DialogParticipation on Windows which open / close frequently you will get a
// memory leak unless you unregister. The easiest way to do this is in your Closing/ Unloaded
// event, as so:
//
// DialogParticipation.SetRegister(this, null);
this.Unloaded += (sender, args) => { DialogParticipation.SetRegister(this, null); };
}
}
Hope this helps.

Bind Pop-Up data into a screen from which Pop-up has triggered in WPF using MVVM

I am developing a WPF application using MVVM pattern in which one of the screen has a DataGrid and it has a button called Add Unit in a row on click of which it opens a pop-up as shown below:
(i created a new view and calling this view on click of this AddUnit button).So again this popup window has a datagrid with multiple rows as shown below:
My Question is how can I be able to bind the row data (only two columns ItemCode and ItemName)from Pop-up datagrid to the main window (without changing the data above the DataGrid in main Window) hope i am making sense or is there any other correct way of doing this.
I really have a Hard-time with this as I am new to WPF and MVVM., any help greatly appreciate.

Let's make these DataContexts(popup's and the grid from which the popup is opened) share the same Service(you can inject this service to these DataContexts in time they are created). This service will be updated each time the popup's grid selection of the new row is happens. In addition it(the service) will raise an event to inform about the fact that the selection in Popup grid happened and sends the selected data inside the EventArgs. The data context of the grid from which the popup is opened will listen to the shared service event and will update its grid ItemSource collection in the way you like.
Update
public class MainGridDataContext:BaseObservableObject
{
private readonly ILikeEventAggregator _sharedService;
//here we inject the the interface
public MainGridDataContext(ILikeEventAggregator sharedService)
{
_sharedService = sharedService;
//listen to selection changed
_sharedService.PopupGridSelectionHandler += SharedServiceOnPopupGridSelectionHandler;
}
//uncomment next c'tor if you don't have any injection mechanism,
//you should add the SharedService property to the App class
//public MainGridDataContext()
//{
// //_sharedService = App.Current.
// var app = Application.Current as App;
// if (app != null)
// {
// _sharedService = app.LikeEventAggregator;
// _sharedService.PopupGridSelectionHandler += SharedServiceOnPopupGridSelectionHandler;
// }
//}
private void SharedServiceOnPopupGridSelectionHandler(object sender, PopupGridData popupGridData)
{
UpdateGridWithAPopupSelectedData(popupGridData);
}
//method that helps to update the grid, you can do that in multiple ways
private void UpdateGridWithAPopupSelectedData(PopupGridData popupGridData)
{
//Update your DataGrid here.
}
}
public class PopupDataContext:BaseObservableObject
{
private readonly ILikeEventAggregator _sharedService;
//here we inject the the interface
public PopupDataContext(ILikeEventAggregator sharedService)
{
_sharedService = sharedService;
}
//uncomment next c'tor if you don't have any injection mechanism,
//you should add the SharedService property to the App class
//public PopupDataContext()
//{
// //_sharedService = App.Current.
// var app = Application.Current as App;
// if (app != null)
// {
// _sharedService = app.LikeEventAggregator;
// }
//}
//... your logic
private PopupGridData _selectedData;
//you should bind the popup grid selected value to this property
public PopupGridData SelectedData
{
get { return _selectedData; }
set
{
_selectedData = value;
OnPropertyChanged(() => SelectedData);
_sharedService.OnPopupGridSelectionHandler(_selectedData);
}
}
//... your logic
}
public class PopupGridData
{
public object PopupGridSelectedData { get; set; }
}
Shared service code
public interface ILikeEventAggregator
{
event EventHandler<PopupGridData> PopupGridSelectionHandler;
void OnPopupGridSelectionHandler(PopupGridData e);
}
public class LikeEventAggregator : ILikeEventAggregator
{
public event EventHandler<PopupGridData> PopupGridSelectionHandler;
public virtual void OnPopupGridSelectionHandler(PopupGridData e)
{
var handler = PopupGridSelectionHandler;
if (handler != null) handler(this, e);
}
}
Let me know if you need more info.
Regards.

Event circularity

I find myself quite often in the following situation:
I have a user control which is bound to some data. Whenever the control is updated, the underlying data is updated. Whenever the underlying data is updated, the control is updated. So it's quite easy to get stuck in a never ending loop of updates (control updates data, data updates control, control updates data, etc.).
Usually I get around this by having a bool (e.g. updatedByUser) so I know whether a control has been updated programmatically or by the user, then I can decide whether or not to fire off the event to update the underlying data. This doesn't seem very neat.
Are there some best practices for dealing with such scenarios?
EDIT: I've added the following code example, but I think I have answered my own question...?
public partial class View : UserControl
{
private Model model = new Model();
public View()
{
InitializeComponent();
}
public event EventHandler<Model> DataUpdated;
public Model Model
{
get
{
return model;
}
set
{
if (value != null)
{
model = value;
UpdateTextBoxes();
}
}
}
private void UpdateTextBoxes()
{
if (InvokeRequired)
{
Invoke(new Action(() => UpdateTextBoxes()));
}
else
{
textBox1.Text = model.Text1;
textBox2.Text = model.Text2;
}
}
private void textBox1_TextChanged(object sender, EventArgs e)
{
model.Text1 = ((TextBox)sender).Text;
OnModelUpdated();
}
private void textBox2_TextChanged(object sender, EventArgs e)
{
model.Text2 = ((TextBox)sender).Text;
OnModelUpdated();
}
private void OnModelUpdated()
{
DataUpdated?.Invoke(this, model);
}
}
public class Model
{
public string Text1 { get; set; }
public string Text2 { get; set; }
}
public class Presenter
{
private Model model;
private View view;
public Presenter(Model model, View view)
{
this.model = model;
this.view = view;
view.DataUpdated += View_DataUpdated;
}
public Model Model
{
get
{
return model;
}
set
{
model = value;
view.Model = model;
}
}
private void View_DataUpdated(object sender, Model e)
{
//This is fine.
model = e;
//This causes the circular dependency.
Model = e;
}
}

One option would be to stop the update in case the data didn't change since the last time. For example if the data were in form of a class, you could check if the data is the same instance as the last time the event was triggered and if that is the case, stop the propagation.
This is what many MVVM frameworks do to prevent raising PropertyChanged event in case the property didn't actually change:
private string _someProperty = "";
public string SomeProperty
{
get
{
return _someProperty;
}
set
{
if ( _someProperty != value )
{
_someProperty = value;
RaisePropertyChanged();
}
}
}
You can implement this concept similarly for Windows Forms.

What you're looking for is called Data Binding. It allows you to connect two or more properties, so that when one property changes others will be updated auto-magically.
In WinForms it's a little bit ugly, but works like a charm in cases such as yours. First you need a class which represents your data and implements INotifyPropertyChanged to notify the controls when data changes.
public class ViewModel : INotifyPropertyChanged
{
private string _textFieldValue;
public string TextFieldValue {
get
{
return _textFieldValue;
}
set
{
_textFieldValue = value;
NotifyChanged();
}
}
public void NotifyChanged()
{
if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs(null));
}
public event PropertyChangedEventHandler PropertyChanged;
}
Than in your Form/Control you bind the value of ViewModel.TextFieldValue to textBox.Text. This means whenever value of TextFieldValue changes the Text property will be updated and whenever Text property changes TextFieldValue will be updated. In other words the values of those two properties will be the same. That solves the circular loops issue you're encountering.
public partial class Form1 : Form
{
public ViewModel ViewModel = new ViewModel();
public Form1()
{
InitializeComponent();
// Connect: textBox1.Text <-> viewModel.TextFieldValue
textBox1.DataBindings.Add("Text", ViewModel , "TextFieldValue");
}
}
If you need to modify the values from outside of the Form/Control, simply set values of the ViewModel
form.ViewModel.TextFieldValue = "new value";
The control will be updated automatically.

You should look into MVP - it is the preferred design pattern for Winforms UI.
http://www.codeproject.com/Articles/14660/WinForms-Model-View-Presenter
using that design pattern gives you a more readable code in addition to allowing you to avoid circular events.
in order to actually avoid circular events, your view should only export a property which once it is set it would make sure the txtChanged_Event would not be called.
something like this:
public string UserName
{
get
{
return txtUserName.Text;
}
set
{
txtUserName.TextChanged -= txtUserName_TextChanged;
txtUserName.Text = value;
txtUserName.TextChanged += txtUserName_TextChanged;
}
}
or you can use a MZetko's answer with a private property

Bind "Enabled" properties of controls to a variable

I am running into an issue that I have found on some similar post, however, they are not quite the same and I am not quite sure how to apply it to my scenario. They may or may not be the same as my case. So, I am posting my own question here hopefully, I will get an answer to my specific scenario.
Basically, I have a window form with a bunch of controls. I would like to have the ability to bind their Enabled property to a Boolean variable that I set so that they can be enable or disable to my discretion.
public partial class MyUI : Form
{
private int _myID;
public int myID
{
get
{
return _myID;;
}
set
{
if (value!=null)
{
_bEnable = true;
}
}
}
private bool _bEnable = false;
public bool isEnabled
{
get { return _bEnable; }
set { _bEnable = value; }
}
public myUI()
{
InitializeComponent();
}
public void EnableControls()
{
if (_bEnable)
{
ctl1.Enabled = true;
ctl2.Enabled = true;
......
ctl5.Enabled = true;
}
else
{
ctl1.Enabled = false;
ctl2.Enabled = false;
......
ctl5.Enabled = false;
}
}
}
}
The method EnableControls above would do what I need but it may not be the best approach. I prefer to have ctrl1..5 be bound to my variable _bEnable. The variable will change depending on one field users enter, if the value in the field exists in the database, then other controls will be enabled for user to update otherwise they will be disabled.
I have found a very similar question here
but the data is bound to the text field. How do I get rid of the EnableControls method and bind the value of _bEnabled to the "Enabled" property in each control?

Go look into the MVVM (Model - View - ViewModel) pattern, specifically its implementation within Windows Forms. Its much easier to apply it to a WPF/Silverlight application, but you can still use it with Windows Forms without too much trouble.
To solve your problem directly, you will need to do 2 things:
Create some class that will hold your internal state (i.e. whether or not the buttons are enabled). This class must implement INotifyPropertyChanged. This will be your View Model in the MVVM pattern.
Bind an instance of the class from 1.) above to your Form. Your form is the View in the MVVM pattern.
After you have done 1 and 2 above, you can then change the state of your class (i.e. change a property representing whether a button is enabled from true to false) and the Form will be updated automatically to show this change.
The code below should be enough to get the concept working. You will need to extend it obviously, but it should be enough to get you started.
View Model
public class ViewModel : INotifyPropertyChanged
{
private bool _isDoStuffButtonEnabled;
public bool IsDoStuffButtonEnabled
{
get
{
return _isDoStuffButtonEnabled;
}
set
{
if (_isDoStuffButtonEnabled == value) return;
_isDoStuffButtonEnabled = value;
RaisePropertyChanged("IsDoStuffButtonEnabled");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void RaisePropertyChanged(string propertyName)
{
var handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
}
View
public class View : Form
{
public Button DoStuffButton { get; set; }
public void Bind(ViewModel vm)
{
DoStuffButton.DataBindings.Add("Enabled", vm, "IsDoStuffButtonEnabled");
}
}
Usage
public class Startup
{
public ViewModel ViewModel { get; set; }
public View View { get; set; }
public void Startup()
{
ViewModel = new ViewModel();
View = new View();
View.Bind(ViewModel);
View.Show();
ViewModel.IsDoStuffButtonEnabled = true;
// Button becomes enabled on form.
// ... other stuff here.
}
}

Maybe you can try this approach: in your isEnabled property's setter method, add an if statement:
if(_bEnable) EnableControls();
else DisableControls();
And if your control names are ctl1,ctl2... etc. you can try this:
EnableControls()
{
for(int i=1; i<6;i++)
{
string controlName = "ctl" + i;
this.Controls[controlName].Enabled = true;
}
}
And apply the same logic in DisableControls
If you have more controls in future this could be more elegant.