Android UI切圖命名規範

最終命名=前綴+位置/組件/用途+後綴

前綴

前綴 原始 說明 示例
ic icon 主要用於佈局和子佈局的圖標 ic_launcher
bg background 要用於佈局和子佈局的背景 bg_welcome
btn button 主要用於按鈕的表示,有時會在ic和btn之間猶豫,簡單的區分即是功能視圖,如果一個view執行的時back或者confirm或者cancel的功能,則命名上則應該使用btn btn_ok
img image 主要用於靜態圖片 img_avatar

位置、組件、用途

位置標識 說明 示例
common 公共標識 img_common_bg(共同背景)
tab 選項卡 ic_tab_setting (設置)
notify 狀態欄、通知欄 btn_notify_download (通知欄下載按鈕)
dialog 對話框 bg_dialog_blur (模糊化的對話框背景)
menu 菜單 bg_menu_save (保存菜單背景)
anim 用於動畫 img_anim_loading01 (loading幀動畫第一幀)
pop 用於彈出框 img_pop_bg (彈出框背景,區別於dialog)
mask 用於遮罩層 img_dialog_mask (對話框上層遮罩)
circle 圓圈 img_circle_avatar (圓形頭像)

後綴

後綴 說明 示例
normal 默認狀態 btn_cancel_normal (取消按鈕默認狀態時)
pressed 按下狀態 btn_cancel_pressed (取消按鈕按下狀態時)
focused 獲得焦點 btn_cancel_focused (取消按鈕獲得焦點、高亮時)
selected 選中狀態 btn_cancel_selected (取消按鈕選中時)
enabled 不能點擊 btn_cancel_enabled (取消按鈕不可用時)
white 白色 bg_white (白色)
tra 透明度 bg_banner_green_tra30 (banner中綠色背景指定30%透明)
level 層次、水平 img_status_level60 (狀態爲60的時候)
bg 用於後綴背景 當不在前綴命名時,添加到後綴命名
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章