其實(shí)很早之前就有查過這方面的資料硼被,可惜一直沒有總結(jié)。當(dāng)時(shí)因?yàn)槊刻鞂慍SS渗磅,需要命名的地方比較多嚷硫。
目前主流的切圖命名方式:
控件位置 > 控件類別 > 控件詳情描述 > 控件狀態(tài)
在移動(dòng)端,可以看成是
所屬頁(yè)面 > 控件類別 > 做什么的 > 狀態(tài)
用下劃線"_"分開
有些控件叫法始鱼,安卓和iOS略有不同仔掸,比如底部標(biāo)簽安卓叫button navigation底部導(dǎo)航,而iOS叫做底部標(biāo)簽tab医清。具體操作還是按照自己(團(tuán)隊(duì))的習(xí)慣來起暮。我這里盡量以安卓為準(zhǔn)。
對(duì)于一些在多個(gè)頁(yè)面通用的部件会烙,我建議用“common”作為前綴负懦。
模塊
通用 common
啟動(dòng)頁(yè)面 default
頂部導(dǎo)航 nav
左側(cè)導(dǎo)航 leftbar
底部導(dǎo)航 bottom navigation
底部紙張 bottom sheet
工具欄 toolbar
頂部標(biāo)簽 tab
個(gè)人資料 porfile
設(shè)置 setting
內(nèi)容 content
主頁(yè) home
登陸 login
注冊(cè) register
控件
背景 bg
按鈕 button
浮動(dòng)按鈕 floating action button
卡片 card
標(biāo)簽 chip
數(shù)據(jù)表格 data table
對(duì)話框 dialog
網(wǎng)格列表 grid list
菜單 menu
進(jìn)度條 progress
選擇控件 selection control
滑塊 slider
小提示 snackbar
步驟 stepper
輸入框 text field
列表 list
彈出 pop
刷新 refresh
模式
數(shù)據(jù)表格 data format
空狀態(tài) empty state
錯(cuò)誤 error
手勢(shì) gesture
指紋 fingerprint
啟動(dòng)頁(yè)面 launch screen
加載圖片 loading image
搜索 search
文字
標(biāo)題 title
副標(biāo)題 subheading
主體文字 body
說明 caption
提示信息 msg
內(nèi)容
照片 photo
圖片 img
圖標(biāo) icon
用戶 user
返回 back
刪除 delete
編輯 edit
下載 download
鏈接 link
注釋 note
標(biāo)志 logo
更多 more
取消 cancel
添加 add
狀態(tài)
常用狀態(tài) nor
網(wǎng)頁(yè)設(shè)計(jì)的懸浮狀態(tài) hover
點(diǎn)擊時(shí)的狀態(tài) pressed
選中以后的狀態(tài) selected
不可用狀態(tài) disabled