I have a form in a Right To Left html page and I have a WebView that shows it. Html input fields of my page can't get focus when I tap exactly on them but when I try tapping somewhere beside of correct area, it becomes focused.
My issue occurs just when the phone is in portrait mode, while I don't face it in landscape mode.
Here are screenshots of aforementioned issue:
Any help will be appreciated.
The problem caused by adding dir attribute with rtl value to html or body tag.
Your html or body should not have this:
dir="rtl"
According to the W3C spec, http://www.w3.org/TR/html401/struct/dirlang.html the dir attribute can be added to the html element, so I'm not sure that's it
To set the base text direction for an entire document, set the dir attribute on the HTML element.
I am also seeing some odd issues with the RTL behavior with Android browsers (it works fine on a desktop).
Related
Suppose Html body is having below content
qwweeerrt
asssdfghjjkl
zxxcvbnmm
It is shown like below :
qwweeerrtasssdfghjjklzxxcvbnmm
when I used
webView.loadData()
and
qwweeerrt asssdfghjjkl zxxcvbnmm when I used
webView.loadDataWithBaseURL()
So empty lines between qwweeerrt , asssdfghjjkl and zxxcvbnmm are missing in webview.
Please suggest me how to show the content as it is.
HTML (not the WebView itself) hates blanks.
Please use the <br/> tag to add a carriage return.
Double it, for an empty line.
If you want to add some blank spaces, use for each space you want.
Or, as an alternative, include your text in a
<pre>
Your multiline text here
Second line
Third line
</pre>
structure.
The WebView only renders the HTML (but also CSS and JavaScript).
And it does a great job.
I recommend you to study some HTML, if you plan to use a WebView in your app.
A great (and historically proven to be accurate) learning source is found here.
Your 'content' has to be more formatted. Proper way to show it would be like.
<p>qwweeerrt</p>
<p>asssdfghjjkl</p>
<p>zxxcvbnmm</p>
See what the webView.loadData() shows now.
I have a web page with about 150 HTML <a name="blah"></a> elements, plus 26 more that group these by letter, like <a name="lettera"></a>.
The page passes W3C HTML validation and renders and operates correctly in desktop browsers. Trying two different Android browsers and an emulator, the letter index does not work. When any letter is selected, the page only moves to the lettera tag. The location bar correctly shows <site>page.htm#letterx as the current location, but the display has not moved.
Other pages on the same site with a smaller number of name tags work correctly. I found one web reference saying that some browsers did not like to see two name tags in a row and suggesting placing the nonsense tag in between them to break them up, but this did not help. Any suggestions?
Answering my own question in case it helps someone else someday, it appears there needs to be actual renderable content between two successive name tags for the android browser (a comment alone didn't do it). When I added some all worked as intended.
I'm rendering a html page(html page is constructed using JQuery, text with html tags, used a canvas in it) to Activity with web-view & to default browser comes with device. When I long press on text in html page I'm getting dark grey colored boxes on it.This is unexpected & weird behavior of web-view.Please see attached images for my problem
I searched for such issue but not getting any solution for it.Same html page is tested on Mozilla app but not getting such square boxes, also on ACER tab running HoneyComb its working fine no such weird square boxes.How to get rid of such boxes?. I using Samsung Tab2 10.1 with android version 4.0.4. Please help me to solve this issue.
I don't know what you code for it?
But you can validate the page on http://validator.w3.org/
There may be problem with your html like any tag open but not closed, etc.
So once you validate it, then test it again.
I'm working on a mobile web app. The issue is apparent in some Android's (I think only 2.3.x phones).
There is a label and an input submit button on a page. Both are styled to have the same font face (TradeGothic, created by a #font-face style).
The label text always renders correctly however the button text never shows up the first time the page is visited.
So if you go to the page and either click on the button or go back and then forward (to the page in question) then the button text shows up fine.
I've tried resetting the value of the input button using jquery. I've also tried setting it's html and text however there are no changes.
What else can I try? (Besides losing the font.)
Slightly hacky option, could you not use an image for the button which is using the desired font?
I fixed the issue by loading a dummy html page in the webview (in the background) while the app is starting up.
The dummy page consists of only the html for the button and it loads the same css file.
Normally when a native textfield in an android view is focused, the view scrolls automatically to keep the field visible when the virtual keyboard appears. And it's normally the same behaviour when I select a textfield in a webview (so I mean a html text input in the page that loaded in the webview).
But for some reason, it doesn't work in my case. I have a webview that displays a form and when a select a textfield, the view scrolls down to the bottom of the page and the field I selected is no longer visible. What should I check in my app to prevent this to happen? If you need more details, just ask. In this way I can show you directly what you need.
Thanks in advance.
EDIT: on android 4, this is not happening. I encountered the problem on android 2.2 and 2.3.
android:windowSoftInputMode="adjustResize"
Add above tag in your manifest file's activity tag. The activity will be the one which displays webview