触摸屏穿透总结

目录

• 触摸屏穿透总结
  • 测试环境
  • 原生Button弹出的窗体
    • 原生按钮的Click
    • MouseDown无法触发
  • 多层Border弹出的窗体
  • 多层Grid弹出的窗体
  • Lable控件的TouchDown弹出的窗体
  • 原生Image弹出的窗体
  • 自定义控件弹出的窗体
    • MouseDown
    • TouchDown
  • 测试代码

触摸屏穿透总结

1. 原生控件部分弹出的窗体可以一次获取到焦点，部分则不能，例如Lable,Touch会产生穿透，部分控件发生锁定问题.
2. 布局,装饰控件弹出的窗体，无法获取到焦点，Touch会产生穿透
3. 当关闭布局，装饰控件弹出的窗体以后，会产生持续选中的问题，此时点击屏幕其他地方均会触发该控件的路由事件。
4. Touch产生的穿透问题可以通过将路由事件设置为e.Handled = true;解决

测试环境

1. 所有弹出窗体均为模态窗体
2. 触摸屏
3. 不对路由事件进行拦截和处理

原生Button弹出的窗体

原生按钮的Click

1. 可以获取焦点，无需点击两次
2. Touch事件会产生穿透

MouseDown无法触发

多层Border弹出的窗体

1. 无法获取焦点，需要点击两次
2. Touch事件直接可以获取焦点，但是会穿透

多层Grid弹出的窗体

1. 需要点击两次，第一次点击获取焦点
2. 触摸事件可以直接获取焦点，但是会穿透

Lable控件的TouchDown弹出的窗体

1. 可以一次获取焦点
2. TouchDown产生穿透
3. 也会发生锁定问题

原生Image弹出的窗体

1. 一次获取焦点
2. 重新打开焦点位于上一次的点击位
3. 如果背后有其他控件或者软件，点击以后会选中后方，再次打开窗口发生仍然会在上次点击的位置，并且会触发该事件
4. TouchDown产生穿透

自定义控件弹出的窗体

MouseDown

1. 不稳定，概率性，大部分情况可以直接获取到焦点，小概率需要两次
2. TouchDown产生穿透

TouchDown

1. 概率性再次打开锁定之前的焦点，点击其他地方触发该焦点的事件。
2. 概率性获取焦点
3. TouchDown产生穿透

测试代码

<Window x:Class="触摸屏穿透测试.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:触摸屏穿透测试"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800" WindowStartupLocation="CenterScreen" ResizeMode="CanMinimize">
    <Grid>
        <TabControl x:Name="tabControl">
            <TabItem Header="商品" x:Name="shangpin">
                
            </TabItem>
        </TabControl>
        
    </Grid>
</Window>

<UserControl x:Class="触摸屏穿透测试.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:触摸屏穿透测试"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <UniformGrid Columns="3" Rows="2">
        <Button Content="原生按钮点击" Click="Button_Click"/>
        <Button Content="原生鼠标" MouseDown="Button_MouseDown"/>
        <Border Background="Black" Margin="5" MouseDown="Border_MouseDown">
            <Border Background="Red" Margin="20">
                <TextBlock Text="装饰" FontSize="24"/>
            </Border>
        </Border>

        <Grid Background="Black" Margin="10" MouseDown="Grid_MouseDown">
            <Grid Background="Blue" Margin="20">
                <TextBlock Text="grid" FontSize="24"/>
            </Grid>
        </Grid>
        <StackPanel Background="Black" Margin="10">
            <StackPanel Background="Orange">
                <TextBlock Text="StackPanel"/>
            </StackPanel>
        </StackPanel>

        <Label Content="Label" TouchDown="Label_TouchDown"/>
    </UniformGrid>
</UserControl>


<Window x:Class="触摸屏穿透测试.FrmTest"
        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:触摸屏穿透测试"
        mc:Ignorable="d"
        Title="FrmTest" Height="450" Width="800">
    <UniformGrid Columns="4" Rows="3">
        <Button Content="原生按钮点击事件" Click="Button_Click"/>
        <Button Content="原生鼠标按下事件" MouseDown="Button_MouseDown"/>
        <Button Content="原生按钮触摸事件" TouchDown="Button_TouchDown"/>
        <Button Content="原生隧道鼠标按下" PreviewMouseDown="Button_PreviewMouseDown"/>

        <Border MouseDown="Border_MouseDown">
            <Label Content="Border按钮点击事件"/>
        </Border>
        <Border TouchDown="Border_TouchDown">
            <Label Content="Border按钮点击事件"/>
        </Border>
        <Border >
            <Label Content="Border包含Label按钮点击事件" MouseDown="Label_MouseDown"/>
        </Border>
        <Border >
            <Label Content="Border包含Label按钮点击事件" TouchDown="Label_TouchDown"/>
        </Border>

        <Border Background="Black" MouseDown="Border_MouseDown_1" Margin="5">
            <Border Margin="10" Background="White">
                <StackPanel>
                    <Label Content="多层Border测试点击事件"/>
                </StackPanel>
            </Border>
        </Border>

        <Border Background="Black" TouchDown="Border_TouchDown_1" Margin="5">
            <Border Margin="10" Background="White" >
                <StackPanel>
                    <Label Content="多层Border测试触摸事件"/>
                </StackPanel>
            </Border>
        </Border>
        <Button Margin="5">
            <Image Source="https://img.alicdn.com/tfs/TB1FjZ7VWL7gK0jSZFBXXXZZpXa-520-280.png"/>
        </Button>

        <RadioButton Margin="5">
            <StackPanel>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="测试中"/>
                    <Image Source="https://img.alicdn.com/imgextra/i3/1754317198/O1CN01mlaN7E232jWnkgIpy_!!1754317198-0-alimamacc.jpg"/>
                </StackPanel>
            </StackPanel>
        </RadioButton>
    </UniformGrid>
</Window>

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        shangpin.Content = new UserControl1();
    }
}