Android WebView web page does not fit the whole screen???? - android

Okay I have a webView which loads a web page. The web view fits the screen at first for like 2 seconds after it starts loading but then suddenly the text no longer wraps. But when I zoom in and then zoom back out it wraps again and stays that way. I want it to do that automatically. I have tried to fix this issue with setInitialScale() and setUseWidePort(true) both have failed to solve the issue. Surprisingly the same website works fine on the phone browser no problem.Any help would be appreciated, Thanks in advance.

Did you try setInitialScale(1)? What number did you put in the parameter?
You could also try to set the width to 0dp, and then make the layout_weight="1" (if this is in a linearlayout)

Related

WebView cut off

I have a WebView that is supposed to show what my webcam films.
When I go to my webcam from my mobile's browser it works fine, but when I try to do it from my application it looks like this:
http://i.imgur.com/muOHSrh.jpg
For some reason it zooms in, and the part of the screen thats "outside" is unreachable, even when trying to drag, scroll or zoom out (as can be seen in the picture, I'm trying to drag the screen to the right).
What I was able to find regarding my problem was this: Android - webview cuts off
I've tried the solutions there, but to no avail.
Would appreciate some help. Thanks!
Managed to find an answer.
x.getSettings().setLoadWithOverviewMode(true);
x.getSettings().setUseWideViewPort(true);
(When x is my WebView)
Fitting webpage contents inside a webview (Android)

CSS3 sliding image on hover, strange spacing

First, hello to everyone, I'm kinda new here, altough this site has helped me with lots of stuff.
Here's my problem, I've made images in 's with text behind them, so that when you hover with your pointer over it, the image slides to the side and you can read the text. Pretty simple. Now the problem that I'm having is that when I lower the screen size(eg view it on an Android), the responsive design kinda doesn't work for those images because there's some weird spacing to the left, even though the image can fit on that screen size.
Here's the site with the problem (I use it for learning purposes :)): This
your responsive works fine (bootstrap I guess). The problem is you have a fixed width in your .slide1, .slide2, .slide3 that is messing the 33.3333% width of your col-sm-4 . Basically you need to use mediaqueries to adapt your animation.
adding overflow:hidden to col-sm-4 will show you better what is happening, and adding to your slides max-width:100% may be the first steps to fix your web. Later your problem will be the image size

How to get WebView to wrap an image exactly

I am using a WebView to display some maps in my app using the Google Static Maps API. However, when I load a map into my WebView, it's always either zoomed out too far (showing a massive amount of white space around the map) or too close (showing only part of the map). Given that I'm requesting a map of the same size as the size of my WebView, I should be able to "tightly" wrap with no issues, but I'm not sure how to achieve that.
I've tried just running at the default settings, and that results in the map being zoomed in too far (and scrollbars being displayed). I've also tried this:
mapView.getSettings().setLoadWithOverviewMode(true);
mapView.getSettings().setUseWideViewPort(true);
which just results in the page being fully zoomed out. Are there other alternatives I'm missing other than futzing around with the scale?
I had similar problem with the whitespace. What I did was to go into the CSS file for the WebView and edited the margin/padding on the image I was displaying to be negative (I just edited until I was happy) so it would display completely in the upper left corner.
Then I set the height and width of the webView in my Android XML file until I was happy with the result. However I was having a bit of a problem with the width showing some white space on some devices but the height was good once I had found the right value.
My solution to this was to try to set the width as the same as the height in the java.class file for the activity but I was not successful, maybe you will have more luck.
In the end I abandoned the webView for my project so I can't really give you any working code.

Android webview links misaligned using sprite images

I have a very weird problem that is not consistent. I have a header in my webview page that is regular html from my site. The images are linked to pages. Sometimes the links don't work and sometimes they do. If I move my finger below the image, sometimes you see the rectangular highlight press color box show up but way off from the actual image. It will just be in a random spot but always below the image somewhere. So the link href and the image are getting out of sync per say. If I reload the page it will be in the correct position again and the image/button works. It doesn't always happen. Works fine in desktop and mobile browsers. Just weird in webview. Anyway, have a suggestion or experience this and why its so random?
Use it like this
String s="<head><meta name=viewport content=target-densitydpi=medium-dpi, width=device-width/></head>";
webview.loadDataWithBaseURL(null,s+htmlContent,"text/html" , "utf-8",null);
For more reference
http://developer.android.com/guide/webapps/targeting.html
And in Samsung s3 like phones, sometimes this will not work .For that create a separate layout for xhdpi phones and change the webview's height to 40dp or something depending on your requirement for avoiding white space.
The problem wasn't with just webview it is mobile in general, specifically Android Browser which I believe webview uses. My header was position:fixed and after a lot of research I found that position:fixed is glitchy on mobile and causes weird things to happen. This was causing the clickable location of the links getting out of place when you scrolled even though the images never moved. So when you clicked on the image/link it didn't work because the location of the link was somewhere else on the page, usually under the image somewhere.
As noted on this blog solution which described my issue.
http://suratpyari.wordpress.com/2011/09/30/fixed-position-problem-with-android-webkit/
However the solution I went with was not to use position:fixed at all as I didn't want css hacks and to use the solution used at the SO link below using position:absolute to make the inner div scrollable. It actually works quite well and the scrolling is even more smooth and fluid now.
CSS 100% Height, and then Scroll DIV not page
So anyone else that may have this problem, it might be your fixed header. And it is "real" problem for the person who down voted my question. :/

Measuring a view before rendering it and get a remained space (Android)

I'm trying to solve this problem in ages but i can't find a solution:
I need to know how much height a webview with some HTML text in it will take in a LinearLayout, if the space occupied doesen't go over screen size i must add another webview with other HTML text in it. I can't figure out how to do it, i tried to call
measure() but it will give me 0 whatever measurespec i try to use.
Someone knows how to do it?
Thanks in advance.

Categories

Resources