WPF

WPF(Windows Presentation Foundation)

WPF 아키텍처

System.Threading.DispatcherObject

MVVM

XAML

• 창,대화.상자, 페이지 및 사용자 정의 컨트롤을 정의

• 컨트롤, 도형 및 그래픽으로 채우는데 사용

코드 숨김

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="SDKSample.AWindow"
    Title="Window with button"
    Width="250" Height="100">

  <!-- Add button to window -->
  <Button Name="button" Click="button_Click">Click Me!</Button>

</Window>
///////////////////////////
using System.Windows;

namespace SDKSample
{
    public partial class AWindow : Window
    {
        public AWindow()
        {
            // InitializeComponent call is required to merge the UI
            // that is defined in markup with this class, including  
            // setting properties and registering event handlers
            InitializeComponent();
        }

        void button_Click(object sender, RoutedEventArgs e)
        {
            // Show message box when button is clicked.
            MessageBox.Show("Hello, Windows Presentation Foundation!");
        }
    }
}

• xmlns:x : 네임스페이스를 정의하고 코드 숨김 형식에 대한 지원을 추가하는 스키마에 매핑

• x:Class : 코드 숨김 클래스를 특정 XAML 태그에 연결하는데 사용

• <window> : 코드 숨김클래스는 <window>클래스에서 상속

• InitializeComponent : 코드 숨김 클래스를 사용하여 태그에서 정의된 UI를 병합하기 위해 코드 숨김 클래스의 생성자에서 호출

입력 및 명령

레이아웃

바인딩

데이터 바인딩

• 유저 인터페이스와 비스니스 모델 사이에 자동으로 데이터를 업데이트 해주는 방법

1. 관리되는 개체에서 데이터를 표시 및 편집할 수 있는 컨트롤로 데이터 복사

2. 컨트롤을 사용한 데이터 변경 내용이 관리된는 개체에 다시 복사되는지 확인

• 구성요소
• 바인딩 대상 개체
• 대상 속성
• 바인딩 소스
• 사용할 바인딩 소스에 있는 값 경로

데이터 흐름 방향

• OneWay 바인딩을 사용하면 소스 속성이 변경될 경우 대상 속성이 자동으로 업데이트 되지만 대상 속성이 변경될 경우 변경 내용이 다시 소스 속성으로 전파 X

• TwoWay 바인딩으로 인해 소스 속성 또는 대상 속성이 변경되어 다른 항목이 자동으로 업데이트

• OneWayToSource는 OneWay 바인딩의 반대로 대상 속성이 변경되면 소스 속성을 업데이트

소스 업데이트를 트리거하는 항목

TemplateBinding

XAML(자멜)에서 바인딩 선언

템플릿

ContorlTemplates

• 레이아웃, 테두리, 배경 및 기타 시각적 요소와 같은 컨트롤의 구조 및 시각적 모양을 정의

• Button, CheckBox

DataTemplates

• 목록이나 그리드에 항목 모음을 표시하는 것과 같이 특정 형식으로 데이터를 표시하는데 사용

• ListBox, ListView, ItemsControl

ItemsPanelTemplate

• 가로 or 세로 스택 패널, 그리드 or 컨버스와 같은 항목의 레이아웃을 정의

TemplateBinding

기본적인 틀

<Window.DataContext>
      <local:MainWindowViewModel />
  </Window.DataContext>
  <Grid>
    <ItemsControl Grid.Row="1" Margin="5" ItemsSource="{Binding DigitElements}">
      <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid IsItemsHost="True">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
	    </ItemsControl.ItemsPanel>
	    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Grid.Row="{Binding Row}" Grid.Column="{Binding Column}" Margin="3"
                        Grid.ColumnSpan="{Binding ColumnSpan}" Grid.RowSpan="{Binding RowSpan}"
                        Content="{Binding Text}" Command="{Binding Command}" 
                        CommandParameter="{Binding DataContext.Calculation, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:MainWindow}}}" />
        </DataTemplate>
	    </ItemsControl.ItemTemplate>
	    <ItemsControl.ItemContainerStyle>
	        <Style>
	            <Setter Property="Grid.Row" Value="{Binding Row}" />
	            <Setter Property="Grid.Column" Value="{Binding Column}" />
	            <Setter Property="Grid.ColumnSpan" Value="{Binding ColumnSpan}" />
	        </Style>
	    </ItemsControl.ItemContainerStyle>
    </ItemsControl>
  </Grid>

라우트된 이벤트

• 기능적 관점에서 라우트된 이벤트는 이벤트 원본뿐만 아니라 요소 트리의 여러 수신기에서 처리기를 호출할 수 있는 이벤트 유형

• 구현 관점에서 라우트된 이벤트는 WPF 이벤트 시스템에 등록되고 RoutedEvent 클래스의 인스턴스로 뒷받침되고 WPF 이벤트 시스템에서 치리되는 이벤트

이벤트가 원본 요소에서 발생하는 경우

• 원본 요소에서 루트 요소(일반적으로 페이지 또는 창)로 요소 트리를 통해 버블 업 됨

• 요소 트리를 통해 루트 요소에서 원본 요소로 터널링 됨

• 요소 트리를 통과하지 않고 원본 요소에서만 발생함

라우트 전략

• 버블링 : 이벤트 소스에서 이벤트 처리기가 호출됨 → 라우트된 이벤트는 연속 부모 요소로 라우팅되어 요소 트리 루트에 도달할 때까지 해당 이벤트 처리기를 차례로 호출

• 터널링 : 처음에 요소 트리 루트에 있는 이벤트 처리기 호출 → 라우트된 이벤트는 연속된 자식 요소로 라우팅 되어 이벤트 원본에 도달할 때까지 해당 이벤트 처리기를 차례로 호출

이벤트 처리기 연결 및 구현

<StackPanel Name="StackPanel1" Button.Click="Button_Click">
    <Button>Click me</Button>
</StackPanel>

private void Button_Click(object sender, RoutedEventArgs e)
{
    // Click event logic.
}

1. AddHandler 메서드를 직접 호출 Button1.AddHandler(ButtonBase.ClickEvent, new RoutedEventHandler(Button_Click));

2. 라우트된 이벤트가 CLR 이벤트 래퍼를 구현하는 경우 Button1.Click += Button_Click;

Handled 개념

• RoutedEventArgs 클래스는 부울 Handled 속성을 정의

• Handled 속성의 목적은 이벤트 경로를 따라 있는 이벤트 처리기가 라우트 된 이벤트를 처리됨을 표시할 수 있게 하는 것

DataContext

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

ItemsControl 클래스

<ListBox ItemsSource="{Binding Source={StaticResource dataList}}"/>
// ItemSource => ItemsControl의 콘텐츠를 생성하는데 사용되는 컬렉션을 가져오거나 설정

ItemsControl.ItemContainerStyle

<ItemsControl.ItemContainerStyle>
	<Style>
		<Setter Property="Grid.Row" Value={Binding Row} />
		<Setter Property="Grid.Column" Value={Binding Column} />
	</Style>
</ItemsControl.ItemContainerStyle>

INotifyPropertyChanged 인터페이스

• 바인딩을 다시 설정할 필요없이 바인딩된 DataGridView 컨트롤이 데이터 원본의 변경 사항을 반영

• CallerMemberName 특성을 사용하는 경우 NotifyPropertyChanged 메서드에 대한 호출은 속성 이름을 문자열 인수로 지정할 필요가 없다.

public void RaisePropertyChanged(string propertyName)
{
	PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

Setter

<Style TargetType="{x:Type TextBlock}">
	<Setter Property="FontFamily" Value="Hong Gil Dong" />
	<Setter Property="HorizontalAlignment" Value="Center" />
	<Setter Property="FonSize" Value="12pt" />
</Style>

XAML 리소스

• 리소스 디렉터리의 각 리소스에는 고유 키가 있어야함 (ex : x:Key)

<Button Backgroud="{StaticResource MyBrush}" />
<Ellipse Fill="{StaticResource MyBrush}" />

정적 및 동적 리소스

정적 리소스

• 사용 가능한 모든 리소스 사전에서 해당 키의 값을 검색하여 키를 처리

• 처리는 로드하는 동안 이루어짐

• 앱 디자인에서는 대부분의 리소스를 페이지 또는 애플리케이션 수준 리소스 사전에 집중

• 페이지 다시 로드 등의 런타임 동작에 따라 다시 평가되지 않음

정적 리소스 조회 동작

1. 조회 프로세스가 속성을 설정하는 요소를 통해 정의된 리소스 사전에서 요청된 키를 확인

2. 조회 프로세스가 논리적 트리를 상향식으로 통과하여 부모 요소와 해당 리소스 사전으로 이동 (루트에 도달할 때까지)

3. 앱 리소스를 확인

동적 리소스

• 시스템 리소스 또는 사용자가 설정할 수 있는 리소스를 포함하여 리소스의 값은 런타임까지 알려지지 않은 조건에 따라 달라짐

• 런타임 시 변경될 여지가 있는 리소스

Binding.RelativeSource

<Style x:Key="textBoxInError" TargetType="{x:Type TextBox}">
	<Style.Triggers>
		<Trigger Property="Validation.HasError" Value="true">
			<Setter Property="ToolTip"
				Value="{Binding RelativeSource={x:Static RelativeSource.Self},
												Path=(Validation.Errors)/ErrorContent}"/>
		</Trigger>
	</Style.Triggers>
</Style>

WPF Trigger

• Trigger는 어떤 조건, 이벤트등 주어졌을 때 묵시적으로 컨트롤의 상태 또는 이벤트 핸들러 등을 호출하는 기능

• Trigger를 사용하면 엘리먼트의 프로퍼티나 데이터 바인딩, 이벤트에서 발생하는 변화에 엘리먼트와 컨트롤이 어떻게 반응할지를 정할 수 있다.