使用組件切換器實現(xiàn)一個標簽導航
效果展示

前置準備
背景素材
話題圖標素材
步驟分解
制作背景
制作話題導航
制作話題導航結果列表
設置組件切換器關聯(lián)內容
創(chuàng)建切換組件行為觸發(fā)器
點擊行為觸發(fā)器
具體步驟
制作背景
將背景素材添加到根容器
拖拽組件切換器到 背景素材上
選中組件切換器
點擊檢查面板的樣式
調整組件切換器 樣式
制作話題導航
拖拽容器 到編輯區(qū)
選中容器
點擊檢查面板 中 的樣式
配置容器的 樣式
拖拽標簽文本 到容器中
選中標簽文本
點擊檢查面板 中 的樣式
調整標簽文本 的 樣式
將話題圖標素材添加到標簽文本中
制作話題導航結果列表
拖拽循環(huán)容器到 布局到容器
選中循環(huán)容器
點擊檢查面板中的樣式
配置循環(huán)容器的樣式
拖拽圖片組件到循環(huán)列表項
選中圖片組件
調整圖片組件 的樣式
拖拽標簽文本到循環(huán)列表項
選中標簽文本
調整標簽文本 的樣式



鼠標右鍵 復制 一個容器

為新復制的容器,更換圖片和文本

設置組件切換器關聯(lián)內容
選中 組件切換器
點擊檢查面板中的數(shù)據綁定與設置
點擊加號,設置關聯(lián)內容

創(chuàng)建切換組件行為觸發(fā)器
選中組件切換器
點擊檢查面板中的 觸發(fā)器
創(chuàng)建如下 觸發(fā)器


創(chuàng)建點擊行為觸發(fā)器
選中 標簽文本
點擊檢查面板中的 觸發(fā)器
創(chuàng)建觸發(fā)器
