My app uses both TextViews and WebViews. In both I set the size of text in pt. The problem is that the text in WebView is usually half the size as the text in TextView. I have tested on multiple screen sizes and desnsities but it makes no difference.
I set TextView height using:
textView.setTextSize( TypedValue.COMPLEX_UNIT_PT, 14 );
But in WebView I use CSS:
font: 14pt;
Both work, but it seems like TextView's display is bigger than WebView's. Any clue what is going on? I want to display the text in TextView as the same size as in my WebView.
Related
I have a webpage where the font-size of body 16px.
On Google Chrome for Android, I have the following problem: When the page initially loads, the font size in elements which don't have a font-size defined (and therefore inherit the font-size from the body) is bigger than 16px (as you will see if you read on, there is no obvious way to calculate the multiple to which the size of the rendered text is bigger). When the user scrolls down the rendered text size changes to 16px.
See the two images below for a visualisation
In the above screenshot the page has loaded and the user has not interacted with the page.
In the above screenshot the page has loaded and the user has interacted with the page. Notice how the font size on the element showing "0% interest" is now smaller
When the text is larger and smaller - both sizes compute as 16px
Despite the fact that there is a visual difference between the two font-sizes. Before the user scrolls and the text is larger and after the user scrolls and the text size is smaller — the font-size in all cases computes as 16px.
In the above image we can see that the font-size is in both cases 16px but that the two rendered texts are clearly different in size
What happens if the size is changed?
If I change the of the text, the rendered text size increases or decreases (depending on whether or not the number is greater or less than 16). In both cases though the text size increases in proportion to the original text size.
It seems like the browser is showing 16px as a certain size and that it then changes this size when the user scrolls.
Here I've increased the font-size to 20px. Whilst the font size does increase, it increases in proportion to the original rendered text size
Could Javascript be responsible this?
I don't think so. I have disabled javascript in the browser and reloaded the page and the problem still persists.
Does anyone have an idea about what might be causing this?
There are two solutions around:
As described here Chrome on android resizes font the issue occurs if any text reach a certain length.
Add "max-height: 999999px;" to the element which is surrounding the text.
<meta name="viewport" content="width=device-width, initial-scale=1">
For me solution no 1 worked.
There is so-called font size "adjusting". Try to disable it:
text-size-adjust: none;
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
-ms-text-size-adjust: none;
See details: https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust
I have HTML text as that
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>I am normal</p>
<p><b>This text is bold</b></p>
<p><i>This text is italic</i></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
and it should appear like that
This is a heading
This is a paragraph.
I am normal
This text is bold
This text is italic
This is subscript and superscript
How can I split the whole text into screens Based on screen width and height and with the HTML style?
I tried this answer
How to break styled text into pages in Android?
but the HTML style not saved
Is there any library or code can do this?
Full HTML can be rendered just in WebViews, to have screen-related text dimensions you can use a custom styled TextView nested in a layout like RelativeLayout, referencing views width and height in dimens.xml (so you can adopt different paddings and dimensions for small and large devices)
I have a design guide of 1080 * 1920.
There are several texts on the guide which should be shown as textViews.
On this case, how should I define the textSize of each texts?
If a text's height is 40px, it would be 13.3dp in xxhdpi.
But, when I make the textSize as 13.3dp, it looks rather smaller.
When trying to show numbers or english characters, it becomes even smaller.
What tactics should I need to make the view as similar as the design guide?
I have TextView which contain text "3D Android Graphics". I want to stretch the text so that it should always fit to screen width of any device provided. Means its text size should be changed according screen size and it should always occupied entire screen width. What should i use to get it done?
I'm using webView to display HTML content.
The text size is readable for tablets. However on small smartphones, the text appears as dots. The user has to pinch-zoom to read it.
Is there any way to set a fixed size which will be readable on both tablets and smartphones?
WebSettings ws= webView.getSettings();
setTextSize:
ws.setTextSize(ws.TextSize.NORMAL);
Enum for specifying the text size.
SMALLEST is 50%,
SMALLER is 75%,
NORMAL is 100%,
LARGER is 150%,
LARGEST is 200%,
Or use this one
ws.setDefaultFontSize(12);