WPF 및 UWP 컨트롤은 외형으로 선택하는 대신 기능으로 선택합시다.

옛날에도 블로그로 쓴 것 같은 생각이 들지만, 최근 또 생각했기 때문에 Qiita 쪽에도 써 둡니다!

WPF/UWP 컨트롤의 특징

외형은 완전히 바꿀 수 있도록 만들어졌습니다. 그래서 외형이 아니라 순수하게 기능으로 선택하는 것이 좋다는 특징이 있습니다.

예를 들면

요 전날 ReactiveProperty 샘플에서 TodoMVC와 같은 Todo 목록 앱을 만들어 보았습니다. 화면 왼쪽 상단에 일괄 체크 및 일괄 체크 해제를 수행하는 확인란이있었습니다.



이것은 외형은 체크 박스입니다만, 어느 쪽인가 하면 누르면 일괄 체크나 일괄 체크 해제의 기능을 실행해, 외형이 우연히 체크 박스 같은 버튼에 가까울까라고 생각했습니다.
그래서 이 부분은 Button 컨트롤이 되어 있습니다.

해당 부분의 XAML은 이런 느낌으로 되어 있습니다.

<Button Command="{Binding CompleteAllCommand}"
        Focusable="False"
        Margin="5">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Grid Background="White">
                <Border Margin="{TemplateBinding Margin}" Padding="{TemplateBinding Padding}">
                    <CheckBox IsHitTestVisible="False" 
                          IsChecked="{Binding IsCompletedAllItems.Value, Mode=OneWay}" 
                          Focusable="False"
                          HorizontalAlignment="Center"
                          VerticalAlignment="Center"/>
                </Border>
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

Button 의 Template 를(를) 바꾸어 CheckBox 의 외형으로 하고 있습니다. 그리고 CheckBox 자체는 움직이고 싶지 않기 때문에 IsHitTestVisible 에 False 를 설정해 눌러도 아무것도 두지 않게 했습니다.
이것은, 컨트롤이 보이고 있을 뿐의 상태로 할 수 있어 드물게 사용하는 편리한 기능이므로 존재를 기억해 두면 좋다고 생각합니다.

이 버튼을 누르면 CompleteAllCommand 에 붙어 있는 처리가 움직여 Todo 의 상태가 바뀝니다. 스테이터스가 바뀐 결과 IsCompletedAllItems 의 값이 바뀌어 CheckBox

요약

그래서 WPF/UWP는 컨트롤의 외형을 완전히 바꿀 수 있으므로, 외형은 장식이라고 생각하고 기능으로 컨트롤을 선택하도록 합시다.
그럼.