1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    35
    Vote Rating
    0
    manoveg is on a distinguished road

      0  

    Default Unanswered: adjusting layout as per screen size

    Unanswered: adjusting layout as per screen size


    Hi,

    I am new to sencha touch. I am working on a web app and when I view in a bigger size android phone items in the layout appear fine but when I view it in iPhone layout is not adjusted as per phone size and items go out of the screen .
    please suggest how to handle this.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,347
    Answers
    3542
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    In initComponent, set the layout property based on your criteria.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    35
    Vote Rating
    0
    manoveg is on a distinguished road

      0  

    Default


    Hi,

    Sorry but I did not understood what I should do. I tried

    Code:
    profiles: {
          phoneBlackberry: function() {
          return Ext.is.Blackberry;
          },
          phoneAndroid: function() {
          return Ext.is.Android;
          },
          phoneApple: function() {
          return Ext.is.iOS;
          },
          desktop: function() {
          return Ext.is.Desktop;
          },
          tabletPortrait: function() {
          return Ext.is.Tablet && Ext.orientation == 'portrait';
          },
          tabletLandscape: function() {
          return Ext.is.Tablet && Ext.orientation == 'landscape';
          }
          }
    but this had no difference. Please advice what should be my criteria . Is it the screen size but then there are so many devices around with different sizes and accordingly what layout property should I set.
    I was expecting with
    Code:
    layout: {
                type: 'vbox',
                align: 'center',
                pack: 'top',
                autoScroll: true,
                 },
    I should get layout centered irrespective of screen size.
    How to handle this. Please advice.

Thread Participants: 1

Tags for this Thread