你的位置:陶瓷網 > 娛樂 > 使用Axure如何實現選中文本框變色效果

使用Axure如何實現選中文本框變色效果

時間:2022-06-01 22:45瀏覽次數:161

我們在設計登錄頁時,爲了讓用戶清楚自己是否選中成功,在用戶點擊個文本框時會採用變色的方式來告知用戶已經選中,今天就給大家分享一下如何使用Axure來實現選中文本框變色的效果,希望對大家有所幫助

工具/原料

聯想電腦win7、win8、win10Axure7、Axure8Axure

方法/步驟

第一,拖動兩個矩形至手機外殼中,並調整大小至合適,如下圖。

?>使用Axure如何實現選中文本框變色效果

第二,在上一步創建的兩個矩形中各拖入一個文本框,如下圖

使用Axure如何實現選中文本框變色效果

第三,按住“ctrl”鍵,依次點擊上一步創建的兩個文本框,然後點擊右側的“隱藏邊框”,如下圖。

使用Axure如何實現選中文本框變色效果

第四,按住“ctrl”鍵,依次點擊用戶名矩形和密碼矩形,然後點擊右側的“選中”,勾選“線段顏色”,如下圖。

使用Axure如何實現選中文本框變色效果

第五,單擊選中用戶名文本框,然後雙擊最右側的“獲取焦點時”調出用例編輯彈窗,如下圖。

使用Axure如何實現選中文本框變色效果

第六,點擊“選中”,然後選擇“用戶名矩形”,然後設置值爲“true”,如下圖。

使用Axure如何實現選中文本框變色效果

第七,再次選中“用戶名文本框”,然後雙擊“失去焦點時”調出用例編輯彈窗,如下圖。

使用Axure如何實現選中文本框變色效果

第八,點擊“取消選中”,然後選擇“用戶名矩形”,然後設置值爲“false”,如下圖。

使用Axure如何實現選中文本框變色效果

第九,根據對用戶名矩形的設置,也對密碼矩形做相同的編輯,如下圖。

使用Axure如何實現選中文本框變色效果

第十,到此步爲止咱們已經將選中文本框後文本框變色的效果做出來,預覽請看下圖。

使用Axure如何實現選中文本框變色效果
友情链接: 莊凡網共享網鋪子網求學網果樂網

陶瓷網生活娛樂健康金融情感教育

Copyright © 2013-2022 陶瓷網 版權所有