control.Button

Расширяет ICustomizable, ISelectableControl.

Элемент управления "Кнопка". Добавляется в тулбар.

Конструктор | Поля | События | Методы

Конструктор

control.Button([params[, options]])

Параметры:

Параметр Значение по умолчанию Описание
params

Тип: Object|String

Параметры кнопки или строка - содержимое кнопки в виде HTML.

params.data

Тип: Object

Данные кнопки.

params.data.content

Тип: String

Содержимое кнопки в виде HTML.

params.data.image

Тип: String

Иконка кнопки, если есть.

params.data.imageDisabled

Тип: String

Иконка для "отключенного" состояния кнопки.

params.data.imageSelected

Тип: String

Иконка для "выбранного" состояния кнопки.

params.data.title

Тип: String

Текст всплывающей подсказки, которая появляется при наведении на кнопку курсора мыши.

options

Тип: Object

Опции кнопки.

options.layout

Тип: Function|String

Макет элемента управления. В конструктор макета передается объект, содержащий поля:
  • control - ссылка на элемент управления;
  • options - менеджер опций элемента управления control.Button.options;
  • data - менеджер данных элемента управления control.Button.data;
  • state - менеджер состояния элемента управления control.Button.state.
Макет меняет свой внешний вид на основе данных, состояния и опций элемента управления. Элемент управления, в свою очередь, реагирует на интерфейсные события макета и меняет значения полей control.Button.state в зависимости от полученных команд. (Тип: конструктор объекта с интерфейсом ISelectableControlLayout или ключ макета).
options.minWidth 0

Тип: Number

Минимальная ширина кнопки.

options.position { top: 5, left: 5 }

Тип: Object

Положение элемента управления над картой. Задается в виде объекта со следующими полями:
  • top - отступ от верхнего края контейнера карты в пикселах;
  • right - отступ от правого края контейнера карты в пикселах;
  • bottom - отступ от нижнего края контейнера карты в пикселах;
  • left - отступ от левого края контейнера карты в пикселах.
Если при этом заданы одновременно и top, и bottom, то значение bottom игнорируется. Аналогично, если заданы одновременно и left, и right, то значение right игнорируется. Если элемент управления добавляется в группу элементов (например, в тулбар или раскрывающийся список), то значение position не применяется.
options.selectOnClick true

Тип: Boolean

Опция, описывающая поведение кнопки.
  • true - кнопка становится "нажатой" после клика;
  • false - кнопка не меняет свой внешний вид после клика на нее.
options.visible true

Тип: Boolean

Признак того, что элемент управления отображается.

Примеры:

1.

// Пример 1.
// Создание кнопки и добавление ее на карту.
var button = new ymaps.control.Button({
         data: {
             // Зададим иконку для кнопки
             image: 'images/button.jpg',
             // Текст на кнопке.
             content: 'Сохранить',
             // Текст всплывающей подсказки.
             title: 'Нажмите для сохранения маршрута'
         }
    }, {
        // Зададим опции для кнопки.
        selectOnClick: false
    });
map.controls.add(button, {top: 5, right: 5});

2.

// Пример 2.
// Создание кнопки с пользовательским макетом
var button = new ymaps.control.Button({
        data: {
            content: 'Красная кнопка',
            title: 'Нажмите на кнопку'
        }
    }, {
        layout: ymaps.templateLayoutFactory.createClass(
            // Если кнопка не нажата, к ней применится css-стиль 'myButton'
            // Если кнопка нажата, к ней применятся css-стили 'myButton' и 'myButtonSelected'.
            "<div class='myButton [if state.selected]myButtonSelected[endif]' title='$[data.title]'>" +
            "$[data.content]" +
            "</div>"
        )
    });
map.controls.add(button);

Поля

Имя Тип Описание
data data.Manager
Данные кнопки. Имена полей, доступных через метод data.Manager.get:
  • image - иконка кнопки, если есть;
  • imageDisabled - иконка для "отключенного" состояния кнопки;
  • imageSelected - для "выбранного" состояния кнопки;
  • content - cодержимое кнопки в виде HTML;
  • title - текст всплывающей подсказки, которая появляется при наведении на кнопку курсора мыши.
events IEventManager

Менеджер событий.

Унаследовано от IEventEmitter.

options IOptionManager

Менеджер опций.

Унаследовано от ICustomizable.

state data.Manager
Состояние кнопки. Имена полей, доступных через метод data.Manager.get:
  • selected - признак, нажата ли кнопка;
  • enabled - признак, активна ли кнопка;
  • pressed - признак того, что кнопка зажата пользователем.

События

Имя Описание
click

Нажатие на кнопку. Экземпляр класса Event.

deselect

Элемент управления не выбран.

Унаследовано от ISelectableControl.

disable

Элемент управления стал недоступным.

Унаследовано от ISelectableControl.

enable

Элемент управления стал доступным.

Унаследовано от ISelectableControl.

mapchange
Сменилась карта. Поля данных:
  • oldMap - старая карта;
  • newMap - новая карта.

Унаследовано от IChildOnMap.

optionschange

Изменение в опциях объекта.

Унаследовано от ICustomizable.

parentchange

Сменился родительский объект.

Поля данных:

  • oldParent - старый родитель;
  • newParent - новый родитель.

Унаследовано от IChild.

select

Элемент управления выбран.

Унаследовано от ISelectableControl.

Методы

Имя Возвращает Описание
deselect()

Отменяет выбор элемента управления (выключает).

Унаследован от ISelectableControl.

disable()

Делает элемент управления недоступным (запрещены пользовательские действия).

Унаследован от ISelectableControl.

enable()

Делает элемент управления доступным (разрешены пользовательские действия).

Унаследован от ISelectableControl.

getParent()

IControlParent

Returns ссылку на родительский объект.

Унаследован от IControl.

isEnabled()

Boolean

Returns true - элемент управления доступен, false - недоступен.

Унаследован от ISelectableControl.

isSelected()

Boolean

Returns true - элемент управления выбран, false - не выбран.

Унаследован от ISelectableControl.

select()

Выбирает (включает) элемент управления.

Унаследован от ISelectableControl.

setParent(parent)

IChildOnMap

Устанавливает родительский объект.

Унаследован от IControl.

Описание полей

data

Данные кнопки. Имена полей, доступных через метод data.Manager.get:
  • image - иконка кнопки, если есть;
  • imageDisabled - иконка для "отключенного" состояния кнопки;
  • imageSelected - для "выбранного" состояния кнопки;
  • content - cодержимое кнопки в виде HTML;
  • title - текст всплывающей подсказки, которая появляется при наведении на кнопку курсора мыши.

state

{data.Manager} state
Состояние кнопки. Имена полей, доступных через метод data.Manager.get:
  • selected - признак, нажата ли кнопка;
  • enabled - признак, активна ли кнопка;
  • pressed - признак того, что кнопка зажата пользователем.

Пример:

var button = new ymaps.control.Button('Редактировать');
// Зададим состояние кнопки "нажата" -
// аналогично вызову метода button.select();
button.state.set('selected', true);

Описание событий

click

Нажатие на кнопку. Экземпляр класса Event.