sencha-touch - 如何在 sencha touch 的工具栏中添加简单的文本

Question

嗨，我需要在工具栏中添加一个简单的文本，文本应该在工具栏中声明的两个按钮之间，知道怎么做吗？请让我知道，谢谢

Answer 1

您可以使用以下两个选项：

如果您只想在工具栏的中心显示文本，请使用 title 属性：

{
    title: 'Some text here',
    items [/* Your buttons */]
}

如果你想要多个文本元素，一个快速而肮脏的方法是使用带有 html 属性集的面板，它将用 html 替换创建的面板的内容：

{
    items [{
        // Button 1
    },{
        xtype: 'panel',
        html: 'The text you want here'
    },{
        // Button 2
    }]
}

如果您这样做，面板可能无法很好地设置样式，因此您可能必须对面板的style或baseCls属性应用一些样式才能按照您的需要重新设置样式。

请注意，在 ExtJS 中，您可以只在项目列表中包含文本，它会执行您想要的操作，但文档并没有说明这是否适用于 Sencha Touch，我现在无法测试。如果这确实有效，它看起来像这样：

{
    title: 'Some text here',
    items [items [{
        // Button 1
    },
    'Your text here',
    {
        // Button 2
    }]
}

Answer 2

在我看来，最简单的解决方案是使用TitleBar。

Answer 3

这是在工具栏上的两个按钮之间添加简单文本的代码。

{
   xtype: 'toolbar',
   docked: 'top',
   **title: 'text you want to add here'**,
   items:[{
            xtype: 'button',
            ui: 'action',
            text: '1st button'
          },
          {
            xtype: 'button',
            ui: 'action',
            right: '0%',
            text: '2nd button',
          }
        ],

}

希望这会帮助你。谢谢。