[WPF] Button을 마우스 클릭/터치했을 때의 이벤트 흐름(부모와 자식 관계 있음)

전체 추첨
h tps:// 퀵했다. 작은 m / 절 1707 / MS / 4f입니다 73D86 그림 d283 그림 C4f

이벤트 관련 복권
https://qiita.com/tera1707/items/4fda73d86eded283ec4f#%E3%83%AB%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0 %E3%82%A4%E3%83%99%E3%83%B3%E3%83%88%E9%96%A2%E9%80%A3wpfxaml

하고 싶은 일



버튼 단품을 손가락으로 터치하거나 클릭했을 때의 이벤트의 흐름을 이전 기사로 시험해 보았지만, 이번에는 부모와 자식 관계가 있는 컨트롤, 예를 들어 Grid안에 들어가고 있는 Button을 눌렀을 때에 어떤 이벤트의 흐름 되는지 다시 확인하고 싶다.

실험 프로그램



코드



이전 기사에서 사용한 것을 거의 유용합니다. 다만, Grid안에 Button을 넣어 준다.

MainWindow.xaml
<Window x:Class="WpfApp64.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:WpfApp64"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="0*"/>
        </Grid.RowDefinitions>

        <Grid x:Name="MainGrid"
              Background="#66FF0000"
              Grid.Row="0"
              Margin="50"
              IsManipulationEnabled="False" 
              ManipulationStarting="MainGrid_ManipulationStarting" 
              ManipulationDelta="MainGrid_ManipulationDelta"
              ManipulationCompleted="MainGrid_ManipulationCompleted"

              PreviewMouseDown=             "MainGrid_PreviewMouseDown"             MouseDown="MainGrid_MouseDown"
              PreviewMouseUp=               "MainGrid_PreviewMouseUp"               MouseUp="MainGrid_MouseUp"
              PreviewTouchDown=             "MainGrid_PreviewTouchDown"             TouchDown="MainGrid_TouchDown"
              PreviewTouchUp=               "MainGrid_PreviewTouchUp"               TouchUp="MainGrid_TouchUp"
              PreviewStylusDown=            "MainGrid_PreviewStylusDown"            StylusDown="MainGrid_StylusDown"
              PreviewStylusUp=              "MainGrid_PreviewStylusUp"              StylusUp="MainGrid_StylusUp"
              PreviewMouseLeftButtonDown=   "MainGrid_PreviewMouseLeftButtonDown"   MouseLeftButtonDown="MainGrid_MouseLeftButtonDown"
              PreviewMouseLeftButtonUp=     "MainGrid_PreviewMouseLeftButtonUp"     MouseLeftButtonUp="MainGrid_MouseLeftButtonUp"
              PreviewMouseRightButtonDown=  "MainGrid_PreviewMouseRightButtonDown"  MouseRightButtonDown="MainGrid_MouseRightButtonDown"
              PreviewMouseRightButtonUp=    "MainGrid_PreviewMouseRightButtonUp"    MouseRightButtonUp="MainGrid_MouseRightButtonUp">

            <Button Margin="50" Content="ボタン"
                Grid.Row="0"
                Click="Button_Click"
                PreviewMouseDown="Button_PreviewMouseDown"                          MouseDown="Button_MouseDown"
                PreviewMouseUp="Button_PreviewMouseUp"                              MouseUp="Button_MouseUp"
                PreviewTouchDown="Button_PreviewTouchDown"                          TouchDown="Button_TouchDown"
                PreviewTouchUp="Button_PreviewTouchUp"                              TouchUp="Button_TouchUp"
                PreviewStylusDown="Button_PreviewStylusDown"                        StylusDown="Button_StylusDown"
                PreviewStylusUp="Button_PreviewStylusUp"                            StylusUp="Button_StylusUp"
                PreviewMouseLeftButtonDown="Button_PreviewMouseLeftButtonDown"      MouseLeftButtonDown="Button_MouseLeftButtonDown"
                PreviewMouseLeftButtonUp="Button_PreviewMouseLeftButtonUp"          MouseLeftButtonUp="Button_MouseLeftButtonUp"
                PreviewMouseRightButtonDown="Button_PreviewMouseRightButtonDown"    MouseRightButtonDown="Button_MouseRightButtonDown"
                PreviewMouseRightButtonUp="Button_PreviewMouseRightButtonUp"        MouseRightButtonUp="Button_MouseRightButtonUp"
            />
        </Grid>

        <Button Name="KirikaeBtn" 
                Width="150" Height="40" 
                HorizontalAlignment="Left" VerticalAlignment="Top" 
                Content="false"
                Click="IsManipulationEnabledChange"/>
    </Grid>
</Window>


화면 외형





결과



그리드의 버튼을 손가락으로 눌렀을 때



출력



아래와 같은 출력이 되었다.
MainGrid_PreviewStylusDown
Button_PreviewStylusDown
Button_StylusDown
MainGrid_StylusDown
MainGrid_PreviewTouchDown
Button_PreviewTouchDown
Button_TouchDown
MainGrid_TouchDown
MainGrid_PreviewMouseLeftButtonDown
MainGrid_PreviewMouseDown
Button_PreviewMouseLeftButtonDown
Button_PreviewMouseDown
MainGrid_PreviewStylusUp
Button_PreviewStylusUp
Button_StylusUp
MainGrid_StylusUp
MainGrid_PreviewTouchUp
Button_PreviewTouchUp
Button_TouchUp
MainGrid_TouchUp
MainGrid_PreviewMouseLeftButtonUp
MainGrid_PreviewMouseUp
Button_PreviewMouseLeftButtonUp
Button_PreviewMouseUp
Button_Click

그림으로 쓰면 다음과 같이 되었다.



버릇이 강하다고 생각한 부분①



단품 Button을 눌렀을 때도 버릇이 강하다고 생각했습니다. 점이지만,<Button> 에서는, PreviewMouseLeftButtonDown 에 대응하는 MouseLeftButtonDown 등, 마우스를 눌렀을 때 계 이벤트의 터널링 이벤트는 오지만, 버블링 이벤트는 오지 않는다.

버릇이 강하다고 생각한 부분②



①에도 관련되지만 PreviewMouseLeftButtonDownPreviewMouseDown
  • PreviewMouseLeftButtonDown가 부모 ⇒ 자식으로 가고 PreviewMouseDown가 부모 ⇒ 자식으로 가는 대신
  • PreviewMouseLeftButtonDown가 부모에게만 가면 PreviewMouseDown가 부모에게만 가고 PreviewMouseLeftButtonDown가 아이에게만 가고 PreviewMouseDown가 아이에게만 간다.

  • 라는 흐름이 된다.StylusDownTouchDown는 왠지 이미지대로이지만, Mouse계는 서로의 이벤트가 관계하고 있어, 나오는 순서가 정해져 있는 것 같다.

    Grid의 Button을 마우스로 클릭하면



    위의 결과로부터, Stylus계 이벤트와 Touch계 이벤트를 완전히 뽑은 이벤트가 온다.


    고찰



    모든 이벤트가 일관된 규칙(터널링 이벤트가 부모⇒자식의 방향으로 전해지고, 다음에 버블링 이벤트가 자식⇒부모의 방향으로 전해진다)이 아니라, 이벤트 개개로 전해지는 방법에 여러 개성이 있는 것 같다.
    그 근처는, 개개의 이벤트의 MS의 해설을 확실히 읽고, 한편 사용하기 전에 어떤 동작, 전해 방법을 하는지 실험하고 나서 사용하는 것이 좋을 것 같다.

    참고



    MS 카즈키 씨 이벤트 해설
    htps : // 코 m / 반찬 / ms / 43 98bf7107c3 710177

    좋은 웹페이지 즐겨찾기