滑動(dòng)刷新

更新內(nèi)容

在應(yīng)用里有兩種更新內(nèi)容的方法。較好的方法是用sync自動(dòng)更新內(nèi)容。Syncing 能保持內(nèi)容自動(dòng)更新，因?yàn)樗恍枰脩舨僮鳌?/p>

另外一種，手動(dòng)刷新需要用戶通過動(dòng)作或者手勢(shì)啟動(dòng)內(nèi)容更新。手動(dòng)刷新提供同步的同時(shí)保持當(dāng)前的滾動(dòng)位置。例如在Gmail里檢查新郵件。

滑動(dòng)刷新

滑動(dòng)刷新是一個(gè)滑動(dòng)手勢(shì)?？捎迷谄胀斜?，方格列表的開始處和卡片集合的最近內(nèi)容出現(xiàn)的位置（Index 0）。

位置：

典型的，手勢(shì)在內(nèi)容集合的頂部使用。但是它也可以在底部使用（例如，在聊天應(yīng)用）。

用法：

刷新圖標(biāo)僅僅與刷新手勢(shì)或者動(dòng)作一起出現(xiàn)。Syncing不顯示刷新圖標(biāo)。手勢(shì)最要用在動(dòng)態(tài)內(nèi)容在固定的位置，并且頻繁更新的情況。固定的位置也是用戶用手勢(shì)刷新后最可能關(guān)注的位置。

當(dāng)手勢(shì)用在刷新后視圖會(huì)顯著改變的情況下，變化可能不是立即明顯有效。

滑動(dòng)刷新布局
通過一個(gè)垂直方向的滑動(dòng)手勢(shì)刷新視圖的內(nèi)容。

動(dòng)畫，顯示滑動(dòng)刷新

滑動(dòng)刷新不應(yīng)該用在以下的情景：

• 抽屜式的導(dǎo)航欄
• 主屏幕小插件
• Pannable內(nèi)容

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_dont1_mdpi.png" alt="1" />

??錯(cuò)誤

抽屜式導(dǎo)航欄（如果在應(yīng)用中存在）包括導(dǎo)航選項(xiàng)，不是動(dòng)態(tài)內(nèi)容。

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_dont2_mdpi.png" alt="2" />

??錯(cuò)誤

主屏幕小插件應(yīng)該自動(dòng)更新內(nèi)容。

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_dont3_mdpi.png" alt="3" />

??錯(cuò)誤

Pannable內(nèi)容，像地圖，沒有一個(gè)主要的方向或者內(nèi)容起點(diǎn)，用戶能認(rèn)做滑動(dòng)刷新的起點(diǎn)。

刷新圖標(biāo)位置和行為

位置：

刷新圖標(biāo)，當(dāng)下拉停止時(shí)，在刷新內(nèi)容的垂直正中間位置。

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_position1_mdpi.png" alt="postion1" />

??正確

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_position2_mdpi.png" alt="postion2" />

??錯(cuò)誤

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_position3_mdpi.png" alt="postion3" />

??錯(cuò)誤

刷新圖標(biāo)位置靠近刷新內(nèi)容的頂部

準(zhǔn)確的垂直下拉停止位置可以被調(diào)節(jié)以促使和下來的布局和諧。例如，圖標(biāo)可以落在材質(zhì)邊緣或者網(wǎng)格線上，只要它位于刷新內(nèi)容的頂部。

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_position4_mdpi.png" alt="postion4" />

??正確

http://wiki.jikexueyuan.com/project/material-design/images/patterns_swipetorefresh_position5_mdpi.png" alt="postion5" />

??錯(cuò)誤

行為：

刷新圖標(biāo)過渡進(jìn)視圖，圓形 spinner 逐漸增強(qiáng)同時(shí)旋轉(zhuǎn)。

刷新圖標(biāo)保持可見，直到刷新活動(dòng)完成，并且任何新內(nèi)容是可見的，或者用戶從刷新內(nèi)容導(dǎo)航出去。

??正確

保持刷新圖標(biāo)在視圖上直到活動(dòng)完成，并且反饋刷新后的狀態(tài)。

??錯(cuò)誤

滑動(dòng)刷新圖標(biāo)離開屏幕隱藏刷新活動(dòng)的狀態(tài)并且可能意味著刷新活動(dòng)和視圖內(nèi)一個(gè)特定的相關(guān)連，如一個(gè)卡片而不是整個(gè)視圖。

刷新圖標(biāo)過渡

當(dāng)另一個(gè)界面是在內(nèi)容的 material 的前面（在 z-space），刷新圖標(biāo)從界面底下過渡，并且被夾住直到全部可見。

以下情況刷新圖標(biāo)增加大小作為過渡：

• 刷新 material 是在所有其他界面的前面（在z-space）
• 內(nèi)容刷新開始從 app bar 或者菜單擴(kuò)展操作。

刷新內(nèi)容是在所有其他界面之上，在 z－space 空間。

刷新內(nèi)容是另一個(gè)界面在同一個(gè)面上。

刷新內(nèi)容是在z－space里另一個(gè)界面之下。

刷新內(nèi)容通過 app bar 操作。

實(shí)現(xiàn)細(xì)節(jié)

確?；瑒?dòng)刷新手勢(shì)的有意使用，在應(yīng)用開始將要開始刷新之前，刷新圖標(biāo)必須通過一個(gè)閾值。這個(gè)閾值是通過一些狀態(tài)表示：

• 圓圈旋轉(zhuǎn)控件 100% 不透明
• 圓圈控件旋轉(zhuǎn)變慢
• 刷新圖標(biāo)的過渡速率變慢

完成手勢(shì)只要任何一條達(dá)到閾值，并且啟動(dòng)刷新操作。

相反的手勢(shì)通過閾值將取消刷新操作。

原文：Swipe to refresh 翻譯：awong1900 校對(duì)：