值得注意的IsHitTestVisible

原文: 值得注意的IsHitTestVisible 這個屬性我們平時可能并不怎麼用.先來看下MSDN上的解釋:

解釋的非常專業,然而我并沒有看懂.

說說我的了解吧:把這個屬性設定為false,看起來沒有變化,但操作上已經把他完全忽視了,不觸發事件,可以直接點到它下面的東西.

這個屬性能友善的解決工作中常見的麻煩,比如下面這個例子:

注意上面那部分.效果很簡單,就是個漸變的效果.但是這個漸變貫穿了兩列,就使得處理起來有點小麻煩.

當然解決方案有很多:

可以寫兩個ListBoxItem的樣式,第一個放頂部有漸變的背景,和右部保持一緻,通過樣式選擇器來實作.這顯然比較麻煩.

還可以在大背景下放個漸變,ListBoxItem的上半部分做成透明,這樣相對簡單,但不一定能實作理想的效果.

IsHitTestVisible屬性就很好的解決了這個問題.直接在上層放個border,背景設定成漸變,IsHitTestVisible設定為false.這樣就既能看到漸變效果,又能透過border,直接點到ListBoxItem.設定一個屬性就解決了問題,非常友善.相當于在上面放了個蒙闆,但是這個蒙闆能看到卻點不到.

類似的我還想到了一個場景:

這個效果頂層是個圖檔,IsHitTestVisible為false,透明為0.3.

并不是圖檔是個背景,然後所有控件都是半透明效果.

見代碼:

 XMAL:

<Grid>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="70" />
                <RowDefinition />
                <RowDefinition Height="50" />
            </Grid.RowDefinitions>
            <Border Background="Red">
                <Label Content="logo" Foreground="White" />
            </Border>
            <Grid Grid.Row="1" Background="#AAAFAF">
                <StackPanel
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    Button.Click="StackPanel_Click">
                    <Button
                        Width="132"
                        Height="32"
                        Margin="10"
                        Content="金閃閃" />
                    <Button
                        Width="132"
                        Height="32"
                        Margin="10"
                        Content="小圓" />
                </StackPanel>
                <Label
                    Width="100"
                    Height="100"
                    Margin="76,29,266,171"
                    Background="Green"
                    Content="我不透明"
                    Foreground="Blue" />
                <Label
                    Width="100"
                    Height="40"
                    Margin="112,40,230,220"
                    Background="Red"
                    Content="我不透明"
                    Foreground="Blue" />
            </Grid>
            <Border Grid.Row="2" Background="#555F5F">
                <Label Content="狀态欄" Foreground="White" />
            </Border>
        </Grid>
        <Image
            Name="img"
            Width="0"
            Height="0"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            IsHitTestVisible="False"
            Opacity=".8"
            Source="/Image/jinshanshan.png"
            Stretch="Fill" />
    </Grid>      

背景:

private void StackPanel_Click(object sender, RoutedEventArgs e)
        {
            Button btn = (Button)e.OriginalSource;
            string content = btn.Content.ToString();
            if (content == "金閃閃")
            {
                img.Source = new BitmapImage(new Uri(@"/Image/jinshanshan.png", UriKind.Relative));
            }
            if (content == "小圓")
            {
                img.Source = new BitmapImage(new Uri(@"/Image/jinshanshan.png", UriKind.Relative));
            }

            DoubleAnimation daX = new DoubleAnimation();
            daX.From = 0;
            daX.To = 400;
            daX.FillBehavior = FillBehavior.HoldEnd;
            Storyboard.SetTarget(daX, img);
            Storyboard.SetTargetProperty(daX, new PropertyPath(Image.WidthProperty));
            DoubleAnimation daY = new DoubleAnimation();
            daY.From = 0;
            daY.To = 400;
            daY.FillBehavior = FillBehavior.HoldEnd;
            Storyboard.SetTarget(daY, img);
            Storyboard.SetTargetProperty(daY, new PropertyPath(Image.HeightProperty));
            DoubleAnimation daOp = new DoubleAnimation();
            daOp.From = 1;
            daOp.To = 1;
            daOp.FillBehavior = FillBehavior.HoldEnd;
            Storyboard.SetTarget(daOp, img);
            Storyboard.SetTargetProperty(daOp, new PropertyPath(Image.OpacityProperty));

            Storyboard sb = new Storyboard();
            sb.Children.Add(daX);
            sb.Children.Add(daY);
            sb.Children.Add(daOp);
            sb.Begin();
        }