кнопки extjs в виде панели инструментов - PullRequest
Новая
       25

кнопки extjs в виде панели инструментов

6 голосов
/ 13 октября 2010

Эй, у меня действительно маленький вопрос, но что-то, что я не могу выяснить.

Когда я помещаю кнопку на панель инструментов extjs, она появляется с появлением по умолчанию (как и любые параметры панели инструментов Windows)

как мне сделать так, чтобы она выглядела как кнопка в форме ??

Ответы [ 5 ]

3 голосов
/ 25 октября 2013

Попробуй так: 

tbar: [
  { xtype: 'button', text: 'Button 1', cls:'x-btn-default-small' }
]
1 голос
/ 30 марта 2016

Вы должны обернуть его в панель, вот решение для Extjs 4.2.5 

{
    xtype: 'panel',
    items: {
        xtype: 'button',
        text : 'My button'
    }
}
0 голосов
/ 27 марта 2014

Вот мое решение (оно работает для extJs 3.3.3):

Для кнопки добавить дополнительный класс, я назвал его «x-toolbar-grey-btn»: 

xtype: 'button',
id: 'processButton',
text: 'Process',
ctCls: 'x-toolbar-grey-btn'

Стили для дополнительного класса, в отдельном файле CSS: 

.x-toolbar-grey-btn .x-btn-tl{
    background-position: 0 0;
}
.x-toolbar-grey-btn .x-btn-tr{
    background-position: -3px 0;
}
.x-toolbar-grey-btn .x-btn-tc{
    background-position: 0 -6px;
}
.x-toolbar-grey-btn .x-btn-ml{
    background-position: 0 -24px;
}
.x-toolbar-grey-btn .x-btn-mr{
    background-position: -3px -24px;
}
.x-toolbar-grey-btn .x-btn-mc{
    background-position: 0 -1096px;
}
.x-toolbar-grey-btn .x-btn-bl{
    background-position: 0 -3px;
}
.x-toolbar-grey-btn .x-btn-br{
    background-position: -3px -3px;
}
.x-toolbar-grey-btn .x-btn-bc{
    background-position: 0 -15px;
}
.x-toolbar-grey-btn button{
    font-weight: bold;
}

Поскольку изображения кнопок Ext лежат в файле ' / ext-3.3.3 / resources / images / default / button / btn.gif ', я изменил только background-position имущество. Похоже на родную кнопку.

0 голосов
/ 23 октября 2013

Это довольно близко к этому: Панель инструментов в стиле ExtJS Button

Ответ, который я искал, был найден в этом вопросе:

Добавление 

ctCls: 'x-btn-over'

в настройках кнопки она выглядит как кнопка.Это своего рода хак, потому что это, по сути, стилизация кнопки панели инструментов, чтобы она выглядела так, как будто она зависла, но в моем случае я решила, что это достаточно хорошо.так что похоже это больше не работает.

0 голосов
/ 22 июня 2011

См. Этот пост на форуме Sencha. Стиль кнопок панели инструментов. Мне тоже показалось, что это стиль кнопки, поскольку текст совершенно не понятен для пользователей.С помощью всего лишь нескольких строк CSS, добавленных в ваш основной файл ExtJs CSS, вы можете глобально изменить этот вид для своего приложения.

...