Maui for Android entry x clear issue

Haviv Elbsz 2,071 Reputation points
2024-07-07T08:12:29.52+00:00

Hello All. I use Maui latest version and android Ver 34. Please is it possible in the entry field when the user tap the x to clear the entry content to display a pop-up that ask something like OK Cancel. so to prevent accidentally tapping x. Thank you.

.NET MAUI
.NET MAUI
A Microsoft open-source framework for building native device applications spanning mobile, tablet, and desktop.
3,358 questions
0 comments No comments
{count} votes

Accepted answer
  1. Leon Lu (Shanghai Wicresoft Co,.Ltd.) 74,001 Reputation points Microsoft Vendor
    2024-07-08T02:43:32.7833333+00:00

    Hello,

    is it possible in the entry field when the user tap the x to clear the entry content to display a pop-up that ask something like OK Cancel. so to prevent accidentally tapping x.

    Yes, we can set ClearButtonVisibility="Never" and add clear button to cover the Entry by Gird.

    If you have deleted icon, you can use Imagebutton as well. I set the Button's background to Transparent and set HorizontalOptions="End".

    <Grid>
        <Entry                  
               x:Name="MyEntry"                    
               FontSize="14"                     
               ClearButtonVisibility="Never"
               HeightRequest="35"
               HorizontalOptions="FillAndExpand"
               TextChanged="MyEntry_TextChanged"
               Text="test"
               VerticalOptions="FillAndExpand"/> 
    
          <Button x:Name="deleteIconButton"
                  Margin="0,0,-10,0"
                  IsVisible="False"
                  FontSize="16"
                  Text="X"
                  HorizontalOptions="End"
                  TextColor="Black"
                  Background="Transparent"
                  Clicked="Button_Clicked"/>
    </Grid>
    

    When you click the button, it will pop up an Alert to ask user, if delete content, if yes, clear the text, if no, do not make any operations. If you want to hide the delete icon, I detect the text change event, if the text is null, hide the delete icon. If you want the delete icon always show, just remove all content about deleteIconButton.IsVisible = false; in button click event and TextChanged="MyEntry_TextChanged"

    private async void Button_Clicked(object sender, EventArgs e)
    {
         bool answer = await DisplayAlert("warning?", "Would you want to delete this text", "Yes", "No");
         if (answer) {
             MyEntry.Text = "";
             deleteIconButton.IsVisible = false;
         }
    }
     
    private void MyEntry_TextChanged(object sender, TextChangedEventArgs e)
    {
         Entry entry = sender as Entry;
     
     
         if (entry.Text != null && deleteIconButton != null)
         {
             deleteIconButton.IsVisible = true;
         }
         else if (deleteIconButton != null)
         {
            deleteIconButton.IsVisible = false;
         }
    }
    

    I tried to use handler to implement it, but MAUI do not have Api to get the delete icon, we have to re-implement this delete icon as well for different platforms.

    Best Regards,

    Leon Lu


    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    **Note: Please follow the steps in our [documentation](https://docs.microsoft.com/en-us/ans

    1 person found this answer helpful.

0 additional answers

Sort by: Most helpful

Your answer

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