sencha-touch - 如何在 Sencha Touch 的列表中将空文本居中在屏幕中间？

Question

我最近发现 Sencha Touch 中列表的 emptyText 配置值可以在商店为空时显示。我遇到的问题是此文本出现在左上角，我似乎无法找到将其放置在屏幕中间的方法。

Answer 1

emptyText 属性接受 HTML。例子:

CSS: 
.emptyText {
    text-align:center;
    color: #999;
}


JS:
emptyText: '<div class="emptyText">No members yet</div>'

对于垂直居中，您必须使用 CSS3 弹性盒模型

示例 CSS:

//vertical and horizontal centering based on fixed height
    height:200px;  
    display:-webkit-box;
    -webkit-box-orient: horizontal;        
    -webkit-box-align:center;
    -webkit-box-pack:center;