I'm trying to create an editor using Xamarin Forms.
The editor is a webview with content editable and a toolbar below.
The way i'm doing it with the following structure:
Grid with two rows
-->WebView [Row 1]
-->ScrollView with horizontal Scroll [Row 2]
---->Stacklayout (with editor actions)
---------> Pick Photo
---------> Bold
---------> Underline
---------> ...
It works well on Android, when i tap on the buttons, it executes the javascript on the webview,the keyboard remains open and the webview doesn't loose focus.
On iOS the webview looses focus and the keyboard closes.
Like this:
https://drive.google.com/file/d/1gO2AdLUy2VYTVNyhAaypaGGQ2mT6RcJ5/view?usp=sharing
Any idea on how can i solve this ?
Answers
As you mentioned above you placed your controls in your webview, I think this could be an issue of your web page's code.
Can you share a sample of your web page with both h5 and js code?
Then I can test and reproduce it on my side, as it is not a default behavior for iOS if we are using a default UITextView control.
Here's the sample of the editor i'm loading on the webview:
https://drive.google.com/open?id=1OuolyCrTfTPHoI8CO64Wsu1YYX5VQFoh
To reproduce the issue:
@CarlosFerreira I can't reproduce your issue on my side through loading your
Editor.html
. Can you share a sample?@LandLu Thank you for taking the time to try to reproduce my issue.
You need to add a button below the webview.
When clicking the button the keyboard will hide, and that's my issue, i don't it to go away.
This weekend i'll create a sample problem with the issue so you can just do a git pull and run it.
Thanks
Here is the example, just clone and run it:
https://github.com/carlos-ferreira/bug-reports/tree/master/Xamarin/Webview
This the current behavior :

@CarlosFerreira I know what you want to achieve now. Btn for iOS, if you click the button, it means you want to focus on the button. Then the input in your webview will lose the first responder. The keyboard dismisses.
I need some time to find the code about how to force focusing on the webview programmatically. I will update this thread if I find the manner to do that.
Source code is as simple as it gets:
https://us.v-cdn.net/5019960/uploads/editor/0q/4vkwgk9dmiur.png
This is the result, which is what i was aiming for.
https://media.giphy.com/media/Zw4fcT3h1svkxeSMnz/giphy.gif
Just lost a week trying to figure this out.
@SurbhiAroraa Unfortunately i don't have a workaround, i halted my project development as this is a critical functionality of my app.
I created a github issue for this: https://github.com/xamarin/Xamarin.Forms/issues/5175#issuecomment-465022689