元件重疊在一起,當發生滑鼠點擊事件,你發現他會從最上面的元件開始,每個元件都會發生事件,這現像不光只是有在Silverlight中有,Web或Window From也有這現象。
要防止這個現像也很簡單,只要讓MouseButtonEventArgs.Handled值為true就可以了。
元件重疊在一起,當發生滑鼠點擊事件,你發現他會從最上面的元件開始,每個元件都會發生事件,這現像不光只是有在Silverlight中有,Web或Window Form也有這現象。
如這個範例,當在Grid3上點擊,卻連Grid2與Grid3都發生事件。
(Silverlight實際範例,請各位在各Grid上點擊看看)
要防止這個現像也很簡單,只要讓MouseButtonEventArgs.Handled值為true就可以了。
private void Grid3_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
e.Handled = true; //將Handled設定為true,其他元件就不會發生事件。
MessageBox.Show("Grid3 Clicked");
}
在Silverlight中會發生事件氣泡的有如下:
- 滑鼠點擊
- MouseLeftButtonDown
- MouseLeftButtonUp
- MouseRightButtonDown
- MouseRightButtonUp
滑鼠滾輪
- MouseWheel
- 拖曳
- DragEnter
- DragLeave
- DragOver
- Drop
- 鍵盤輸入
- KeyDown
- KeyUp
- TextInput
- TextInputStart
- TextInputUpdate
哇~這麼多,你會不會想說為什麼系統不直接就設成True就好了,還要自己寫時自己注意多麻煩丫。
不過他真的這樣做,才真的麻煩。
<Button>
<Border>
<StackPanel Orientation="Horizontal">
<Image/>
<TextBlock/>
</StackPanel>
</Border>
</Button>
你想想,如果上面個範例,事件沒有氣泡,你在Button上點擊,Button還會發生Click事件嗎?
答案是不會,因為事件可能在Image或TextBlock上就結束了。
可Image只是佈局用的元件不應該Handled事件,但系統怎麼會知道Image是佈局用。
所以必需要自己設,那我們來比較一下是事件氣泡在Button中Handled,還是事件不氣泡而在Button下的所有子元件設定事件要向上傳遞。
是不是事件氣泡比較簡單。