Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Feb 2011
    Posts
    3
    Vote Rating
    0
    popnroll is on a distinguished road

      0  

    Default [OPEN-760] IPhone 4 status bar hides top of app

    [OPEN-760] IPhone 4 status bar hides top of app


    Sencha Touch version tested:
    • 1.01
    • only default sencha-touch-debug.css
    Platform tested against:
    • iOS 4
    • Android 2.2
    Description:
    • When running the application on the IPhone 4 as a stand alone app (added to homescreen), the status bar covers the top of the application.
    Test Case:
    Code:
         <!DOCTYPE HTML>
    <html>
    <head>
        <script type="text/javascript" src="lib/sencha-touch/sencha-touch-debug.js"></script>
        <script>
            var startPanel = new Ext.Panel({
                fullscreen: true,
                layout: 'vbox',
                items:[
                    {html:"test"},
                    {html:"test2"},
                ]
            });
            Ext.setup({
                    onReady: function(){
                        rootPanel = new Ext.Panel({
                                fullscreen:true,
                                layout: 'card',
                                items:[
                                    startPanel
                               ]
                        });
                    }
            });
        </script>
        <link rel="stylesheet" href="lib/sencha-touch/sencha-touch-debug.css">
    </head>
    <body>
    </body>
    </html>
    Steps to reproduce the problem:
    • Visit the application url
    • Add the application to your homescreen
    The result that was expected:
    • The application shows two rows with text: "test" and "test2"
    The result that occurs instead:
    • Only test2 is visible, test is behind the status bar
    Screenshot or Video:
    • attached
    Debugging already done:
    • Tested on android, which works. Tested changing margin on the x-fullscreen element, which fixes the issue
    Possible fix:
    • A workaround is to add .x-fullscreen{margin-top:20px}
    • Could this be related to a change in where the content area below the status bar starts? I read somewhere that if you leave the statusbar as default or set it to black, the content should start below it. If you however set it to black-translucent, it should start at the same vertical position as the status bar.
    Attached Images

Similar Threads

  1. [OPEN-678] YESNOCANCEL Issues on iPhone 3G
    By planewryter in forum Sencha Touch 1.x: Bugs
    Replies: 1
    Last Post: 12 Oct 2011, 1:18 AM
  2. [OPEN-737] Bug height init on iPhone
    By mavigex in forum Sencha Touch 1.x: Bugs
    Replies: 1
    Last Post: 24 Jan 2011, 2:29 AM
  3. Replies: 4
    Last Post: 3 Dec 2010, 5:43 AM
  4. App does not reposition after keyboard hides on iPhone 4.1, works on Android
    By gcallaghan in forum Sencha Touch 1.x: Discussion
    Replies: 14
    Last Post: 30 Nov 2010, 4:49 AM