粗大的内捧猛烈进出小视频,日本成人精品视频一区,在线播放亚洲成人av,精品人妻少妇嫩草av专区,亚洲AV永久久久久久久浪潮,性导航app精品视频,九九热精品免费视频,一本一本大道香蕉久在线播放

        UI中切圖與命名規范,收藏!

        2019-3-14    用心設計

        如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

         

        規范的命名方式可以提高開發人員的開發效率和整個開發團隊的友好合作,減少溝通成本。結合經驗與收錄的資料,分享給大家。

        一. 切圖命名英文縮寫的三個要求


        1.較短的單詞可通過去掉“元音”形成縮寫

        2. 較長的單詞可取單詞的頭部幾個字母形成縮寫

        3.還有一些特定的英文單詞縮寫


        二. 命名規則


        切圖命名以模塊為前綴,如:模塊_類別_功能_狀態.png


        模塊:

        登陸頁面(login) 公共(common) 需求a(need) 需求b(demand) 發現(discover) 消息(message)    我(me)


        類別:

        導航欄(nav) 菜單欄(tab) 按鈕(btn)  圖標(icon)  背景圖片(bg)  默認圖片(def)


        狀態:

        selected(選中) disabled(不可點) pressed(按下) normal(一般)


        舉例說明:

        IOS:

        以750*1334為基稿設計,按實際項目開發為標準,需切出@2x和@3兩套圖,把在公共頁面中的導航欄里面有一個按鈕(40x60px)的選中狀態切圖,直接輸出的切圖為@2x圖,@2x的1.5倍圖為@3x。


        輸出成果為:

        common_nav_btn_back_s@2x.png(40x60)和common_nav_btn_back_s@3x.png(80x120);

        意思為:公共_導航_按鈕_返回_選中


        Android:

        以720*1280為基稿設計,由于尺寸不同且多樣,需要切多套圖適配不同機器,分別為mdpi、hdpi、xhdpi、xxhdpi、xxxhdpi,直接輸出的切圖為xhdpi;它們分別對應的倍數關系為1、1.5、2、3、4。


        輸出成果為:

        common_nav_btn_back_s_mdpi.png(20x30)、

        common_nav_btn_back_s_hdpi.png(30x45)、

        common_nav_btn_back_s_xhdpi.png(40x60)、

        common_nav_btn_back_s_xxhdpi.png(60x90)、common_nav_btn_back_s_xxxhdpi.png(80x120);


        命名示列:

        啟動  (default):    

        default.png   啟動圖片;

        default_logo.png   啟動logo


        登陸(login):

        login_bg.png   登陸背景圖片

        login_logo.png   登陸logo

        login_input_n.png   輸入框

        login_input_s.png   輸入框選中狀態

        login_btn_n.png    登錄按鈕

        login_btn_s.png    登錄按鈕選中狀態


        注冊(register):

        login_register_rb_n.png    單選框按鈕

        login_register_rb_s.png    單選框按鈕選中狀態


        導航欄(nav):

        common_nav_btn_menu_n.png    菜單按鈕

        common_nav_btn_menu_s.png    菜單按鈕選中狀態

        common_nav_btn_back_n.png    返回按鈕

        common_nav_btn_back_s.png    返回按鈕選中狀態

        common_nav_btn_close_n.png    關閉按鈕

        common_nav_btn_close_s.png    關閉按鈕選中狀態

        common_nav_btn_eidt_n.png    編輯按鈕

        common_nav_btn_eidt_s.png    編輯按鈕選中狀態

        common_nav_btn_delete_n.png    刪除按鈕

        common_nav_btn_delete_s.png    刪除按鈕選中狀態

        common_nav_btn_message_n.png    消息按鈕

        common_nav_btn_message_s.png    消息按鈕選中狀態

        common_nav_btn_search_n.png    搜索按鈕

        common_nav_btn_search_s.png    搜索按鈕選中狀態


        列表(list):

        hpcollege_list_collect.png    列表頁收藏按鈕


        左側導航欄(leftbar):

        leftbar_info.png     個人中心


        菜單(tab):

        common_tab_need_n.png     需求a按鈕

        common_tab_need_s.png     需求a按鈕選中狀態

        common_tab_find_n.png     發現按鈕

        common_tab_find_s.png     發現按鈕選中狀態

        common_tab_demand_n.png    需求b按鈕

        common_tab_demand_s.png    需求b按鈕選中狀態

        common_tab_me_n.png    我的按鈕

        common_tab_me_s.png    我的按鈕選中狀態


        首頁(home):

        home_bg.png     首頁背景

        home_banner.png     首頁廣告圖


        點9圖(.9):

        rounded rectangle.9.png    圓角矩形


        常用詞語:

        selected:選中/s

        pressed:按下/pre

        disabled:不可點/d

        normal:正常/n

        common:公共

        default:登錄頁

        discover:發現

        message:消息

        me:我

        navigation  bar:導航欄/nav

        tab:菜單欄

        button:按鈕/btn

        icon:圖標

        background-image:背景圖片/bg

        default-image:默認圖片/def

        cut-off  rule:分割線/cor

        login:登陸

        register:注冊

        list:列表

        home:首頁

        banner:廣告

        browse:瀏覽

        details:詳情

        like:喜歡

        dislike:不喜歡

        search:搜索

        content:內容

        collect:收藏

        eidt:編輯

        comment:評論

        message:提示信息/msg

        ranked:排名

        location:定位

        tags:標簽

        left:左

        right:右

        center:中

        popup:彈出/pop

        image:圖片/img

        viedio:視頻/vd

        audio:音頻/ad

        title:標題/tit

        address:地址/add

        number:人數

        time:時間

        sustem:系統

        refresh:刷新

        user:用戶

        more:更多

        border:邊框

        next:下一步

        sign:簽到

        code:密碼

        clear:清除

        scroll:滾動條

        hover:鼠標停留

        common:公共

        hot:熱點

        zoomin:放大

        zoomout:縮小

        service:服務

        presonal  data:個人資料/Pdata

        male:男性

        female:女性

        report:舉報

        input:輸入/ip

        dropdown  menu:下拉菜單/ddm

        radio button:單選框/rb

        check  box:復選框/cb

        progressbar:進度條/pbar

        download:下載

        arrow:箭頭

        share:分享

        upload:上傳

        release:發布

        tabbar:標簽欄

        autonym:實名

        藍設計m.xintaizi.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計

        日歷

        鏈接

        個人資料

        藍藍設計的小編 http://m.xintaizi.com

        存檔