Sencha touch 2 按钮接触工具栏的边框

当我将按钮停靠在工具栏的右侧时，它开始接触工具栏的上边框，如下所示：

items: [
    {
        xtype: 'button',
        ui: 'back',
        text: 'Back'
    },
    {
        xtype: 'spacer'  
    },
    {
        xtype: 'button',
        ui: 'forward',
        text: 'Continue'
    }
]

 xtype: 'titlebar',
 items: [
      {
         xtype: 'button',
         ui: 'back',
         text: 'Back',
         align: 'left'
      },
      {
         xtype: 'button',
         ui: 'forward',
         text: 'Continue',
         align: 'right'
      }
 ]

这是我的密码：

Ext.define('MyApp.view.MyFormPanel', {
    extend: 'Ext.form.Panel',

    config: {
        items: [
            {
                xtype: 'textfield',
                label: 'Field'
            },
            {
                xtype: 'textfield',
                label: 'Field'
            },
            {
                xtype: 'toolbar',
                docked: 'bottom',
                items: [
                    {
                        xtype: 'button',
                        ui: 'back',
                        text: 'Back'
                    },
                    {
                        xtype: 'button',
                        docked: 'right',
                        ui: 'forward',
                        text: 'Continue'
                    }
                ]
            }
        ]
    }

});

---

这里的行为也一样，当我使用right:10px；而不是停靠在右侧时

这可能是由于元素变为位置：绝对。首先，没有一个解决方案可以防止这种情况发生，但当然，您可以通过设置按钮的顶部：…px来纠正它。

---

如果您有很多这样的按钮，请使用css类来设置它。

同样的行为在这里，当我使用right:10px；而不是停靠在右侧时

这可能是由于元素变为位置：绝对。首先，没有一个解决方案可以防止这种情况发生，但当然，您可以通过设置按钮的顶部：…px来纠正它。
如果有很多这样的按钮，可以使用css类来设置

---

请在

上报告这一点。好的，我不确定是否存在错误，但您可以尝试不同的方法，删除您的

停靠：“right”

，并在两个按钮之间添加

xtype:spacer

，如下所示：

items: [
    {
        xtype: 'button',
        ui: 'back',
        text: 'Back'
    },
    {
        xtype: 'spacer'  
    },
    {
        xtype: 'button',
        ui: 'forward',
        text: 'Continue'
    }
]

 xtype: 'titlebar',
 items: [
      {
         xtype: 'button',
         ui: 'back',
         text: 'Back',
         align: 'left'
      },
      {
         xtype: 'button',
         ui: 'forward',
         text: 'Continue',
         align: 'right'
      }
 ]

外部垫片组件通常用于在项目之间留出空间 在Ext.工具栏组件中

---

您可以在他们的文档中找到更多关于

spacer

的信息和示例。希望有帮助：）

我以前也有同样的问题，但我解决了！您可以像我一样使用

xtype:“toolbar”

来停靠按钮。你必须使用的是

xtype:“标题栏”

现在，如果标题栏中有一些按钮，只需设置

align

属性，如下所示：

items: [
    {
        xtype: 'button',
        ui: 'back',
        text: 'Back'
    },
    {
        xtype: 'spacer'  
    },
    {
        xtype: 'button',
        ui: 'forward',
        text: 'Continue'
    }
]

 xtype: 'titlebar',
 items: [
      {
         xtype: 'button',
         ui: 'back',
         text: 'Back',
         align: 'left'
      },
      {
         xtype: 'button',
         ui: 'forward',
         text: 'Continue',
         align: 'right'
      }
 ]

---

查看Sencha Docs了解更多信息：

你能发布你当前的代码吗？@user1479606我已经在问题中添加了代码。