常用組件的專業(yè)認識
在產(chǎn)品設計過程中,我們會經(jīng)常用到一些小組件、模塊,但你知道這些組件叫什么名字嗎?這篇文章,我們來解決下這個問題。
我看身邊有很多小伙伴對很多組件有一種“看著很熟,自己設計原型時也會使用,但是卻不知道叫啥”的情況,這樣就會影響產(chǎn)品內(nèi)部以及和技術(shù)小伙伴的工作溝通。
所以基于以上情況,本次專門整理了一些常用組件的專業(yè)知識,分享給不太關注組件專業(yè)術(shù)名的“產(chǎn)品老手”以及根本就沒用過相關組件的“產(chǎn)品新手”~
Popup 彈出層:彈出層容器,用于展示彈窗、信息提示等內(nèi)容,支持多個彈出層疊加展示。支持頂部,底部,左側(cè),右側(cè)不同位置的彈出。
toast輕提示:在頁面中間彈出黑色半透明提示,用于消息通知、加載提示、操作結(jié)果提示等場景。分為文字提示、加載提示、成功提示、失敗提示、動態(tài)更新提示;可以頂部展示或者底部展示。
snackbar:比toast稍微重一點的輕量型反饋方式,包含一行與進行中的操作相關的文案&(最多)一個操作,并且snackbar不能包含使其消息的“取消”操作。
注:很多組件庫中沒有該組件,需要技術(shù)小伙伴自己來寫(例如技術(shù)常用的vant3就沒有~)
Calendar 日歷:日歷組件用于選擇日期或日期區(qū)間??蛇x擇單個日期,多個日期,日期區(qū)間。
級聯(lián)選擇框:用于多層級數(shù)據(jù)的選擇,典型場景為省市區(qū)選擇。
時間選擇器:支持日期、年月、時分等維度,通常與彈出層件配合使用。
Picker 選擇器:提供多個選項集合供用戶選擇,支持單列選擇和多列級聯(lián),通常與彈出層組件配合使用。
Rate 評分:用于對事物進行評級操作。
Slider 滑塊:滑動輸入條,用于在給定的范圍內(nèi)選擇一個值。
Stepper 步進器:由增加按鈕、減少按鈕和輸入框組成,用于在一定范圍內(nèi)輸入、調(diào)整數(shù)字。
Badge 徽標:在右上角展示徽標數(shù)字或小紅點。
NoticeBar 通知欄:用于循環(huán)播放展示一組消息通知??伤娇纱怪睗L動。
Popover 氣泡彈出框:彈出式的氣泡菜單
Tag 標簽:用于標記關鍵詞和概括主要內(nèi)容。
ActionBar 動作欄:用于為頁面相關操作提供便捷交互。
Tab 標簽頁:選項卡組件,用于在不同的內(nèi)容區(qū)域之間進行切換。
Tabbar 標簽欄:底部導航欄,用于在不同頁面之間進行切換
TreeSelect 分類選擇:用于從一組相關聯(lián)的數(shù)據(jù)集合中進行選擇。支持單選和多選模式
此次分享到此結(jié)束,歡迎小伙伴留言分享其他常用但是很多小伙伴不容易叫上名字的組件~
本文由 @Grace 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自Unsplash,基于 CC0 協(xié)議。
該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務。
- 目前還沒評論,等你發(fā)揮!