2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

[WPF/xaml] 上にかぶせたTextBlockを通り抜けて下のボタンがClickイベントを取れるようにする(IsHitTestVisible)

Last updated at Posted at 2020-01-20

もくじ
https://qiita.com/tera1707/items/4fda73d86eded283ec4f

やりたいこと

何かのコントロールの上にTextBlockをかぶせて文字を表示させるが、TextBlockを素通りしてその下のコントロールのClickイベントなどを受けたい。

例えば、なにかエラーメッセージを半透明のTextBlockで表示はするが、その下のコントロールではいつも通りClickイベントやらドラッグイベントやらを取りたい。
(=上にかぶせたらその部分だけ押せなくなる、というのを回避したい)

やり方

コントロールのIsHitTestVisibleをfalseにしてやる。
そうすると、そのコントロールのクリックやドラッグなどのイベントが起きなくなり、クリックしたときにはその下のコントロールのイベントが起きるようになる。
(文字だけ見えて実体がないような、幽霊な感じになる)

MainWindow.xaml
<Window x:Class="WpfApp39.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:WpfApp39"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid Background="Azure">
        <!-- ボタン(押したらMsgBox出すようにButton_Clickに書いている) -->
        <Button Margin="100" Content="ボタン" Click="Button_Click" FontSize="50"/>

        <!-- IsHitTestVisibleをtrue/falseにしたTextBlock -->
        <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
            <!-- IsHitTestVisibleがtrue → あたり判定あり → 下のボタンは押せない -->
            <TextBlock Text="IsHitTestVisible = true" FontSize="50" Background="#66990099" IsHitTestVisible="True"/>
            <!-- IsHitTestVisibleがtrue → あたり判定なし → 下のボタンはを押せる -->
            <TextBlock Text="IsHitTestVisible = false" FontSize="50" Background="#66990000" IsHitTestVisible="False"/>
        </StackPanel>
    </Grid>
</Window>

上のIsHitTestVisibleをtrueにしたTextBlockはイベントをとるため、TextBlockを押してもその下のボタンを押したことにはならない。

下のIsHitTestVisibleをfalseにしたTextBlockはイベントを素通りするため、TextBlockを押すとその下のボタンをおしたことになる。

image.png

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?