Кожен віджет на платформі має свій стан, саме тому, вони не взаємодіють між собою. Проте, використовуючи глобальний об'єкт ми можемо пов'язати їх роботу.
До приклад: ми не хочемо використовувати функціонал перемикання між вкладками, які є у віджеті Tab, хочемо створити окремі картинки, натискаючи на які, буде відбуватись перемикання наших вкладок.
Що варто знати:
Крок перший - створюємо віджет вкладка(Tabs)
Додаємо віджет Tabs на сторінку та створюємо декілька вкладок. На кожній сторінці додаємо текст, щоб бачити, що вкладки переключаються.
Крок другий - додаємо глобальний об'єкт
В налаштуваннях віджета, у розділі події(Events) - onTabSelected, вибираємо storeValue, та даємо назву глобальному об'єкту selectedTab в полі Key, а поле Value залишаємо пустим. Для того, щоб на вибрання вкладки, наш глобальний об'єкт очищався.
У полі "Вибрана вкладка"(Selected tab) пишемо посилання на наш глобальний об'єкт.
Увімкнене поле Show Tabs вимикаємо. В такому випадку скриємо перемикач вкладок.
Крок третій - створюємо переключення через картинки
Перетаскуємо віджет картинки на сторінку(у моєму випадку 4 віджети, бо 4 вкладки). Вставляємо будь-які посилання. В картинці, у розділі події(Events), вибираємо storeValue, та даємо назву нашому глобальному об'єкту selectedTab в полі Key, а в полі Value пишемо назву нашої вкладки. Щоб при натисканні на картинку відкривалась вибрана вкладка. Так робимо в кожній картинці.
Як це працює?
У віджеті Вкладка, в полі за замовчуванням пишемо посилання на наш глобальний об'єкт. Він завжди пустий. Окрім випадків, коли ми натискаємо на картинку. При натисканні на картинку, стан нашого об'єкту змінюється на назву, вибраної вкладки. За рахунок цього, переключається вкладка, та її стан очищається.
Коли стан за замовчуванням пустий, у віджеті Вкладка, він автоматично відкриває першу вкладку. Коли приходять дані(назва нашої вкладки), він відкриває вкладку з написаною назвою. Це прирівнюється до завантаження сторінки, бо стан від початку пустий. Далі стан після зміни вкладки очищається. Щоб знову змогти повторити таку дію.
Top comments (0)