Xamarin 表单:隐藏和显示密码功能不适用于输入 [英] Xamarin forms: Hide and show password feature is not working for entry

问题描述

我已经为入口组件实现了隐藏和显示密码功能.它最初不起作用，但经过一次捉迷藏，它开始工作.图标在变化，但密码没有显示.此问题仅在 android 平台上.

I have implemented the hide and show password feature for the entry component. It is not working initially, but after one hide and show, it starts working. The icons are changing but the password is not showing. This issue is only on the android platform.

我的代码:

Xaml:

<StackLayout Padding="3" Orientation="Horizontal">

    <local:CustomEntry
        x:Name="password_entry"
        IsPassword="True"
        Placeholder="Password"
        Style="{StaticResource LoginEntryStyle}"/>

    <Image 
        x:Name="password_icon"
        Style="{StaticResource LoginEntryImageStyle}" 
        HorizontalOptions="End"
        Source="ic_hide_password_xx.png">
        <Image.GestureRecognizers>
            <TapGestureRecognizer
                Tapped="PasswordIcon_Clicked"
                NumberOfTapsRequired="1">
            </TapGestureRecognizer>
        </Image.GestureRecognizers>
    </Image>
</StackLayout>

Xaml.cs:

bool showPassword = true;
private void PasswordIcon_Clicked(object sender, EventArgs e)
{
    if (showPassword)
    {
        password_icon.Source = "ic_show_password_xx.png";
        password_entry.IsPassword = false;
        showPassword = false;
    }
    else
    {
        password_icon.Source = "ic_hide_password_xx.png";
        password_entry.IsPassword = true;
        showPassword = true;
    }
}

我尝试使用 password_entry.IsPassword 而不是 bool 变量，但没有成功.我已在此处上传了一个示例项目以供参考.

Instead of the bool variable, I have tried with password_entry.IsPassword, but no luck. I have uploaded a sample project here for reference.

推荐答案

您可以使用触发器轻松完成，只需检查条目的 IsPassword 属性

You can do it easily with triggers and check only the IsPassword property for the entry

<StackLayout Padding="3" Orientation="Horizontal">
    <local:CustomEntry
        x:Name="password_entry"
        IsPassword="True"
        Placeholder="Password"
        Style="{StaticResource LoginEntryStyle}"/>
    <Image
        Style="{StaticResource LoginEntryImageStyle}" 
        HorizontalOptions="End">
        <Image.Triggers>
            <DataTrigger
                TargetType="Image"
                Binding="{Binding Source={x:Reference password_entry}, Path=IsPassword}"
                Value="True">
                <Setter
                    Property="Source"
                    Value="ic_show_password_xx" />
            </DataTrigger>
            <DataTrigger
                TargetType="Image"
                Binding="{Binding Source={x:Reference password_entry}, Path=IsPassword}"
                Value="False">
                <Setter
                    Property="Source"
                    Value="ic_hide_password_xx" />
            </DataTrigger>
        </Image.Triggers>
        <Image.GestureRecognizers>
            <TapGestureRecognizer Tapped="PasswordIcon_Clicked" />
        </Image.GestureRecognizers>
    </Image>
</StackLayout>

在您的代码后面，只需将倒置布尔值添加到手势识别器点击的条目 IsPassword 属性

And on your code behind just assing inverted bool to the entry IsPassword property on gesture recognizer tap

private void PasswordIcon_Clicked(object sender, EventArgs e)
{
    password_entry.IsPassword = !password_entry.IsPassword;
}

这篇关于Xamarin 表单:隐藏和显示密码功能不适用于输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！