如何在代码隐藏中创建 Xamarin 工具提示

Question

我正在使用以下示例进行测试。 https://github.com/CrossGeeks/TooltipSample

示例工作正常，甚至可以与标签一起使用（示例使用按钮、图像和框视图）。问题出在我的主应用程序中，我需要在代码隐藏中创建工具提示。

为了测试如何做到这一点，在完全相同的解决方案中（来自上面的示例）我创建了一个 TestPage 并将其设为我在 App.xaml.cs 中的 MainPage。 XAML 看起来像这样：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage 
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    x:Class="ToolTipSample.TestPage">
<ContentPage.Content>
    <StackLayout
        x:Name="mainLayout"
        BackgroundColor="Yellow">
        <StackLayout.GestureRecognizers>
            <TapGestureRecognizer Tapped="Handle_Tapped"/>
        </StackLayout.GestureRecognizers>
    </StackLayout>
</ContentPage.Content>

代码隐藏看起来像这样：

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

using ToolTipSample.Effects;

namespace ToolTipSample
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class TestPage : ContentPage
    {
        public TestPage()
        {
            InitializeComponent();

            var actionLabel = new Label
            {
                Text = "Show Tooltip",
                WidthRequest = 150,
                VerticalOptions = LayoutOptions.StartAndExpand,
                HorizontalOptions = LayoutOptions.Center,
                BackgroundColor = Color.Wheat
            };

            // Add tooltip to action label
            TooltipEffect.SetPosition(actionLabel, TooltipPosition.Bottom);
            TooltipEffect.SetBackgroundColor(actionLabel, Color.Silver);
            TooltipEffect.SetTextColor(actionLabel, Color.Teal);
            TooltipEffect.SetText(actionLabel, "This is the tooltip");
            TooltipEffect.SetHasTooltip(actionLabel, true);

            actionLabel.Effects.Add(Effect.Resolve($"CrossGeeks.{nameof(TooltipEffect)}"));

            mainLayout.Children.Add(actionLabel);
        }

        void Handle_Tapped(object sender, System.EventArgs e)
        {

            foreach (var c in mainLayout.Children)
            {
                if (TooltipEffect.GetHasTooltip(c))
                {
                    TooltipEffect.SetHasTooltip(c, false);
                    TooltipEffect.SetHasTooltip(c, true);
                }
            }
        }
    }
}

所有其他代码不变。

当我点击标签时，工具提示按预期出现。 但是当我点击背景时它并没有消失（就像示例中 XAML 中创建的那样）。

还有一件事。如果我点击两次它就会消失。

谁能看到我错过了什么？

谢谢。

Answer 1

根据您的描述和代码，您可以删除以下行代码来实现您的要求。

actionLabel.Effects.Add(Effect.Resolve($"CrossGeeks.{nameof(TooltipEffect)}"));

页面加载时不需要为控件添加效果，因为通过以下代码点击此控件时会添加此效果：

 static void OnHasTooltipChanged(BindableObject bindable, object oldValue, object newValue)
    {
        var view = bindable as View;
        if (view == null)
        {
            return;
        }

        bool hasTooltip = (bool)newValue;
        if (hasTooltip)
        {
            view.Effects.Add(new ControlTooltipEffect());
        }
        else
        {
            var toRemove = view.Effects.FirstOrDefault(e => e is ControlTooltipEffect);
            if (toRemove != null)
            {
                view.Effects.Remove(toRemove);
            }
        }
    }

如何在代码隐藏中创建 Xamarin 工具提示

How to create a Xamarin Tooltip in code-behind

tooltip

xamarin.android

xamarin

xamarin.forms