Question

我的手风琴布局右侧有折叠按钮（这是默认行为）。如何将折叠按钮位置更改为左？

Ext.create('Ext.panel.Panel', {
    title: 'Accordion Layout',
    layout: {
        // layout-specific configs go here
        type: 'accordion',
        titleCollapse: false,
        animate: true,
        activeOnTop: true
    },
    items: [{
        title: 'Panel 1',
        html: 'Panel content!',
    },{
        title: 'Panel 2',
        html: 'Panel content!'
    },{
        title: 'Panel 3',
        html: 'Panel content!'
    }],
    renderTo: Ext.getBody()
});

Please help me out.

Your help is appreciated!! Thanks in advance.

Answer 1

如果您使用的是ExtJS 4.2，请设置

titlePosition：1

在标头配置中

在accordion展开/折叠图标旁边制作标题。

文档链接

http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.panel.Header-cfg-titlePosition

header:{
  titlePosition:1
}

这对我来说很好......：）

Answer 2

我发现如何做到这一点的唯一方法是覆盖默认的css：

在手风琴标题上：

 .x-accordion-hd .x-panel-header-text-container {
       right: 0 !important;
       left: auto !important;
 }

在手风琴切换按钮上：

.x-panel-header-default-horizontal .x-tool-after-title {
     left: 0 !important;
     right: auto !important;
}

希望它有所帮助！

Extjs Accordion Header - 将折叠按钮移动到标题标题的左侧

2 个答案: