Since 5.0
полезный компонент для показа подсказок для пользователей в сложных приложениях.
Компонент Hint помогает показывать подсказки и инструкции для пользователей достаточно сложных приложений. Все подсказки последовательно выстроены, и вы можете определять действия, которые должны произойти до или после показа любой подсказки.
Подробнее читайте в описательной документации.
var hint = webix.ui({
view: "hint",
id: "hint",
steps: [
{
el: ".div1",
title: "Добро пожаловать в Booking App!",
text: "Кликните сюда, чтобы просмотреть наиболее популярные рейсы",
event:"click"
},
{
el: ".div2",
title: "Информация всего в один клик!",
text: "Кликните сюда, чтобы просмотреть информацию о рейсе",
event:"click"
}
]
});
adjust | подстраивает размеры компонента под размеры HTML-контейнера |
attachEvent | задает обработчик внутреннего события компонента |
bind | связывает данные компонентов |
blockEvent | временно блокирует вызов ВСЕХ событий вызывающего объекта |
callEvent | вызывает внутреннее событие компонента |
define | переопределяет одну или несколько настроек компонента |
destructor | разрушает компонент |
detachEvent | удаляет обработчик события (который был задан ранее методом attachEvent) |
disable | блокирует компонент (он становится серым, клики по нему не срабатывают) |
enable | делает активным ранее заблокированный компонент |
end | завершает показ подсказок |
getChildViews | возвращает внутренние компоненты |
getCurrentStep | возвращает номер текущей подсказки компонента Hint |
getFormView | возвращает объект формы, которой принадлежит компонент |
getNode | возвращает HTML-элемент компонента |
getParentView | возвращает родительский компонент |
getSteps | возвращает массив подсказок компонента Hint |
getTopParentView | возвращает самого верхнего родителя |
hasEvent | проверяет, есть ли у компонента обработчики указанного события |
hide | скрывает компонент |
isEnabled | проверяет, активен или заблокирован компонент |
isVisible | проверяет, виден ли компонент |
mapEvent | направляет события от одного компонента к другому |
queryView | возвращает внутренние компоненты, которые удовлетворяют указанному условию |
resize | перерисовывает компонент после изменения размеров |
resume | возобновляет показ начиная с указанной подсказки |
setSteps | задает массив подсказок для Hint |
show | делает компонент видимым |
start | начинает показ подсказок |
unbind | отменяет связывание компонентов |
unblockEvent | отменяет блокировку событий, которая была вызвана командой 'blockEvent' |
onAfterScroll | срабатывает после прокрутки содержимого компонента webix |
onAfterStart | вызывается после начала показа подсказок |
onBeforeStart | срабатывает перед началом показа подсказок |
onBindRequest | срабатывает, когда компонент готов получить данные из главного компонента |
onBlur | срабатывает при смещении фокуса за пределы компонента |
onDestruct | происходит, когда компонент был разрушен деструктором |
onEnd | срабатывает после того, как пользователь просмотрит последнюю подсказку |
onEnter | срабатывает после нажатия клавиши Enter |
onFocus | срабатывает после смещения фокуса на компонент |
onKeyPress | срабатывает после того, как пользователь нажал клавишу (для компонента, на котором сейчас фокус) |
onLongTouch | срабатывает после того, как пользователь на достаточно долгое время задержит палец на экране (для устройств с сенсорным экраном) |
onNext | срабатывает после того, как пользователь выполнит действие из подсказки или нажмет Next |
onPrevious | срабатывает после нажатия на кнопку Previous |
onSkip | срабатывает, когда пользователь отменил показ подсказок |
onSwipeX | срабатывает по горизонтальному свайпу |
onSwipeY | срабатывает по вертикальному свайпу |
onTimedKeyPress | срабатывает через некоторое время после нажатия клавиши в текстовом поле |
onTouchEnd | срабатывает после завершения события touch |
onTouchMove | срабатывает по время движения пальца по сенсорному экрану |
onTouchStart | срабатывает после touch-события в компоненте webix |
onViewResize | срабатывает после того, как пользователь изменил размер компонента с помощью компонента resizer |
onViewShow | срабатывает, когда компонент появляется (вызов метода show()) |
animate | определяет анимацию для показа компонента в Multiview |
borderless | скрывает или показывает границы компонента |
container | HTML-контейнер (или его ID), внутри которого компонент должен быть инициализирован |
css | имя CSS-класса, который будет присвоен HTML-элементу компонента, или объект со стилями |
disabled | блокирует или разблокирует компонент |
gravity | задает удельный (относительный) размер компонента |
height | задает высоту компонента |
hidden | скрывает компонент после его инициализации |
id | ID компонента |
keyPressTimeout | задержка между нажатием клавиши и обработчиком |
left | задает положение подсказки на экране (по горизонтали) |
maxHeight | задает максимальную высоту компонента |
maxWidth | задает максимальную ширину компонента |
minHeight | задает минимальную высоту компонента |
minWidth | задает минимальную ширину компонента |
nextButton | используется для настройки кнопки Next в подсказках |
on | позволяет присоединять обработчики к внутренним событиям компонента |
prevButton | используется для настройки кнопки Previous в подсказках |
stepTimeout | таймаут перед показом следующей подсказки |
steps | массив объектов с настройками для каждой подсказки |
top | задает положение окна с подсказками на экране (по вертикали) |
width | задает ширину компонента |
$getSize | возвращает текущий размер компонентов |
$height | текущая высота компонента |
$scope | область имен для событий и методов |
$setNode | определяет HTML-элемент компонента |
$setSize | задает размеры компонента |
$skin | вызывается после применения скина |
$view | возвращает HTML-элемент компонента |
$width | текущая ширина компонента |
config | все настройки, заданные при инициализации компонента |
name | возвращает имя компонента (свойство только для чтения) |