MAUI: How we can disable the login form once tab on the login button

Sreenivasan, Sreejith 395 Reputation points
2025-12-01T11:08:46.33+00:00

I have a login page where user needs to enter email and password. My problem is once the user taps the login button, the email and password fields are still editable. I want to make the email and password disable after tapping the button. After tapping the button I am showing an activity indicator on the UI.

Xaml:

<?xml version="1.0" encoding="UTF-8"?>
<views:BaseContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <views:BaseContentPage.Content>
        <Grid>
            <Image Source="pma_background" Aspect="AspectFill" AutomationProperties.IsInAccessibleTree="False" />
            <ctrl:ActionForm FormBusy="{Binding LoginAction}" HorizontalOptions="Fill" VerticalOptions="Fill" BackgroundColor="Transparent">
                <ctrl:ActionForm.FormContent>
                    <Grid Margin="15" VerticalOptions="Center">
                        <Frame BackgroundColor="{StaticResource LoginBackgroundSolid}" BorderColor="Silver">
                            <StackLayout Style="{StaticResource flowForm}">
                                <Image Source="{Binding StudyLogo}" Style="{StaticResource flowIconForm}" AutomationProperties.HelpText="{ex:Localized StudyLogoHelpText}">
                                    <Image.GestureRecognizers>
                                        <TapGestureRecognizer Command="{Binding OnEndpointChangeCommand}" NumberOfTapsRequired="7"/>
                                    </Image.GestureRecognizers>
                                </Image>
                                <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Orientation="Vertical">
                                    <ctrl:SSOOptionsContainer ItemsSource="{Binding OptionsSSO}" />
                                </StackLayout>
                                <Label Text="{ex:Localized EmailPMAPageLabelSignInHeader}" Style="{StaticResource loginTextPrimary}" />
                                <ctrl:MaterialTextbox x:Name="email" 
                                                      Text="{Binding EmailAddress}" 
                                                      PlaceHolderText="{ex:Localized EmailPMAPageEmailPlaceholder}" 
                                                      HorizontalOptions="FillAndExpand"
                                                      KeyboardType = "Email"
                                                      ReturnKeyType="Done"
                                                      IOSTextBoxHeight="50"
                                                      DroidTextBoxHeight="50"
                                                      Margin="5,0,5,0"
                                                      MatBorderColor="{Binding EmailErrorMatBorderColor}"
                                                      AutomationProperties.HelpText="{ex:Localized EmailPMAPageEmailHelpText}"/>
                                <Label Text="{Binding EmailErrorMessage}" VerticalOptions="Start" 
                                       HorizontalOptions="StartAndExpand" Margin="2,-24,0,0" Style="{StaticResource loginTextThird}"  
                                       HorizontalTextAlignment="Start"
                                       TextColor="{StaticResource ErrorTextColor}" IsVisible="false">
                                    <Label.Triggers>
                                        <DataTrigger TargetType="Label" Binding="{Binding Source={x:Reference email}, Path=LostFocusAndInvalidEmail}" Value="true">
                                            <Setter Property="IsVisible" Value="true" />
                                        </DataTrigger>
                                        <DataTrigger TargetType="Label" Binding="{Binding EmailError}" Value="false">
                                            <Setter Property="IsVisible" Value="false" />
                                        </DataTrigger>
                                    </Label.Triggers>
                                </Label>
                                <ctrl:MaterialTextbox x:Name="password" Text="{Binding Password}"
                                                      Style="{StaticResource loginEntry}" 
                                                      KeyboardType = "Default"
                                                      ReturnKeyType="Done"
                                                      IsPassword="true"
                                                      HorizontalOptions="FillAndExpand"
                                                      IOSTextBoxHeight="50"
                                                      DroidTextBoxHeight="50"
                                                      Margin="5,0,5,0"
                                                      MatBorderColor="{Binding PasWordErrorMatBorderColor}"
                                                      PlaceHolderText="{ex:Localized EmailPMAPagePasswordPlaceholder}" 
                                                      AutomationProperties.HelpText="{ex:Localized EmailPMAPagePasswordHelpText}">
                                    <ctrl:MaterialTextbox.Triggers>
                                        <DataTrigger TargetType="ctrl:MaterialTextbox" Binding="{Binding IsBiometricsIconAvailable}" Value="true">
                                            <Setter Property="IsVisible" Value="false" />
                                        </DataTrigger>
                                        <DataTrigger TargetType="ctrl:MaterialTextbox" Binding="{Binding IsBiometricsIconAvailable}" Value="false">
                                            <Setter Property="IsVisible" Value="true" />
                                        </DataTrigger>
                                    </ctrl:MaterialTextbox.Triggers>
                                </ctrl:MaterialTextbox>
                                <Grid>
                                    <ctrl:MaterialTextbox x:Name="passwordBiometrics" Text="{Binding Password}"
                                                          Style="{StaticResource loginEntry}" 
                                                          KeyboardType = "Default"
                                                          ReturnKeyType="Done"
                                                          IsPassword="true"
                                                          HorizontalOptions="FillAndExpand"
                                                          IOSTextBoxHeight="50"
                                                          DroidTextBoxHeight="50"
                                                          Margin="5,0,5,0"
                                                          IsVisible="{Binding IsBiometricsIconAvailable}"
                                                          MatBorderColor="{Binding PasWordErrorMatBorderColor}"
                                                          PlaceHolderText="{ex:Localized EmailPMAPagePasswordPlaceholder}" 
                                                          AutomationProperties.HelpText="{ex:Localized EmailPMAPagePasswordHelpText}" />
                                    <Image Margin="10,5" Source="{Binding ImageBiometrics}" IsVisible="{Binding IsBiometricsIconAvailable}"
                                           HorizontalOptions="End" VerticalOptions="Center" 
                                           HeightRequest="30" WidthRequest="30"
                                           AutomationProperties.IsInAccessibleTree="{Binding IsBiometricsIconAvailable}"
                                           AutomationProperties.Name="{ex:Localized BiometricTitle}">
                                        <Image.GestureRecognizers>
                                            <TapGestureRecognizer Command="{Binding BiometricsAction.Command}"/>
                                        </Image.GestureRecognizers>
                                    </Image>
                                </Grid>
                                <Label Text="{ex:Localized EmailPMAPagePasswordTextBoxErrorMsg}" VerticalOptions="Start" 
                                       HorizontalOptions="StartAndExpand" Margin="2,-24,0,0" Style="{StaticResource loginTextThird}"  
                                       HorizontalTextAlignment="Start"
                                       TextColor="{StaticResource ErrorTextColor}" IsVisible="false">
                                    <Label.Triggers>
                                        <DataTrigger TargetType="Label" Binding="{Binding Source={x:Reference password}, Path=LostFocusAndInvalidPassword}" Value="true">
                                            <Setter Property="IsVisible" Value="true" />
                                        </DataTrigger>
                                        <DataTrigger TargetType="Label" Binding="{Binding Source={x:Reference passwordBiometrics}, Path=LostFocusAndInvalidPassword}" Value="true">
                                            <Setter Property="IsVisible" Value="true" />
                                        </DataTrigger>
                                        <DataTrigger TargetType="Label" Binding="{Binding PassError}" Value="false">
                                            <Setter Property="IsVisible" Value="false" />
                                        </DataTrigger>
                                    </Label.Triggers>
                                </Label>
                                <viewscustom:CustomStateButton Text="{ex:Localized EmailPMAPageSignInBtnText}" Command="{Binding LoginAction.Command}"
                                                               Margin="5,0,5,0" AutomationProperties.HelpText="{Binding CanLoginErrorText}">
                                    <viewscustom:CustomStateButton.Triggers>
                                        <DataTrigger TargetType="viewscustom:CustomStateButton" Binding="{Binding IsTryLogin}" Value="true">
                                            <Setter Property="BackgroundColor" Value="{StaticResource DisabledColor}" />
                                        </DataTrigger>
                                        <DataTrigger TargetType="viewscustom:CustomStateButton" Binding="{Binding CanLogin}" Value="false">
                                            <Setter Property="Style" Value="{StaticResource mainButtonDisabledStyle}" />
                                        </DataTrigger>
                                        <DataTrigger TargetType="viewscustom:CustomStateButton" Binding="{Binding CanLogin}" Value="true">
                                            <Setter Property="Style" Value="{StaticResource mainButtonEnabledStyle}" />
                                        </DataTrigger>
                                    </viewscustom:CustomStateButton.Triggers>
                                </viewscustom:CustomStateButton>
                                <Label Text="{ex:Localized EmailPMAPageForgotPasswordText}" 
                                       AutomationProperties.HelpText="{ex:Localized EmailPMAPageForgotPasswordTextHelpText}"
                                       HorizontalOptions="Center" Style="{StaticResource loginForgot}">
                                    <Label.Behaviors>
                                        <behaviors:LabelCenterTextBehavior />
                                        <behaviors:LabelUnderlineBehavior />
                                    </Label.Behaviors>
                                    <Label.GestureRecognizers>
                                        <TapGestureRecognizer Command="{Binding ForgotPinAction.Command}" />
                                    </Label.GestureRecognizers>
                                </Label>
                                <ctrl:VersionPrivacyLabel VersionText="{Binding AppVersion}"
                                                          PrivacyText="{ex:Localized EmailPMAPagePrivacyLinkText}"
                                                          Command="{Binding OnPolicyCommand}"/>
                                 <Picker IsVisible="false" ItemsSource="{Binding Endpoints}"
                                         x:Name="pickerEndpoints" 
                                         SelectedItem="{Binding SelectedEndpoint, Mode=TwoWay}"/>
                            </StackLayout>
                        </Frame>
                    </Grid>
                </ctrl:ActionForm.FormContent>
                <ctrl:ActionForm.Buttons>
                </ctrl:ActionForm.Buttons>
            </ctrl:ActionForm>
        </Grid>
    </views:BaseContentPage.Content>
</views:BaseContentPage>

Xaml.cs:

public partial class EmailPMAPage : BaseContentPage<LoginPMAViewModel>
{
    public EmailPMAPage()
    {
        InitializeComponent();
        NavigationPage.SetHasNavigationBar(this, false);
    }

    private async void GetToken()
    {
        await CrossFirebaseCloudMessaging.Current.CheckIfValidAsync();
        var token = await CrossFirebaseCloudMessaging.Current.GetTokenAsync();
        Preferences.Default.Set("devicefcmtoken", token);
        Console.WriteLine($"FCM token::>> {token}");
    }
    protected async override void OnAppearing()
    {
        base.OnAppearing();
        Task.Run(async delegate
        {
            await new DeviceInfoService().CheckServerVersionAsync();
        });
        Task.Run(async delegate
        {
            await ViewModel.RefreshScreen();
        });
        ViewModel.CallBackDisplayEndpoints += HandlerCallBackDisplayEndpoints;
        if(BindingContext is LoginPMAViewModel vm)
        {
            await vm.InitializeAsync();
        }
    }
    private void HandlerCallBackDisplayEndpoints()
    {
        pickerEndpoints.IsVisible = true;
        pickerEndpoints.Focus();
    }
}

ViewModel is little lengthy, so adding it as a text file below:

LoginPMAViewModel.txt

I am planning to send a WeakReferenceMessenger from viewmodel once the button taps and subscribe it on xaml.cs page and on that I planned to add the disable code for email and password. Is that the correct approach on this? suggest me to the correct way.
I can provide a demo for debugging this issue. Please send a private message for that.

Developer technologies | .NET | .NET MAUI
{count} votes

Answer accepted by question author and recommended by moderator
  1. Jack Dang (WICLOUD CORPORATION) 5,960 Reputation points Microsoft External Staff Moderator
    2025-12-02T11:43:19.7033333+00:00

    Hi @Sreenivasan, Sreejith ,

    Here's the modified code:

    Hope this helps! If my answer was helpful - kindly follow the instructions here so others with the same problem can benefit as well.

    1 person found this answer helpful.

0 additional answers

Sort by: Most helpful

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.