extjs - 在sencha touch 2中更改方向时更改大小轮播

Question

我将旋转木马放入容器中。

• 在纵向模式下，我将高度设置为 150，图像在轮播中全屏显示。但是当我更改为横向时，图像两侧有两个白色空白。

• 我想通过设置另一个高度值来更改大小轮播。你能帮我解决这个问题吗？

Answer 1

您需要捕捉orientationchange事件（http://docs.sencha.com/touch/2.0.2/#!/api/Ext.viewport.Default-event-orientationchange）并在捕捉它时调用一个函数来调整你的容器。

你可以尝试这样的事情：

Ext.Viewport.on('orientationchange', 'handleOrientationChange', this);

然后在句柄函数中设置您想要的组件大小：

handleOrientationChange: function(){
    Ext.getCmp('idOfMyContainer').setWidth('480px'); //or setHeight() depending on the real problem
}

也可以根据屏幕的实际大小设置宽高，调用这些方法就可以得到。请注意，方向更改不会影响这些的返回值，因此您需要手动切换它：

Ext.Viewport.getWindowWidth();
Ext.Viewport.getWindowHeight()