milosev.com
  • Home
    • List all categories
    • Sitemap
  • Downloads
    • WebSphere
    • Hitachi902
    • Hospital
    • Kryptonite
    • OCR
    • APK
  • About me
    • Gallery
      • Italy2022
    • Curriculum vitae
      • Resume
      • Lebenslauf
    • Social networks
      • Facebook
      • Twitter
      • LinkedIn
      • Xing
      • GitHub
      • Google Maps
      • Sports tracker
    • Adventures planning
  1. You are here:  
  2. Home
  3. C#

MVVM button click

Details
Written by: Stanko Milosev
Category: WPF
Published: 01 February 2014
Last Updated: 01 February 2014
Hits: 14814

Let's first add RelayCommand class: 

class RelayCommand: ICommand
{
	private Action<object> _action;

	public RelayCommand(Action<object> action)
	{
		_action = action;
	}

	public bool CanExecute(object parameter)
	{
		return true;
	}

	public void Execute(object parameter)
	{
		if (parameter != null)
		{
			_action(parameter);
		}
		else
		{
			_action("Hello world");
		}
	}

	public event EventHandler CanExecuteChanged;
}

ICommand is an interface, and automatically you will receive methods which you have to implement. Now "click model":

public class MVVMButtonClickViewModel
{
	public MVVMButtonClickViewModel()
	{
		MVVMClick = new RelayCommand(new Action<object>(ShowMessage));
	}

	private ICommand m_ButtonCommand;

	public ICommand MVVMClick
	{
		get { return m_ButtonCommand; }
		set { m_ButtonCommand = value; }
	}

	public void ShowMessage(object obj)
	{
		MessageBox.Show("Test");
	}

}

and XAML:

<Window x:Class="MVVMButtonClick.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:MVVMButtonClick.ViewModel"
        Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <local:MVVMButtonClickViewModel />
    </Window.DataContext>
    <Grid>
        <Button Content="Button" HorizontalAlignment="Left" Margin="247,134,0,0" VerticalAlignment="Top" Width="75" Command="{Binding MVVMClick}"/>
    </Grid>
</Window>

As you can see, in button node, we have attribute like: Command="{Binding MVVMClick}, and of course don't forget to add DataContext, like: 

    <Window.DataContext>
        <local:MVVMButtonClickViewModel />
    </Window.DataContext>

Example you can download from here.

Button stretch

Details
Written by: Stanko Milosev
Category: WPF
Published: 01 February 2014
Last Updated: 30 November -0001
Hits: 4077

How to have button stretched over all window width: XAML:

<Window x:Class="DIexamples.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Button Content="Button" Margin="0,23,0,0" VerticalAlignment="Top" />
        <Button Content="Button" Margin="0,0,0,0" VerticalAlignment="Top" />
    </Grid>
</Window>

Important lines to notice are:

<Grid.ColumnDefinitions>
	<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>

And attribute: Margin="0,23,0,0"

MVVM tree

Details
Written by: Stanko Milosev
Category: WPF
Published: 30 January 2014
Last Updated: 13 February 2014
Hits: 4751

Start new WPF application. Add TreeView control from toolbox.
Add one label.
My XAML looks like this:

<Window x:Class="MVVMtreeView.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TreeView HorizontalAlignment="Left" Height="206" Margin="10,10,0,0" VerticalAlignment="Top" Width="497"/>
        <Label Content="Label" HorizontalAlignment="Left" Margin="10,284,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.421,0.462" Width="497"/>

    </Grid>
</Window>

Then add model, I called it TreeViewModel, and it looks like this:

namespace MVVMtreeView
{
    public class TreeViewModel
    {
        public List<string> TreeViewModels { get; set; }

        public TreeViewModel()
        {
            TreeViewModels = new List<string>();
            TreeViewModels.Add("test");
        }
    }
}

In "code behind", in MainWindow.xaml.cs, in MainWindow method, add line DataContext = new TreeViewModel(); so, in my case MainWindow.xaml.cs looks like this:

namespace MVVMtreeView
{
    /// 
    /// Interaction logic for MainWindow.xaml
    /// 
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            DataContext = new TreeViewModel();
        }
    }
}

Now, bind tree view to a model, that means in the XAML (in my case MainWindow.xaml), add ItemsSource="{Binding Path=TreeViewModels}", I also add name to a tree view, then bind label content, so now my XAML looks like this:

<Window x:Class="MVVMtreeView.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TreeView Name="tv" ItemsSource="{Binding Path=TreeViewModels}"  HorizontalAlignment="Left" Height="206" Margin="10,10,0,0" VerticalAlignment="Top" Width="497"/>
        <Label Content="{Binding ElementName=tv, Path=SelectedItem}" HorizontalAlignment="Left" Margin="10,284,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.421,0.462" Width="497"/>

    </Grid>
</Window>

Example you can download from here.

Dependency property

Details
Written by: Stanko Milosev
Category: WPF
Published: 26 January 2014
Last Updated: 26 January 2014
Hits: 4398

So, here I will just write one small and working example of dependency property, but this doesn't mean that I understand them :)

 

First create new project, and then to that solution add new user control, like on pictures:

Now add user control:

Now, go to "code behind", like on picture:

 

public partial class UserControl1 : UserControl
{
	public UserControl1()
	{
		InitializeComponent();
	}

	public static readonly DependencyProperty MyCustomProperty =
		DependencyProperty.Register("MyCustom", typeof (string), typeof (UserControl1),
			new FrameworkPropertyMetadata(MyCustomChanged));

	private static void MyCustomChanged(DependencyObject depobj, DependencyPropertyChangedEventArgs e)
	{
		
	}

	public string MyCustom
	{
		get { return GetValue(MyCustomProperty) as string; }
		set { SetValue(MyCustomProperty, value); }
	}
}

After that go to your main application (MainWindow.xaml), and add following line to your XAML: 

<myDependencyProperty:UserControl1 MyCustom="Test"  HorizontalAlignment="Left" Height="100" Margin="121,62,0,0" VerticalAlignment="Top" Width="100" x:Name="MyTestUserControl1"/>

So your XAML should look like: 

<Window x:Class="MyDependencyProperty.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:myDependencyProperty="clr-namespace:MyDependencyProperty"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <myDependencyProperty:UserControl1 MyCustom="Test"  HorizontalAlignment="Left" Height="100" Margin="121,62,0,0" VerticalAlignment="Top" Width="100" x:Name="MyTestUserControl1"/>
    </Grid>
</Window>

Note MyCustom="Test" - this is our new property which is of type string...

  1. NotifyPropertyChanged
  2. Two ways of setting datacontext
  3. Simple binding
  4. Programatically binding two text boxes

Subcategories

WPF

Beginning

Code snippets

NUnit

LINQ

Windows Forms

Page 25 of 33

  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29