如何在Axure中實現不同元件的單選選中效果？教程詳解在此，請看~~

同一選填內容的不同選項，我們可以通過拖動元件庫已有的“單選按鈕”，編輯選項對應需要展示的文字；然后全選所有的“單選按鈕”，將他們組合并取名為某一名稱；最后將此名稱復制到“設置單選按鈕組名稱”中，即可實現效果。

以我們填寫個人信息中很常見的性別選擇為例。

但如果你所需要呈現的原型不是單選按鈕，而是類似于菜單選中或者頁碼切換的展示效果，那“單選按鈕”就滿足不了你了

這時候我們需要自定義不同元件的單選選中效果，具體的Axure操作步驟可分解為：

第一步

拖入一個矩形元件到頁面中，將其調整為你想要的形狀和大小，并對其進行命名

我拖入了一個矩形，將其圓角半徑設置為8，將該元件名稱修改為“性別”，并在該矩形內輸入想要展示的文字“男性”。

第二步

設置矩形元件的交互事件（設置鼠標單擊該元件時，它的選中狀態為“true”）。

第三步

設置矩形元件的交互樣式（點擊選中，設置選中的交互樣式為白色字體，填充藍色）。

第四步

復制剛剛設置好的矩形元件，粘貼出你所需數量的單選元件，并一一修改輸入你需要元件上展示的文字內容（需要保證這些元件的命名都是統一的）。

第五步

全選中這些元件，在“設置選項組名稱”中輸入他們（一樣的）名稱后，點擊F5就可以看到效果了。

原型效果：http://www.wulihub.com.cn/go/Wy3R9J/start.html（附帶頁碼單選的原型效果）

本文由 @素小白 原創發布于人人都是產品經理，未經許可，禁止轉載

題圖來自 Unsplash，基于 CC0 協議