0

我是煎茶触摸的新手。

对于我的移动网站，我面临 UI 元素渲染相互重叠的问题，当我刷新或拉伸窗口时，UI 元素的渲染会按需要出现。

所以，我正在尝试使用 doLayout 刷新面板，但无法做到。可能是我没有在正确的地方使用 doLayout() 。

这是我的代码。

var app=new Ext.Application({
    name:'entwoven',
    useLoadMask:true,
    launch:function()
    {

    Ext.setup({tabletStartupScreen:'tablet_startup.png',
        icon:'icon.png',
        glossOnIcon:true,
        onReady:function(){


     var loginScreen = Ext.getCmp('loginPanel').items.items[0];
     loginScreen.doLayout();



    entwoven.views.loginToolbar = new Ext.Toolbar({
    id:'loginToolbar',
    title: 'Login',
    dock :'top'
    });

    entwoven.views.imgPanel = new Ext.Panel({
        id: 'imgPanel',
        html : '<div class="volkwagen"><center></center></div>'

    });

    entwoven.views.formPanel = new Ext.form.FormPanel({
        id : 'formPanel',
        items: [{

            xtype : 'textfield',
            id: 'userId',
            name: 'name',
            placeHolder: 'UserId'
        },
        {
            xtype: 'passwordfield',
            id: 'passwordfield',
            name : 'password',
            placeHolder: 'Password'
        }

    ]
    });

    entwoven.views.storebtnPanel = new Ext.Panel({
        id: 'storebtnPanel',
        layout: 'hbox',
        items :[{
            xtype : 'button',
            cls : 'storebtnAction',
            activeCls : 'activeStore',
            id: 'storebtn'
            },{html : 'Store',
                id: 'storetext'}]
    });

    entwoven.views.btnPanel = new Ext.Panel({
        id: 'btnPanel',
        items:[{
            xtype : 'button',
            cls : 'btnAction',
            id: 'loginbtn',
            activeCls : 'activeLogin',
            name: 'loginButton',


        }]
    });


    entwoven.views.loginPanel = new Ext.Panel({
        id:'loginPanel',
        fullscreen:true,
        cls: 'panelBackground',
        dockedItems: entwoven.views.loginToolbar,
        items : [entwoven.views.imgPanel,entwoven.views.formPanel,entwoven.views.storebtnPanel,entwoven.views.btnPanel]

        });

entwoven.views.viewport = new Ext.Panel({
    layout: 'card',
    fullscreen: 'true',
    cardAnimation: 'slide',
    cls: 'com', 
         items: [entwoven.views.loginPanel]
    });
}
});


}
});

在控制台上，我收到错误消息"Uncaught TypeError: Cannot read property 'items' of undefined"。

请帮助了解如何刷新或“更新”上述面板，以便我可以正确呈现 UI 元素。

谢谢，

4

1 回答 1

2

首先，您需要将此代码移动到 onReady 事件的底部：

 var loginScreen = Ext.getCmp('loginPanel').items.items[0];
 loginScreen.doLayout();

原因是，您尚未定义 loginPanel 组件，因此您对它的引用将为空。将其移至底部，或者更具体地说，在 loginPanel 定义之后将解决项目未定义错误。

请更明确地说明 UI 渲染问题：

  • 你的目标是什么分辨率？
  • 哪些组件没有正确渲染？
于 2012-05-21T16:06:20.583 回答