3.4 XAML & EventHandler
01. 목표
1. 용어 이해
이벤트: 버튼 클릭 등의 이벤트 트리거(발생 시작점)
이벤트 핸들러: 이벤트 발생시, 이후 처리 동작
- 이벤트 핸들러는 , 이벤트가 발생 후, 이벤트에 따른 로직 처리를 의미합니다.
- 이벤트 핸들러는 이벤트가 아닙니다.
- 이벤트 핸들러는, 이벤트 신호를 받아 처리는 부분입니다.
목표
[버튼 7]을 클릭하면, 레이블의 출력값이 0에서 7로 변경되도록 구현합니다.
XMAL 버튼 컨트롤을 누르는 이벤트가, Code Behind에서 이벤트 핸들러를 동작하도록 구현해 봅시다.
02. 예제 준비
이전 포스트에서 작업했던 Calculator를 이어갑니다.
이전 포스트 작업물이 없다면, Calculator 예제를 다운받고 확인합니다.
03. 이벤트 핸들러 구현
03.1
① UI 디자이너에서, 구현된 버튼 중 '7'에 해당하는 버튼 컨트롤 태그를 찾아 클릭합니다.
② 버튼의 태그에 Click 이벤트(⚡) 를 추가해봅시다.
XAML 소스코드 에디터에서, Click = " " 이벤트 코드를 자동 완성(tab)으로 추가해봅니다.
03.2
③ Click을 입력하다보면 자동으로 이벤트 헨들러를 추가할 것을 묻는 자동완성이 보입니다.
03.3
④ 자동완성 메시지가 뜰 때 엔터를 누르면,
Button 컨트롤의 Click 이벤트에 대한, 이벤트 핸들러를 자동으로 추가합니다.
이벤트 핸들러의 기본 함수 형태가 Code Behind(C# 소스 코드)에 자동으로 추가됩니다.
03.4
⑤ MainWindows.xaml.cs 파일로 이동해 자동 완성된 이벤트 핸들러 함수를 확인합니다.
⑥ 이벤트 헨들러가 자동으로 구현되어 있음을 확인할 수 있습니다.
(이벤트 헨들러는 이벤트가 발생했을때 처리하는 로직을 의미합니다. 이벤트가 아닙니다.)
*UI 디자이너 컨트롤을 더블클릭하면, 한번에 가능하다.
03.5
⑦ 이벤트 헨들러는 이벤트가 발생하면 이벤트 발생 신호를 전달받아 실행하는 부분입니다.
'이벤트' 발생 → "이벤트 핸들러" 처리
이벤트 헨들러는 "버튼 클릭 이벤트"가 발생하면 그 신호를 전달받아 실행될 로직을 구현하는 부분입니다.
계산기에서 7이 입력되는 것과 동일한 로직을 구현합니다.
- 기존에 계산기에 0이 입력되어 있다면, 7 버튼을 누를때 숫자 0이 7로 변경되고,
- 기존에 계산기에 0 이외의 다른 값이 존재했다면, 7이라는 한자리 십진수를 뒤에 추가하는 형태로 구현합니다.
if(resultLabel.Content.ToString() == "0")
{
resultLabel.Content = "7";
}
else
{
resultLabel.Content = $"{resultLabel.Content}7";
}
04. 실행 결과 확인
⑧ 프로그램을 실행하여 확인합니다.
이전 포스트에서 작업한 Calculator 프로젝트는 생성자에서 resultLabel의 Contents 속성값으로 12345가 입력되도록 작업했었습니다.
⑨ 숫자 7 버튼을 클릭하면, 기존에 레이블에 숫자 0이 아닌 숫자 12345 가 입력되어 있기 때문에,
12345 뒤에 십진수 숫자 7 한자리가 추가된 결과를 레이블에 보여집니다.
05. 조금더 살펴봅시다.
- 솔루션 탐색기의 모든 파일 보기 버튼을 클릭하면, 프로젝트에 포함된 모든 파일이 보입니다.
- 자동완성된 파일 중 obj > Debug > MainWindows.i.g.cs 파일을 확인해봅시다.
- MainWindows.xaml.cs 의 partial class 입니다.
- MainWindows.xaml 소스의 line 50 XAML 코드가 반영되어 있습니다.
- 파일 내부에 XAML에서 작업했던 UI 컨트롤에 해당하는 C# 소스 코드가 자동 완성되어 있음을 확인 할 수 있습니다.
- sevenButton.Click 이벤트에 MainWindows의 sevenButton_Click 이벤트 헨들러가 자동 등록되어 있음을 확인할 수 있습니다.
06. 컨트롤 속성창에서 다양한 이벤트 핸들러 구현
