0

I want exactly the answer marked as useful here says to work. But Eclipse editor cross out the word LayoutAlgorithm because it is deprecated and I cannot install the application in emulator. Before that, I've tried to use style tag in the html document (in assets folder) to resize image in relation to window size and works perfectly in Chrome but not in webview. This is the style:

<style>
 * {
 padding: 0;
 margin: 0;
}
.fit { /* set relative picture size */
max-width: 100%;
max-height: 100%;
}
.center {
display: block;
margin: auto;
}
</style>

When testing in emulator, the pictures only resizes in relation to the width screen in portrait view, if I rotate the emulator, there's no resizing. Any help? :-/

Community
  • 1
  • 1
JoeCoolman
  • 512
  • 3
  • 8
  • 27

2 Answers2

0

Sounds like it could be the viewport. Devices render things differently unless you explicitly tell them otherwise. Some Android devices will show a website as it would appear on a desktop, but you can force it to scale to the device with the following meta tag.

<meta name="viewport" content="width=device-width, initial-scale=1", maximum-scale=1>

I'm not sure it's exactly what you're looking for, but I hope it helps. :)

JakeSidSmith
  • 819
  • 6
  • 12
  • ok, I didn't tried that yet but it seems to work for iOS devices but I am developing for Android devices. Ok I will try and see. Some guy [here](http://webdesign.tutsplus.com/articles/quick-tip-dont-forget-the-viewport-meta-tag--webdesign-5972) said it went ok. – JoeCoolman May 26 '14 at 05:56
  • It works fine. I've used for Android before and tested on multiple devices. :) Let me know how it goes for you. – JakeSidSmith May 26 '14 at 13:10
  • maybe I didn't use your help properly because it didn't work but I found a solution. It was just to comment the max-height in the code above, so the pictures will only fit the screen's width up to its maximum allowed by image properties. There's no distortion, aspect ratio is ok. It means that if device is in landscape or portrait position, the horizontal scroll bar is never seen. My intention is the app be comfortable to navigate in the view just using the thumb to move up and down. Anyway, thanks for your interest in this question Jake. – JoeCoolman May 27 '14 at 16:34
0

To fit the image to the screen width, just comment 

max-height: 100%;

To fit the image to the screen height, just comment

max-width: 100%;

That's all, there's no need to touch the android java code, just add the code above to your html document.

JoeCoolman
  • 512
  • 3
  • 8
  • 27