在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ Android/ 手勢(shì)
Snackbars 與 Toasts
選擇器
網(wǎng)格
紙片
色彩
手勢(shì)
內(nèi)容選取
準(zhǔn)則
導(dǎo)航過(guò)渡
進(jìn)度和動(dòng)態(tài)
概述
數(shù)據(jù)格式
搜索(Search)
Roboto 字體
副標(biāo)題
Material 屬性
書(shū)寫(xiě)
空狀態(tài)
按鈕
提示框(Dialogs)
開(kāi)關(guān)
導(dǎo)航
單位和度量
列表
度量與邊框
真實(shí)的動(dòng)作
改進(jìn)的操作
底部動(dòng)作條
加載圖片
卡片
工具提示(Tooltips)
菜單
設(shè)備
可達(dá)性
分隔線(Dividers)
高度和陰影
環(huán)境
抽屜式導(dǎo)航
響應(yīng)式交互
Tabs
圖標(biāo)
滾動(dòng)時(shí)的技巧
更新記錄
錯(cuò)誤
影像處理
設(shè)置
滑塊控件(Sliders)
列表控制
圖像
文本框
布局模板
雙向性
選擇控制器
調(diào)色板
自適應(yīng) UI
貼片集
數(shù)據(jù)表
滑動(dòng)刷新
啟動(dòng)屏幕
按鈕:浮動(dòng)操作按鈕
打動(dòng)用戶的細(xì)節(jié)
應(yīng)用結(jié)構(gòu)
有意義的轉(zhuǎn)場(chǎng)動(dòng)畫(huà)
字體排版(Typography)
結(jié)構(gòu)

手勢(shì)

手勢(shì)

手勢(shì)控制分為觸發(fā)動(dòng)作(Touch Mechanics,用戶手指在屏幕上如何動(dòng)作)和觸發(fā)行為(Touch Activities,界面上特定動(dòng)作在特定情境下引發(fā)的結(jié)果)。

這是因?yàn)橥瑯拥挠|發(fā)動(dòng)作(如單次觸擊)在不同情境下可能會(huì)帶來(lái)不同的結(jié)果(如輕觸,取消,開(kāi)啟/關(guān)閉指示),同樣單次觸發(fā)行為(如放大)可能是由多種觸發(fā)動(dòng)作(如捏放,雙次觸擊,雙次觸擊拖拽等)實(shí)現(xiàn)。

觸發(fā)動(dòng)作

觸發(fā)動(dòng)作是用戶的手指在界面上做了什么。

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-touch_large_mdpi.png" alt="gestures-touch" />
單次觸擊(Touch)

一只手指按下,提起

例如:選擇

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-double-touch_large_mdpi.png" alt="gestures-double-touch" />

雙次觸擊(Double Touch)

兩只手指按下,提起,其中一只手指按下,提起
例如:放大

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-swipe_large_mdpi.png" alt="gestures-swipe" />
拖拽(Drag),輕滑(Swipe)和快擲(Fling)
一只手指按下,移動(dòng)再提起

例如取消,輕滑,傾斜

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-long-press_large_mdpi.png" alt="gesture-long-press" />

長(zhǎng)按
一只手指按下,稍后再提起
例如:選中一個(gè)元素,比如列表中的一個(gè)項(xiàng)目

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-long-press-drag_large_mdpi.png" alt="gestures-long-press-drag" />

長(zhǎng)按拖動(dòng)
一只手指按下后稍后,移動(dòng),再提起
如:選擇后移動(dòng)某項(xiàng),或是選擇多項(xiàng)

http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchMechanics-6-Long-press-drag_large_mdpi.png" alt="gestures-double-touch-drag" />

雙觸拖動(dòng)
一只手指按下后提起,再按下后,拖動(dòng),再提起
例如:放大,縮小

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-pinch-open_large_mdpi.png" alt="gestures-pinch-open" />

捏放(Pinch Open)
雙指按下,向外移動(dòng),再提起
例如:放大

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-pinch-closed_large_mdpi.png" alt="gestures-pinch-closed" />

捏合
雙指按下,向內(nèi)移動(dòng),再提起
例如:縮小

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-two-finger-touch_large_mdpi.png" alt="gestures-two-finger-touch" />

雙指觸擊
雙指快速按下,提起 例如:縮小

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-two-finger-swipe_large_mdpi.png" alt="gestures-two-finger-swipe" />

雙指拖拽,輕滑和快擲
兩指按下,移動(dòng)后提起
例如:選擇多項(xiàng)條目,平移(Pan),傾斜(Tilt)

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-two-finger-long-press_large_mdpi.png" alt="gestures-two-finger-long-press" />

雙指長(zhǎng)按
雙指按下,稍后提起
例如:暫無(wú)

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-two-finger-long-press-drag_large_mdpi.png" alt="gestures-two-finger-long-press-drag" />

雙指長(zhǎng)按拖動(dòng)
雙指按下,稍后移動(dòng),再提起
例如:選擇后移動(dòng)

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-two-finger-double-touch_large_mdpi.png" alt="gestures-two-finger-double-touch" />

雙指雙次觸擊
雙指快速按下提起,重復(fù)一次該動(dòng)作
例如:縮小

http://wiki.jikexueyuan.com/project/material-design/images/patterns-gestures-gestures-rotate_large_mdpi.png" alt="gestures-rotate" />
旋轉(zhuǎn)
雙指按下,以指間中點(diǎn)為圓心快速轉(zhuǎn)動(dòng),再提起
例如:在地圖中旋轉(zhuǎn)內(nèi)容

觸發(fā)行為

界面上特定動(dòng)作在特定情境下引發(fā)的結(jié)果。

點(diǎn)觸(Tap)
激活屏幕內(nèi)的元素,像是一個(gè)按鈕。
觸發(fā)動(dòng)作:?jiǎn)未斡|擊

取消或退出(Cancel or Escape)
取消或退出當(dāng)前任務(wù),如對(duì)話框或菜單。
觸發(fā)動(dòng)作:?jiǎn)未斡|擊

開(kāi)啟/關(guān)閉指示(Enable/Disable lights out)
隱藏或顯示一個(gè)窗口。
觸發(fā)動(dòng)作:?jiǎn)未斡|擊

拖拽(Drag),輕滑(Swipe)和快擲(Fling)
請(qǐng)閱讀文章的下半部分來(lái)詳細(xì)區(qū)別滾動(dòng),滾動(dòng),滾動(dòng)顯示,平移,取消,拉拽刷新,從邊緣滑動(dòng),頁(yè)面滑動(dòng)等的不同。
觸發(fā)動(dòng)作:拖拽,輕滑,或快擲

內(nèi)容選擇(Data selection )(當(dāng)前沒(méi)有選中項(xiàng)時(shí))
選擇某個(gè)元件
觸發(fā)動(dòng)作:長(zhǎng)按,雙指單次觸擊

內(nèi)容選擇(已有項(xiàng)目被選中時(shí))
在選擇狀態(tài)下,選擇更多的元件??梢院腿魏纹渌麊沃富螂p指手指結(jié)合使用。
觸發(fā)動(dòng)作:長(zhǎng)按,雙指觸擊

多項(xiàng)內(nèi)容選中拖拽(Data multi-selection drag)
拖拽時(shí)從拖拽起點(diǎn)顯示選擇框。選擇框的高度和寬度可以根據(jù)手指位置進(jìn)行調(diào)整。手指提起瞬間選擇框的尺寸最終尺寸。
觸發(fā)動(dòng)作:雙指滑動(dòng)或拖拽,在沒(méi)有項(xiàng)目選中時(shí)長(zhǎng)按拖動(dòng)

選擇后移動(dòng) (Pick up and Move)
對(duì)于已選的單個(gè)或多個(gè)項(xiàng)目生效。可用于:

  • 對(duì)一個(gè)視圖內(nèi)的內(nèi)容重新排序
  • 將某個(gè)元件移動(dòng)到一個(gè)容器或目標(biāo)內(nèi)
  • 重排列表里的項(xiàng)目
    觸發(fā)動(dòng)作:兩指長(zhǎng)按拖動(dòng),對(duì)于已選項(xiàng)長(zhǎng)按拖動(dòng)。

放大(Zoom in)
將內(nèi)容的尺寸放大。
觸發(fā)動(dòng)作:

  • 雙次觸擊
  • 雙觸拖拽(下)
  • 捏放

放大至合適(Zoom in to fit)
作用于內(nèi)置圖(nested views),將圖片從最小尺寸放大到合適。
觸發(fā)動(dòng)作:雙次觸擊

縮?。╖oom out)
將內(nèi)容的尺寸縮小。 觸發(fā)動(dòng)作:

  • 在元件最大尺寸時(shí)雙次觸擊
  • 雙次觸擊拖動(dòng)
  • 捏合
  • 雙指單次觸擊
  • 雙指雙次觸擊

展開(kāi)(Expand)
展開(kāi)被折疊了的內(nèi)容。
觸發(fā)動(dòng)作:捏放

折疊(Collapse)
折疊被展開(kāi)的內(nèi)容。
觸發(fā)動(dòng)作:捏合

旋轉(zhuǎn) (Rotate) 旋轉(zhuǎn)目標(biāo)內(nèi)容。
觸發(fā)動(dòng)作:旋轉(zhuǎn)

拖拽(Drag),輕滑(Swipe)和快擲(Fling)

由于滑動(dòng)的觸發(fā)行為可能因?yàn)榛瑒?dòng)時(shí)情景的不同而大不相同,這里將對(duì)一些主要的滑動(dòng)手勢(shì)和他們的區(qū)別進(jìn)行描述。

手勢(shì)的速率(由小至大)是拖拽,輕滑和快擲的主要區(qū)別。根據(jù)使用的情景,手勢(shì)的速率會(huì)產(chǎn)生不同的效果:

  • 拖拽:精確手勢(shì),較慢,更為細(xì)致,通常是針對(duì)屏幕的某個(gè)特定目標(biāo)進(jìn)行操作
  • 輕滑:粗放手勢(shì),略快,通常沒(méi)有一個(gè)特定的屏幕目標(biāo)
  • 快擲:粗放手勢(shì),沒(méi)有特定屏幕目標(biāo)

滑動(dòng)結(jié)束時(shí)速率大并且被作用元件的速率達(dá)到某個(gè)閥值,這樣的滑動(dòng)就是快擲。

通常手勢(shì)的速率會(huì)決定該動(dòng)作在超過(guò)一定范圍時(shí)是否可逆:一次拖拽行為中手指會(huì)和元件保持接觸,而反向操作會(huì)將元件拖回到原位;一次快擲行為會(huì)在達(dá)到閥值時(shí)與元件脫離接觸,此時(shí)不可逆。

滾動(dòng)(Scroll)

對(duì)主題內(nèi)容水平或垂直方向的滑動(dòng)。

滑動(dòng)的程度根據(jù)手勢(shì)的速度來(lái)決定: 拖拽(慢)VS 輕滑 VS 拋擲 fling(快)。

通常情況下:

  • 同一時(shí)刻,滾動(dòng)的方向只能水平或垂直(mutually exclusive)
  • 適用于尺寸為100%的內(nèi)容
    http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-02_large_mdpi.png" alt="Gestures-TouchActivities-02" />

滾動(dòng)顯示(Reveal upon Scroll)

反向滾動(dòng)可以快速顯示在這個(gè)應(yīng)用里隱藏的元件。比如在chome瀏覽器里,向上滾動(dòng)會(huì)顯示地址欄。

往正常方向滾動(dòng)元件再次隱藏。
http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-02_large_mdpi.png" alt="Gestures-TouchActivities-02" />

平移(Pan)

任意方向,一或兩只手指

通常應(yīng)用于:

  • 內(nèi)容是無(wú)邊界時(shí)(如地圖)
  • 內(nèi)容比屏幕顯示尺寸大(如放大查看網(wǎng)頁(yè)或圖片時(shí))

兩只手指的的平移是從其他兩只手指的手勢(shì)(如,捏合、捏放或旋轉(zhuǎn))轉(zhuǎn)變過(guò)來(lái)的,比如在地圖上操作。如果一開(kāi)始就用兩只手指平移會(huì)形成內(nèi)容的傾斜。

拖動(dòng)(drag)就是平移的典型。

快擲會(huì)保持手勢(shì)的速率,在該快擲方向上內(nèi)容有明顯的平移。
http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-03_large_mdpi.png" alt="Gestures-TouchActivities-03" />

消除(Dismiss)

從一個(gè)可以滑動(dòng)的元件開(kāi)始,比如列表中的一項(xiàng)或是卡片狀原件。

方向與滾動(dòng)的方向垂直。

一般是水平方向,對(duì)稱使用。

消除手勢(shì)要達(dá)到某個(gè)閥值才會(huì)生效。
http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-04_large_mdpi.png" alt="Gestures-TouchActivities-04" />

拉動(dòng)刷新(Swipe to Refresh)

作用于列表的起始項(xiàng)上面,或者是界面內(nèi)容開(kāi)始的那頭的空白的邊緣。

方向通常是垂直向下。
http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-05_large_mdpi.png" alt="Gestures-TouchActivities-05" />

邊緣滑動(dòng)(Edge Swipe)

邊緣滑動(dòng)從屏幕外開(kāi)始的滑動(dòng)動(dòng)作。用于激活與當(dāng)前場(chǎng)景不相關(guān)或有區(qū)別的內(nèi)容。

在沒(méi)有定義邊緣滑動(dòng)的情況下,邊緣滑動(dòng)動(dòng)作的效果默認(rèn)為和頁(yè)片滑動(dòng)一致。

邊緣滑動(dòng)要達(dá)到某個(gè)閥值才會(huì)生效。
http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-06_large_mdpi.png" alt="Gestures-TouchActivities-06" />

頁(yè)片滑動(dòng) (Paging Swipe)

頁(yè)片滑動(dòng)是在屏幕內(nèi)容上的滑動(dòng),用來(lái)顯示剩下的內(nèi)容。

如果單獨(dú)元件可以滑動(dòng),則不要使用頁(yè)片滑動(dòng)。每一次頁(yè)片滑動(dòng)用來(lái)顯示一個(gè)頁(yè)片/選項(xiàng)卡。

如果當(dāng)前頁(yè)片內(nèi)容是放大過(guò)的,首次頁(yè)片滑動(dòng)只會(huì)顯示剩余的內(nèi)容,再一次頁(yè)片滑動(dòng)才會(huì)切換頁(yè)片。

參見(jiàn):滑動(dòng)折疊

頁(yè)片滑動(dòng)要達(dá)到某個(gè)閥值才會(huì)生效。 http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-07_large_mdpi.png" alt="Gestures-TouchActivities-07" />

滑動(dòng)折疊(Overscroll Collapse)

滑動(dòng)折疊,以顯示更高層級(jí)。

在滾動(dòng)頁(yè)面的頂部或底部使用頁(yè)片滑動(dòng)可以切換到上一級(jí)內(nèi)容。

滑動(dòng)折疊要達(dá)到某個(gè)閥值才會(huì)生效。

http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-08_large_mdpi.png" alt="Gestures-TouchActivities-08" />

菜單打開(kāi)(Menu Open)

拖拽菜單內(nèi)容或選項(xiàng),內(nèi)容隨即出現(xiàn)。手指抬起時(shí),被選中項(xiàng)高亮顯示。

菜單通過(guò)觸擊出現(xiàn)。

菜單打開(kāi)的動(dòng)作與拖拽動(dòng)作(drag)配合使用。

http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-09_large_mdpi.png" alt="Gestures-TouchActivities-09" />

傾斜(Tilt)

傾斜 3D 內(nèi)容使之前進(jìn)或后退。

在地圖之類的應(yīng)用中,其他的兩指操作手勢(shì)(如捏放或旋轉(zhuǎn))會(huì)形成兩指的縮放。

傾斜與拖拽動(dòng)作(drag)配合使用。

http://wiki.jikexueyuan.com/project/material-design/images/Patterns-Gestures-TouchActivities-10_large_mdpi.png" alt="Gestures-TouchActivities-10" />

原文:Gestures 翻譯:Jingsha 校對(duì):cxytomo

上一篇:文本框