4 Replies Latest reply on Sep 27, 2017 4:58 AM by brian704

    Application screen size changes

    brian704 Level 3

      I will start by saying I'm very new to both PhoneGap and html programming.  I'm trying to create a very simple test app to send out to our employees. I created a few links to some web sites our employees access often- just to get a feel for the app. I used the "Hello world" app as a base.

      When I view the app using the mobile version of PhoneGap it looks as I would expect:

      Screenshot_PG_sm.png

      However - after I compile thru PG Builder into an app and run that here is what I see:

      Screenshot_Compiled_sm.png

      Any idea what happened?

        • 1. Re: Application screen size changes
          ralphs26798824 Level 1

          Hey Brian704,

           

          What are your current viewport setting (in Index.html in the <head>)?

           

          It should be something like;

           

          <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, target-densitydpi=medium-dpi, user-scalable=0" />
          

           

          Otherwise a snippet of your HTML might be useful.

           

          Cheers,

          • 2. Re: Application screen size changes
            brian704 Level 3

            Similar code:

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

            This was a part of the code generated by the phonegap hello world app.

            I tried setting scalable to yes, but that didn't seem to do anything. I tried changing initial scale, but that didn't  seem to do anything either - as I said - I'm very new to all this

            • 3. Re: Application screen size changes
              ralphs26798824 Level 1

              Hi again,

               

              Setting user-scalable to true will allow the user to pinch and zoom inside your app, which is not usually not what you want (broadly speaking).

               

              Have you tried to copy that entire viewport line in? I've had mixed results in the past with / without that target-density part on Android.

               

              Otherwise it could be related to a number of things. Would need to see your Config and HTML.

               

              If your new to this, Phonegap has a nice write up on each part of the app which you may have already seen;

              Hello World Explained | PhoneGap Docs

               

              Cheers,

              • 4. Re: Application screen size changes
                brian704 Level 3

                I think I have solved the issue by setting some breakpoints. Also set the app to Portrait for the time being just for testing - I'll worry about that later