0

我在工具栏中使用它：

items: [
                    { text: 'Hem',  },
                    { text: 'Sport' },
                    { text: 'Nöje'  },
                ]

我得到的结果如下图所示：

例子

我得到这种看起来像按钮的样式，我不想要那个。我只希望这些按钮显示为图片 2：

例子

如何？在图 2 中，我有一个来自“选项卡”示例的屏幕截图。我不能创建一个选项卡，因为那样我就不能在按钮之间滚动......我真的很陌生，需要很大的帮助。我的英语不太好，所以请使用简单的语言。干杯!

4

2 回答 2

0

通过为每个按钮添加，您肯定可以使按钮看起来圆润。ui:'round'这是一种解决方案。但我想回答你的这句话。

我无法创建一个选项卡，因为那样我就无法在按钮之间滚动

这不是真的。如果按钮超出您的视口，您绝对可以在按钮之间滚动。我自己在需要 7 个选项卡的移动应用程序中使用它们，而这些选项卡不能在横向和纵向模式下都安装。您需要设置一个属性以使选项卡可滚动。这是对我有用的代码示例。

Ext.create('Ext.TabPanel', {
    fullscreen: true,
    tabBarPosition: 'top',
    tabBar: {
        scrollable: {
            direction: 'horizontal'
        }
    },
    defaults: {
        styleHtmlContent: true
    },

    items: [
        {
            title: 'Monday',
            html: 'Monday Screen'
        },
        {
            title: 'Tuesday',
            html: 'Tuesday Screen'
        },
        {
            title: 'Wednesday',
            html: 'Wednesday Screen'
        },
        {
            title: 'Thursday',           
            html: 'Thursday Screen'
        },
        {
            title: 'Firday',
            html: 'Firday Screen'
        },
        {
            title: 'Saturday',
            html: 'Saturday Screen'
        },
        {
            title: 'Sunday',
            html: 'Sunday Screen'
        }
    ]
});

试一试，因为这绝对有效。:D

于 2012-11-18T17:34:15.003 回答
0

在 Sencha touch 1 和 Sencha touch 2 中，以下代码都会生成圆形按钮：

xtype: 'toolbar',
items : [
            { text: 'Hem', ui :'round' },
            { text: 'Sport', ui :'round' },
            { text: 'Nöje', ui :'round'  },
        ]

即：只需为数组ui : 'round'中的每个项目对象添加键和值。items

于 2012-11-18T09:57:06.867 回答