[WPF] コントロールをマウスクリック/タッチしたときのイベントの流れを今一度確認②
全体もくじ
⇒https://qiita.com/tera1707/items/4fda73d86eded283ec4f
やりたいこと
ふと気になったので実験したくなった。
画面の見た目上は同じ下記のようなものでも、
(赤いGridの上にButtonがあるように見える)
こういうコードと、
<Grid Background="Red">
<Button/>
</Grid>
こういうコードでは、
<Grid Background="Red"/>
<Button/>
イベントの伝わり方は違うんだったか?今一度確認したい。
使うコード
以前書いた、こちらをベースにして、一部、下記のように直す。
ButtonがGridの外にあるパターン(親子関係なし)
<Grid x:Name="MainGrid"
Background="#66FF0000"
Margin="50"
IsManipulationEnabled="True"
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">
</Grid>
<Button Margin="150" Content="ボタン"
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"
/>
このコードで、ボタンを指でタッチしたときの出力
Button_PreviewStylusDown
Button_StylusDown
Button_PreviewTouchDown
Button_TouchDown
Button_PreviewMouseLeftButtonDown
Button_PreviewMouseDown
Button_PreviewStylusUp
Button_StylusUp
Button_PreviewTouchUp
Button_TouchUp
Button_PreviewMouseLeftButtonUp
Button_PreviewMouseUp
Button_Click
ButtonがGridの中にあるパターン(親子関係あり)
<Grid x:Name="MainGrid"
Background="#66FF0000"
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="150" Content="ボタン"
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>
このコードで、ボタンを指でタッチしたときの出力
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
結果
Gridの上にボタンがあるように見える画面でも、Gridの中にButtonがある(=GridとButtonに親子関係がある)か、Gridの外にButtonがある(=GridとButtonに親子関係がない)かで、イベントの伝わり方が違う。
当たり前かもだが、結果としては、
- 親子関係があれば、イベントは
トンネリング
、バブリング
の原理でイベントが伝わる。 - 親子関係がなければ、イベントは伝わらない。
Author And Source
この問題について([WPF] コントロールをマウスクリック/タッチしたときのイベントの流れを今一度確認②), 我々は、より多くの情報をここで見つけました https://qiita.com/tera1707/items/9ddb9d67943cc6202c88著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .