毛伊岛：单击和双击的不同事件

Question

双击与单击时如何创建不同的方法？ 如何重新创建：

1. 采用默认的“新毛伊岛应用程序”
2. 添加本文档中的前两个代码块：https://learn.microsoft.com/en-us/dotnet/maui/fundamentals/gestures/tap?view=net-maui-7.0
3. 然后添加第二个单击功能 MainPage.Xaml 现在看起来像这样（在图像部分之后被截断，因为其余部分是相同的）：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MauiApp2.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Image
                Source="dotnet_bot.png"
                SemanticProperties.Description="Cute dot net bot waving hi to you!"
                HeightRequest="200"
                HorizontalOptions="Center" >
                <!--******* add gesture recognizers to default app ******-->
                <Image.GestureRecognizers>
                    <TapGestureRecognizer Tapped="OnTapGestureRecognizerDoubleTapped"
                              NumberOfTapsRequired="2" />
                    <TapGestureRecognizer Tapped="OnTapGestureRecognizerSingleTapped"
                              NumberOfTapsRequired="1" />
                </Image.GestureRecognizers>
                <!--******** end add gesture recognizers to default app *******-->
            </Image>

            <Label
                Text="Hello, World!"
...

然后在 MainPage.xaml.cs 中，我添加了两个方法：

    void OnTapGestureRecognizerDoubleTapped(object sender, TappedEventArgs args)
    {
        CounterBtn.Text = $"Double tapped image";

    }
    void OnTapGestureRecognizerSingleTapped(object sender, TappedEventArgs args)
    {
        CounterBtn.Text = $"Single tapped image";

    }

现在，当您运行并双击/点击图像时，它首先进入单击方法，然后是双击方法，然后返回到单击方法。

防止调用单击方法的最佳方法是什么？

Answer 1

基于这些评论，我实现了双击与单击，如下所示：

    bool doubleTapped;
    bool ignoreNextTap;
    void OnTapGestureRecognizerDoubleTapped(object sender, TappedEventArgs args)
    {
        doubleTapped = true;
    }
    async void OnTapGestureRecognizerSingleTapped(object sender, TappedEventArgs args)
    {
        var delay = Task.Delay(555);
        await delay;
        if (ignoreNextTap)
        {
            ignoreNextTap = false;
            return;
        }
        if (doubleTapped)
        {
            doubleTapped = false;
            ignoreNextTap = true;
            CounterBtn.Text = $"Double tapped image";
        }
        else
        {
            CounterBtn.Text = $"Single tapped image";
        }
    }

它确实有效，但看起来确实很老套。基本上，什么单击方法会休眠半秒，以查看是否会引发 doubleTapped 标志。如果是，则它调用应该为 doubleTap 执行的代码 ("CounterBtn.Text = $"Double tapped image";")。否则，它调用 singleTap 代码 ("CounterBtn.Text = $"单击图像";")。 但是，为了防止第二次单击注册，我为ignoreNextTap添加了另一个布尔值。我看到其他语言的类似帖子（如何自定义单击为双击？js），一般方法与此相同。我想除了延迟/睡眠方法来查看是否发生第二次点击之外，没有其他方法可以做到这一点。这通常会影响 UI 的敏捷性。

Answer 2

对我来说，它按照边境管制的预期工作。点击一次进入第一种方法，点击两次进入第二种方法：

                <Border.GestureRecognizers>
                <TapGestureRecognizer NumberOfTapsRequired="1" Tapped="TapGestureRecognizer_Tapped" />
                <TapGestureRecognizer NumberOfTapsRequired="2" Tapped="TapGestureRecognizer_Tapped_2" />
            </Border.GestureRecognizers>

//后台代码

private void TapGestureRecognizer_Tapped(object sender, TappedEventArgs e)
    {
        //tapped once
    }

    private void TapGestureRecognizer_Tapped_2(object sender, TappedEventArgs e)
    {
        //tapped twice
    }

Answer 3

默认情况下，Image 将响应

single taps

。因此

single-tap

方法将在第一次点击时被触发。当

NumberOfTapsRequired

属性设置为大于 1 时，仅当在设定的时间段内发生点击时才会执行事件处理程序。如果在该时间内没有发生第二次（或后续）点击，则它们实际上会被忽略。

因此，正如 Jason 建议的那样，最好使用

single tap gesture

并跟踪是否在一段时间内收到第二次点击。

Answer 4

上述选项不适合我，因为列表项的选择处理不正确。通过跟踪计时器周期（0.5 秒）实现双击。 在 xaml 中。

<ListView x:Name="Target_listview" ItemsSource="{Binding}" ItemTapped="Target_listview_ItemTapped">

在CS中。

private Timer Doubleclick_timer;
private void Target_listview_ItemTapped(object sender, ItemTappedEventArgs e)
{
    if (Doubleclick_timer != null) //0,5 duobleclick
    {
        Doubleclick_timer.Dispose();
        Doubleclick_timer = null;
        toast = Toast.Make("2");
        toast.Show();
    }
    else //singleclick
    {
        Doubleclick_timer = new Timer(DoubTCallBack, null, 500, 500);
    }
}

private void DoubTCallBack(object state)
{
    Doubleclick_timer.Dispose();
    Doubleclick_timer = null;
}