size - Sencha 触摸 : How to set floating panel size for different device?

Question

我是 Sencha Touch 的新手(有 ExtJS 经验)。在我的应用程序中，我需要创建一些 float 面板作为模式对话框。现在，我真的很困惑如何设置这些将根据设备适当调整大小的 float 面板的大小。

我是否需要获取浏览器的高度/宽度并适本地设置大小，或者我是否需要提供一些百分比大小？

有什么帮助吗？

Answer 1

要动态控制面板的宽度，您可以在面板中使用“宽度”参数。

您可以在这个宽度内强制设置您自己的值，但您也可以制作一个根据视口(viewport)动态设置宽度的函数。

例如模态面板；

    var editPnl = new Ext.Panel({
        floating: true,
        centered: true,
        modal: true,
        draggable: true,
        width: calculateDesiredWidth(),

以及调用以计算适当宽度的函数；

    var calculateDesiredWidth = function() {
        var viewWidth = Ext.Element.getViewportWidth(),
            desiredWidth = Math.min(viewWidth, 400) - 10;

        return desiredWidth;
    };

如果我误解了你的问题，请指出。