[C# WPF] WPF Command Binding 하는 방법

안녕하세요.

 

오늘은 C# WPF에서 Command Binding 하는 방법에 대해서 예제 코드를 통해서 어떻게 Command Binding 하는지 보여 드리려고 합니다.

 

참고로, 아래 사이트에서 참고하여 저도 따라 치면서 공부를 했던 것이기 때문에 자세한 코드 내용 이해는 아래 사이트에서 보시고 이해하시면 좋을 듯 합니다.

 

참고 사이트
 

[WPF MvvM] Command Binding 기본 Ⅲ

이번 시간은 MvvM에서 사용하는 Command Binding 의 기본 세번째 시간입니다. 이전 글은 아래 링크 참...

blog.naver.com

 

그럼 바로 WPF에서 Command Binding 하는 방법을 예제 코드를 통해서 보여 드리도록 하겠습니다.

 

먼저 아래와 같이 빈 WPF를 생성해 주시고 Button 컨트롤 3개를 배치해 주시기 바랍니다.

 

 

빈 WPF 프로젝트 생성 및 Button 컨트롤 배치

그럼 이제 위의 Button 컨트롤에 있는 Command 속성에 Binding 하는 예제 코드를 보여 드리도록 하겠습니다.

 

MainXaml.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<Window x:Class="BindingTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:BindingTest"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="600">
    <Window.Resources>
        <local:ViewModel x:Key="vm"></local:ViewModel>
    </Window.Resources>
    <Grid>
 
        <Button x:Name="uiBtn_Connect" Content="Connect" HorizontalAlignment="Left" 
                Margin="44,0,0,0" VerticalAlignment="Center" Height="96" Width="104"
                Command="{Binding ConnectCommand, Source={StaticResource vm}}"/>
 
        <Button x:Name="uiBtn_Cancel" Content="Cancel" HorizontalAlignment="Left" 
                Margin="202,0,0,0" VerticalAlignment="Center" Height="96" Width="104"
                Command="{Binding CancelCommand, Source={StaticResource vm}}"/>
 
        <Button x:Name="uiBtn_Update" Content="Update" HorizontalAlignment="Left" 
                Margin="362,0,0,0" VerticalAlignment="Center" Height="96" Width="104"
                Command="{Binding UpdateCommand, Source={StaticResource vm}}"/>
 
    </Grid>
</Window>
 
cs

 

ViewModel.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
using System;
using System.Collections.Generic;
using System.Text;
using System.Windows;
using System.Windows.Input;
 
namespace BindingTest
{
    public class ViewModel
    {
        private ICommand connectCommand;
        public ICommand ConnectCommand
        {
            get
            {
                return (this.connectCommand) ?? 
                    (this.connectCommand = new DelegateCommand(Connect));
            }
        }
 
        private ICommand cancelCommand;
        public ICommand CancelCommand
        {
            get
            {
                return (this.cancelCommand) ?? 
                    (this.cancelCommand = new DelegateCommand(Cancel));
            }
        }
 
        private ICommand updateCommand;
        public ICommand UpdateCommand
        {
            get
            {
                return (this.updateCommand) ?? (this.updateCommand = new DelegateCommand(Update));
            }
        }
 
        private void Update()
        {
            MessageBox.Show($"Update");
        }
 
        private void Connect()
        {
            MessageBox.Show($"Connect");
        }
 
        private void Cancel()
        {
            MessageBox.Show($"Cancel");
        }
    }
}
 
cs

 

DelegateCommand.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
using System;
using System.Collections.Generic;
using System.Text;
using System.Windows.Input;
 
namespace BindingTest
{
    public class DelegateCommand : ICommand
    {
        private readonly Func<bool> canExecute;
        private readonly Action execute;
 
        public DelegateCommand(Action exectue) : this(exectue, null)
        {
 
        }
 
        public DelegateCommand(Action execute, Func<bool> canExecute)
        {
            this.execute = execute;
            this.canExecute = canExecute;
        }
 
        /// <summary>
        /// can executes event handler
        /// </summary>
        public event EventHandler CanExecuteChanged;
 
        /// <summary>
        /// implement of icommand can execute method
        /// </summary>
        /// <param name="o">parameter by default of icomand interface</param>
        /// <returns>can execute or not</returns>
        public bool CanExecute(object o)
        {
            if (this.canExecute == null)
            {
                return true;
            }
            return this.canExecute();
        }
 
        /// <summary>
        /// implement of icommand interface execute method
        /// </summary>
        /// <param name="o">parameter by default of icomand interface</param>
        public void Execute(object o)
        {
            this.execute();
        }
 
        /// <summary>
        /// raise ca excute changed when property changed
        /// </summary>
        public void RaiseCanExecuteChanged()
        {
            if (this.CanExecuteChanged != null)
            {
                this.CanExecuteChanged(this, EventArgs.Empty);
            }
        }
    }
}
 
cs
실행 결과

 

위와 같이 각 버튼을 클릭해보면, Command 속성에 Binding한 메서드에 맞는 MessageBoxShow 돼서 메시지가 출력되는 것을 확인하실 수 있습니다.

 

다음 포스팅에서는 Command Binding을 더 응용해서 다양한 컨트롤과 함께 사용하는 법을 보여 드리도록 하겠습니다.

 

감사합니다.^^

728x90

이 글을 공유하기

댓글

Designed by JB FACTORY