Community
cancel
Showing results for 
Search instead for 
Did you mean: 
Matteo_P_
Beginner
178 Views

inappbrowser zooming Android ok Apple

Intel XDK 3759 Hello, first of all because of the work you are doing with XDK I really solved many problems.

I published last week an App with the plugin inappbrowser on Iphone and Android with the simulator so good.
But after publishing the store unfortunately I realized that with Android viewing on your web page is tremendous everything is small and to the left, for leggre is the page you have to zoom with your fingers.
Am I wrong or is just the plugin function that fails its task?

I tried both on the net and in the faq but can not find the solution seems that it happened just me, or do not write the right words when I try.

I decided to write to you.
Maybe you know why this happens? Thanks hope to hear from you soon.
Matthew

Tags (2)
0 Kudos
10 Replies
PaulF_IntelCorp
Employee
178 Views

Usually this sort of problem is determined by the lack of or incorrect specification of the meta viewport tag. For example, taken from the hello-cordova sample app:

    <!-- see http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-ta... -->
    <!-- <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1"> -->
    <!-- <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=no"> -->
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes, minimum-scale=1, maximum-scale=2">

And a more typical non-scaling tag, from another sample:

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

Also, the Simulate tab does not simulate a real device. You should ALWAYS test on a real device before submitting to the store. See > https://software.intel.com/en-us/xdk/docs/intel-xdk-simulator-limitations < for more details.

Matteo_P_
Beginner
178 Views

Thanks for the answer, I'm sorry for the ignorance, in which file and folder must make these changes?
Thank you very much
PaulF_IntelCorp
Employee
178 Views

Matteo -- please look at the index.html file in most of the samples. In particular, check the "hello cordova" sample and see the reference I provided in the first code block.

Matteo_P_
Beginner
178 Views

Excuse me but I tried this

<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes, minimum-scale=1, maximum-scale=2">

and this

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

It did not work

 

PaulF_IntelCorp
Employee
178 Views

What does the call to inAppBrowser that you are using look like?

Matteo_P_
Beginner
178 Views

I did not understand the question,
try to respond in the index button code

<p align="center">
    <div class="button-grouped flex widget uib_w_3 d-margins" data-uib="app_framework/button_group" data-ver="1">
        <a class="button widget uib_w_5 color2" data-uib="app_framework/button" data-ver="1" id="button2">
            <h3>Titolo</h3>
        </a>
    </div>
</p>
Matteo_P_
Beginner
178 Views

Hello and thank you to assist me.
I saw that even with the demo

sample-in-app-browser-master.zip

file if you land on a responsive page all right, altrimente for example I added a page with iframe within the sample files.

http://www.html.it/guide/esempi/guida_html/frames/iframe/indice.html

iphone tightening of the width which shows the sample page potri put my things to work on Android and everything is small and you have to zoom with your fingers.

And this is not possible . I'm going out of your mind !!

PaulF_IntelCorp
Employee
178 Views

Matteo -- I recommend that you do not use App Designer for such an app, you need to write this without the aid of App Designer, directly in HTML5. That way you'll have more control over the results. App Designer is not meant for encapsulating web site pages.

Matteo_P_
Beginner
178 Views

I understand, however, on apple iphone works perfectly.

PaulF_IntelCorp
Employee
178 Views

Please read this blog > https://blogs.intel.com/evangelists/2014/09/02/html5-web-app-webview-app/ < especially the section titled "Defining the WebView App." Also, if you are testing on an Android 4.x device, make sure you've selected "optimize with Crosswalk" in the Build Settings.

Reply