0

[已解决] 感谢 Vadym - Sencha 有自己的保证金属性，这很有帮助。

我有一个 Ext.dataview.List 宽度：'320px'。我现在需要做的是让这些固定的 320 像素——这个列表——位于任何分辨率的屏幕的中心。

由于名声问题，不能给你看图片，所以我会用另一个词重复它并画一个小草图。

我需要将列表定位在屏幕中央。

I have it like this now - docked at the left side:
_________________________________________
||list item 1              |             |
||list item 2              |             |
||list item 3              |             |
||list item 4              |             |


What I want to accomplish is this - centered in the middle:
_________________________________________
|      |list item 1             |       |
|      |list item 2             |       |
|      |list item 3             |       |
|      |list item 4             |       |

我找到了一个我认为可以完成工作的列表的配置值 - 居中 - 但是当我将此值设置为 true 时，列表完全消失了。

我的代码是这样的：

Ext.define('GeoFun.view.Ukoly', {
    extend: 'Ext.dataview.List',
    xtype: 'ukolylist',
    initialize: function () {
        this.callParent(arguments);
    },
    config: {
        ui: 'round',
        width: '320px',
        //centered: true, -- doesn't work  
        itemTpl:  Ext.create(
            'Ext.XTemplate',  
            '<div class="listItemContainer">',
            '    I need this list to be in center of the screen.',
            '</div>')
    
    }
});

提前致谢。

4

2 回答 2

0

我不确定 Sencha 是否有任何属性可以完成这项工作。所以你应该只用css来做。定义下一个 CSS 规则：

.listcontainer {
    margin: 0 auto;
}

或者，至少，使用内联样式

于 2013-07-10T14:21:18.950 回答
0

Sencha 有自己的保证金属性，这很有帮助。

Ext.define('GeoFun.view.Ukoly', {
    extend: 'Ext.dataview.List',
    xtype: 'ukolylist',
    initialize: function () {
        this.callParent(arguments);
    },
    config: {
        ui: 'round',
        width: '320px',

        margin: 0 auto; //<-- solution

        itemTpl:  Ext.create(
            'Ext.XTemplate',  
            '<div class="listItemContainer">',
            '    I need this list to be in center of the screen.',
            '</div>')

    }
});
于 2013-07-16T12:00:30.687 回答