Entry / Input field got hidden behind keyboard in SfTabview

Hi, 

I'm having issue with the Xamarin forms Entry input being hidden behind OS Keyboards on both Android and iOS platform. 

On Android:
✅ Tab 1 Entry on tapping will trigger keyboard and push the Entry to appear above the keyboard.
❌ Tab 2 Entry on tapping will trigger keyboard but it didn't push the Entry to appear above the keyboard causing it's not visible and hard for input to proceed.


On iOS:
  Both Tab 1 and Tab 2 Entry on tapping will trigger keyboard to appear on top of the entry.


 This situation only happens if the Entry is inside the SfTabView. 
I'm using the SfTabView version 19.4.0.53 


I've attached the Video recording and the source code as per reference to fasten up debugging process :) 


Hope to hear from you soon.


Thanks, 
Jun.


Attachment: KeyboardBug_26dfd755.zip

5 Replies 1 reply marked as answer

SS Suganya Sethuraman Syncfusion Team February 23, 2022 11:04 AM UTC

Hi Jun,

Query 1: “Entry input being hidden behind OS Keyboards in Android”

Please use the following code in the MainActivity class of Android project after the LoadApplication to resolve the issue.

Code snippet 
 
protected override void OnCreate(Bundle savedInstanceState)  
        {  
            base.OnCreate(savedInstanceState);  
  
            AndroidEnvironment.UnhandledExceptionRaiser += AndroidEnvironment_UnhandledExceptionRaiser;  
            TaskScheduler.UnobservedTaskException += TaskScheduler_UnobservedTaskException;  
            AndroidEnvironment.UnhandledExceptionRaiser += AndroidEnvironment_UnhandledExceptionRaiser;  
  
  
            Xamarin.Essentials.Platform.Init(this, savedInstanceState);  
            global::Xamarin.Forms.Forms.Init(this, savedInstanceState);  
  
            var app = new App();  
            LoadApplication(app);  
            Window.SetSoftInputMode(Android.Views.SoftInput.AdjustResize);  
        }  


Query 2: “Entry input being hidden behind OS Keyboards in iOS”

To resolve the reported issue in iOS, please use ScrollView as shown in the following code snippet,

 
Code snippet  
                <tabView:SfTabItem> 
                    <tabView:SfTabItem.Content> 
                        <Grid 
                            BackgroundColor="Blue" 
                            HorizontalOptions="CenterAndExpand" 
                            VerticalOptions="CenterAndExpand"> 
                            <ScrollView> 
                            <StackLayout VerticalOptions="Center"> 
                                <Label 
                                    FontSize="24" 
                                    Text="Tab 2" 
                                    TextColor="White" /> 
                                <Label Text="Entry Input:" TextColor="White" /> 
                                <Entry 
                                    BackgroundColor="White" 
                                    FontSize="18" 
                                    HorizontalTextAlignment="Center" 
                                    VerticalOptions="Center" /> 
                            </StackLayout> 
                            </ScrollView> 
                        </Grid> 
                    </tabView:SfTabItem.Content> 


Please have a sample from the below link,

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/TabViewEntry192901924

Please check and let us know if you have any concerns.

Regards,
Suganya Sethuraman.
 


Marked as answer

SS Suganya Sethuraman Syncfusion Team February 24, 2022 05:23 AM UTC

Hi Jun,

Thanks for the update.

We are glad that your issue is resolved. Please let us know if you require any further assistance.

Regards,
Suganya Sethuraman.
 



JU Jun February 24, 2022 08:44 AM UTC

Hi Suganya Sethuraman,


The solution stated in post above do solve the keyboard issue on both Android and iOS.

Thanks for the assistance! 



Thanks,

Jun.



JU Jun March 2, 2022 01:13 PM UTC

Hi Suganya Sethuraman,


Is there any possibility to apply the following code
 Window.SetSoftInputMode(Android.Views.SoftInput.AdjustResize);  

on the specific page only? 
Because it do affect some output.


Thanks, 
Jun.



SS Suganya Sethuraman Syncfusion Team March 3, 2022 12:35 PM UTC

Hi Jun,

Query: Is there any possibility to apply the code “Window.SetSoftInputMode(Android.Views.SoftInput.AdjustResize);  “ on the specific page only?

We have achieved your requirement by including the code "Window.SetSoftInputMode(Android.Views.SoftInput.AdjustResize);" in the OnAppearing override method of the MainPage.cs file, as shown in the code snippet below.

Code snippet
 
protected override void OnAppearing() 
        { 
            base.OnAppearing(); 
            App.Current.On<Xamarin.Forms.PlatformConfiguration.Android>().UseWindowSoftInputModeAdjust(WindowSoftInputModeAdjust.Resize); 
        } 
 
        protected override void OnDisappearing() 
        { 
            base.OnDisappearing(); 
            App.Current.On<Xamarin.Forms.PlatformConfiguration.Android>().UseWindowSoftInputModeAdjust(WindowSoftInputModeAdjust.Pan); 
        } 


Please have the modified sample for your reference.

Sample:
https://www.syncfusion.com/downloads/support/directtrac/general/ze/SfTabViewSampleModified-222165257

Please check and let us know if you have any concerns.

Regards,
Suganya Sethuraman.



 


Loader.
Up arrow icon