安卓界面导航初识 #2005

horizon13th · 2017-08-05T03:23:11Z

resolve #1896

sumimakito · 2017-08-05T14:53:16Z

@sqrthree 校对认领~

linhe0x0 · 2017-08-05T14:53:19Z

@sumimakito 好的呢 🍺

sumimakito

校对完成，仍有许多可以讨论的地方，译者也辛苦啦。

sumimakito · 2017-08-05T14:56:58Z

TODO/a-primer-on-android-navigation.md

 > * 校对者：

-# A Primer on Android navigation
+# 安卓界面导航初识


因中文有多个译名，建议 Android 保持不译。建议性修改

sumimakito · 2017-08-05T15:18:18Z

TODO/a-primer-on-android-navigation.md


-As soon as you link two screens together in an app, you have navigation. That link—whatever it may be—is the vehicle that carries users between those screens. And although creating navigation is relatively simple, creating the *right* navigation for your users isn’t always straightforward. In this post we’ll take a look at some of the most common navigation patterns used on Android, how they impact system-level navigation, and how to mix and match patterns to suit your interface and your users.
+当你连接 app 中的两个不同页面，就产生了导航行为。跳转链接（不论跳到哪儿）便是页面间传递用户的媒介。新建一个导航相对容易，但想要构建一个**正确**的导航并不总是那么简单。这篇博文里，我们探讨一下安卓系统下最常见的导航模式，看看它们是怎样影响系统布局，怎样才能更好的使用在你的界面中与用户契合。


当应用中的两个页面之间产生联系时，导航便由此而生。不管怎样，这种联系都会引领用户穿梭于他们想去的页面之间。创造导航相对容易，但想要把它做好并不总是那么简单。这篇博文里，我们将探讨一下 Android 下最常见的导航模式，看看它们怎样影响系统级的导航，以及如何为你的应用界面及用户量身打造导航。

sumimakito · 2017-08-05T15:19:06Z

TODO/a-primer-on-android-navigation.md


-> Any vehicle someone uses to move between scenes in your interface — that’s navigation
+> 导航是什么？界面中任何页面跳转的媒介都可称作导航


引领用户穿梭于页面之间的媒介 —— 这便是导航

sumimakito · 2017-08-05T15:20:38Z

TODO/a-primer-on-android-navigation.md


-Before digging into common navigation patterns, it’s worth stepping back and finding a starting point for thinking about navigation in your app.
+在深挖导航模式前，让我们先退后一步回到起点，做一个小练习：回想一下你的 app 中的导航。


在深入探索导航模式前，让我们先退后一步回到起点，回想一下在你应用中所使用的导航。

sumimakito · 2017-08-05T15:22:38Z

TODO/a-primer-on-android-navigation.md


-The Material Design spec has some [great guidance](https://material.io/guidelines/patterns/navigation.html#navigation-defining-your-navigation) on how to approach defining navigation structures, but for the purposes of this post we can boil everything down to two simple points:
+在 Material Design 网站中有许多 [优秀设计规范](https://material.io/guidelines/patterns/navigation.html#navigation-defining-your-navigation) 介绍了如何着手定义导航结构。但本文中我们把所有的理论归结为简单的两点：


在 Material Design 网站中有许多介绍了如何着手定义导航结构的优秀设计指引。微调语序

sumimakito · 2017-08-05T16:53:40Z

TODO/a-primer-on-android-navigation.md


-Throughout this primer we’ve seen examples of apps that successfully implement each of the various explicit navigation components. Many of these examples also succeed in combining navigation patterns to form a structure that makes sense for users. To wrap up, let’s review a couple of those examples with an eye toward mixing and matching.
+尽管在这份初学者指南中，我们主要分析了使用单个导航组件的成功案例。实际上，这些应用在组合运用多类导航时，仍然表现出色，构建了合理的用户行为框架。在文章结尾，我们来看看几个混搭实例。


实际上，这些应用在组合运用多类导航时仍然表现出色，形成了一个便于用户使用的导航框架。

sumimakito · 2017-08-05T16:55:37Z

TODO/a-primer-on-android-navigation.md


-*📚 Refer specifically to back vs up behavior in the Material Spec *[*here*](https://material.io/guidelines/patterns/navigation.html#navigation-up-back-buttons)*.*
+*📚更多关于 后退键 vs 返回键 用户行为探讨，尽在 *[*Material Spec*](https://material.io/guidelines/patterns/navigation.html#navigation-up-back-buttons)*。*


📚 更多有关后退键 vs 返回键行为的讨论，可在 Material 规范中的此处找到。

sumimakito · 2017-08-05T16:58:18Z

TODO/a-primer-on-android-navigation.md

+
+- **返回键**存在于系统底部导航栏。它的导航作用是沿时间顺序后退，而非应用页面的层级关系，哪怕前一个时间节点是在其它应用中。它还用于关闭临时页面元素，比如对话框，底部表单等层叠面板。
+
+- **关闭键**通常用于关闭界面临时层，或者放弃修改[全屏对话框](https://material.io/guidelines/components/dialogs.html#dialogs-full-screen-dialogs)。例如 Google 日历事件详情页（下图）。全屏打开日历事件详情属于更清楚的临时页，使用关闭键。Google 邮箱应用（下图）中，从收件箱到邮件正文的渐进效果显示，邮件正文是收件箱页面的叠加层，因此使用关闭键较合适。 而 Gmail 应用中（下图）邮件正文是作为一个独立层存在于应用中的，因此使用返回键。


关闭键通常用于关闭界面临时层，或者放弃修改全屏对话框。例如 Google 日历的事件详情页（下图），全屏日历事件详情页面的临时特性更是明显。Google 邮箱应用（下图）中，从收件箱到邮件正文的渐进效果显示，邮件正文是收件箱页面的叠加层，因此使用关闭键较合适。而 Gmail 应用中（下图）邮件正文是作为一个独立层存在于应用中的，因此使用返回键较合适。

sumimakito · 2017-08-05T17:26:23Z

TODO/a-primer-on-android-navigation.md


 ![](https://cdn-images-1.medium.com/max/2000/1*VBBwhx66_hRZApzdLzVrJA.png)

-The back, up, and close buttons are all important to navigating an Android UI, but are often misunderstood. The three buttons actually have pretty simple behavior from a UX perspective, so remembering the following rules should help get you out of any perplexing situation.
+返回键，向上键，关闭键这三个按键在安卓用户界面里都非常重要，但却常常被理解错误。实际上，从用户体验的角度，三个按钮都很简单，只要熟记下面的几条规则，保证再也不会陷入困惑。


返回键，向上键，关闭键这三个按键在 Android 用户界面里都非常重要，但却常常被理解错误。实际上，从用户体验的角度，三个按钮都很简单，只要熟记下面的几条规则，保证你再也不会陷入困惑。

sumimakito · 2017-08-05T17:27:07Z

TODO/a-primer-on-android-navigation.md


-There’s no hard rule for creating history via in-context navigation. Whether history is created relies entirely on what kind of in-context navigation the app uses and where the user is taken. In cases where it’s not clear exactly what kind of history should be created, it’s good to know what the up and back buttons do in general.
+对于上下文导航，并没有对访问记录的硬性规定。历史记录的创建与否完全取决于使用什么形式的上下文导航，还有用户通过导航要去哪里。为了以防万一，在某些情况里应用创建什么类型的历史记录并不明确，设计者最好了解下，在通常情况点击返回键和向上键设置会产生什么操作。


对于上下文导航，并没有对访问记录的硬性规定。访问记录的创建与否完全取决于使用什么形式的上下文导航，还有用户通过导航要去哪里。为了以防万一，在某些情况里应用创建什么类型的访问记录并不明确，设计者最好了解一下，在通常情况点击返回键和向上键会产生什么操作。

laiyun90 · 2017-08-07T03:37:52Z

校对认领 @sqrthree

linhe0x0 · 2017-08-07T03:37:55Z

@laiyun90 妥妥哒 🍻

laiyun90

校对完毕~ 前一位同学校对得很认真了只有一些些微小的建议

laiyun90 · 2017-08-07T05:38:29Z

TODO/a-primer-on-android-navigation.md


-Tabs are great for filtering, segmenting, or providing depth to related pieces of content. Unrelated pieces of content, or content with its own deep hierarchy may be better served by using other navigation patterns.
+标签页是很好的页面内容过滤，分段，分级工具。但是对于毫无关联的内容，或是层级化结构内容，也许其它的导航模式会更合适。


【标签页是很好的页面内容过滤，分段，分级工具。】=>【标签页是很好的页面内容过滤、分段、分级工具。】

laiyun90 · 2017-08-07T06:10:58Z

TODO/a-primer-on-android-navigation.md


-Google+ *(above, center)* uses tabs to segment Collections, a single content type that leads to very heterogeneous content deeper in the app.
+Google+ 应用（中）使用标签页将收藏列表分块，每个类别下都是深层异构的内容。


【每个类别下都是深层异构的内容。】 => 【这是一种单一的内容类型，使应用更深入地整合复杂的内容。】

laiyun90 · 2017-08-07T10:45:21Z

TODO/a-primer-on-android-navigation.md


-Also be aware of visibility — the drawer can be good for reducing visibility or compacting navigation away from the main content area, but that can also be a drawback depending on how the destinations in your app need to be presented and accessed.
+还有需要注意的一点是界面的可见度。侧边栏可以很好的帮助应用减少可见度，压缩与主要内容无关的导航区。但是，这也可能成为应用的不足，取决于导航栏的链接获取展示的具体场景。


【可见度】=> 【可视性】

laiyun90 · 2017-08-07T10:45:58Z

TODO/a-primer-on-android-navigation.md


-Also be aware of visibility — the drawer can be good for reducing visibility or compacting navigation away from the main content area, but that can also be a drawback depending on how the destinations in your app need to be presented and accessed.
+还有需要注意的一点是界面的可见度。侧边栏可以很好的帮助应用减少可见度，压缩与主要内容无关的导航区。但是，这也可能成为应用的不足，取决于导航栏的链接获取展示的具体场景。


【取决于导航栏的链接获取展示的具体场景。】=>【取决于导航栏的目标落地页是如何被呈现和访问的。】

laiyun90 · 2017-08-08T02:18:40Z

@sqrthree @horizon13th 校对完毕~

horizon13th · 2017-08-09T14:26:15Z

根据校对意见修改

horizon13th · 2017-08-09T14:28:06Z

@sumimakito @laiyun90 感谢校对的同学～已经修改文章

linhe0x0 · 2017-08-11T12:43:57Z

TODO/a-primer-on-android-navigation.md

@@ -3,241 +3,241 @@
 > * 原文作者：[Liam Spradlin](https://medium.com/@LiamSpradlin)
 > * 译文出自：[掘金翻译计划](https://github.com/xitu/gold-miner)
 > * 本文永久链接：[https://github.com/xitu/gold-miner/blob/master/TODO/a-primer-on-android-navigation.md](https://github.com/xitu/gold-miner/blob/master/TODO/a-primer-on-android-navigation.md)
-> * 译者：
+> * 译者：[horizon13th](https://github.com/horizon13th)
 > * 校对者：


校对者信息记得加一下哈。

linhe0x0 · 2017-08-11T12:46:06Z

TODO/a-primer-on-android-navigation.md


-In-context navigation is comprised of any navigational interaction outside of the components described above. This includes things like buttons, tiles, cards, and anything else that takes the user elsewhere in an app.
+上下文导航由所有非上述导航控件间的交互组成。这些控件包括像按钮，方块，卡片，还有其它应用内跳转的内容。


『按钮，方块，卡片』=>『按钮、方块、卡片』

linhe0x0 · 2017-08-11T12:47:23Z

TODO/a-primer-on-android-navigation.md


 ---

-### ↖️ Up, back, and close buttons
+### ↖️ Up, back, and close buttons 向上键，返回键，关闭键


英文没有删除

这里使用顿号更合适吧。

linhe0x0 · 2017-08-11T12:48:51Z

TODO/a-primer-on-android-navigation.md


-### 🔄 Combining patterns
+### 🔄 Combining patterns 混合模式


如果要保留英文的话，统一使用 中文翻译（英文关键词）

linhe0x0 · 2017-08-11T12:49:25Z

TODO/a-primer-on-android-navigation.md

@@ -247,39 +247,37 @@ Throughout this primer we’ve seen examples of apps that successfully implement

 Google+

-Maybe the most obvious example is Google+ *(above)*, which mixes all of the patterns we’ve discussed — tabs, a nav drawer, bottom nav, and in-context navigation.
+可能最显而易见的实例便是 Google+（上图），混合上述所有元素 —— 标签页，底部导航，上下文导航。


『标签页，底部导航，上下文导航。』=>『标签页、底部导航、上下文导航。』

horizon13th · 2017-08-11T16:02:31Z

@sqrthree 谢谢校对已修改

linhe0x0 · 2017-08-14T07:00:41Z

@horizon13th 已经 merge 啦~ 快快麻溜发布到掘金专栏然后给我发下链接，方便及时添加积分哟。

horizon13th · 2017-08-15T13:42:33Z

@sqrthree
https://juejin.im/post/5992f8c1518825242238b77b
已经发布啦～求积分求礼物～

Translation finished.

7c15dfa

linhe0x0 added the 校对认领 label Aug 5, 2017

linhe0x0 mentioned this pull request Aug 5, 2017

安卓界面导航初识 #1896

Closed

linhe0x0 self-requested a review August 5, 2017 06:38

linhe0x0 added the Android label Aug 5, 2017

linhe0x0 added the 正在校对 label Aug 5, 2017

sumimakito reviewed Aug 5, 2017

View reviewed changes

linhe0x0 removed the 校对认领 label Aug 7, 2017

laiyun90 suggested changes Aug 8, 2017

View reviewed changes

modified based on comments.

9f2c554

linhe0x0 requested changes Aug 11, 2017

View reviewed changes

second revise.

d1c9b05

linhe0x0 approved these changes Aug 14, 2017

View reviewed changes

linhe0x0 merged commit 535df2d into xitu:master Aug 14, 2017

linhe0x0 added 翻译完成 and removed 正在校对 labels Aug 14, 2017

horizon13th deleted the translate-2 branch August 14, 2017 13:44

cdadar pushed a commit to cdadar/gold-miner that referenced this pull request Dec 8, 2017

安卓界面导航初识 (xitu#2005)

a1b8145

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

安卓界面导航初识 #2005

安卓界面导航初识 #2005

horizon13th commented Aug 5, 2017 •

edited by linhe0x0

Loading

sumimakito commented Aug 5, 2017

linhe0x0 commented Aug 5, 2017

sumimakito left a comment

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

sumimakito Aug 5, 2017

laiyun90 commented Aug 7, 2017

linhe0x0 commented Aug 7, 2017

laiyun90 left a comment

laiyun90 Aug 7, 2017

laiyun90 Aug 7, 2017

laiyun90 Aug 7, 2017

laiyun90 Aug 7, 2017

laiyun90 commented Aug 8, 2017

horizon13th commented Aug 9, 2017

horizon13th commented Aug 9, 2017

linhe0x0 Aug 11, 2017

linhe0x0 Aug 11, 2017

linhe0x0 Aug 11, 2017

linhe0x0 Aug 11, 2017

linhe0x0 Aug 11, 2017

linhe0x0 Aug 11, 2017

horizon13th commented Aug 11, 2017

linhe0x0 commented Aug 14, 2017

horizon13th commented Aug 15, 2017 •

edited

Loading


		As soon as you link two screens together in an app, you have navigation. That link—whatever it may be—is the vehicle that carries users between those screens. And although creating navigation is relatively simple, creating the right navigation for your users isn’t always straightforward. In this post we’ll take a look at some of the most common navigation patterns used on Android, how they impact system-level navigation, and how to mix and match patterns to suit your interface and your users.
		当你连接 app 中的两个不同页面，就产生了导航行为。跳转链接（不论跳到哪儿）便是页面间传递用户的媒介。新建一个导航相对容易，但想要构建一个正确的导航并不总是那么简单。这篇博文里，我们探讨一下安卓系统下最常见的导航模式，看看它们是怎样影响系统布局，怎样才能更好的使用在你的界面中与用户契合。


		> Any vehicle someone uses to move between scenes in your interface — that’s navigation
		> 导航是什么？界面中任何页面跳转的媒介都可称作导航


		Before digging into common navigation patterns, it’s worth stepping back and finding a starting point for thinking about navigation in your app.
		在深挖导航模式前，让我们先退后一步回到起点，做一个小练习：回想一下你的 app 中的导航。


		The Material Design spec has some [great guidance](https://material.io/guidelines/patterns/navigation.html#navigation-defining-your-navigation) on how to approach defining navigation structures, but for the purposes of this post we can boil everything down to two simple points:
		在 Material Design 网站中有许多 [优秀设计规范](https://material.io/guidelines/patterns/navigation.html#navigation-defining-your-navigation) 介绍了如何着手定义导航结构。但本文中我们把所有的理论归结为简单的两点：


		Throughout this primer we’ve seen examples of apps that successfully implement each of the various explicit navigation components. Many of these examples also succeed in combining navigation patterns to form a structure that makes sense for users. To wrap up, let’s review a couple of those examples with an eye toward mixing and matching.
		尽管在这份初学者指南中，我们主要分析了使用单个导航组件的成功案例。实际上，这些应用在组合运用多类导航时，仍然表现出色，构建了合理的用户行为框架。在文章结尾，我们来看看几个混搭实例。


		📚 Refer specifically to back vs up behavior in the Material Spec [here](https://material.io/guidelines/patterns/navigation.html#navigation-up-back-buttons).
		📚更多关于后退键 vs 返回键用户行为探讨，尽在 [Material Spec](https://material.io/guidelines/patterns/navigation.html#navigation-up-back-buttons)。


		- 返回键存在于系统底部导航栏。它的导航作用是沿时间顺序后退，而非应用页面的层级关系，哪怕前一个时间节点是在其它应用中。它还用于关闭临时页面元素，比如对话框，底部表单等层叠面板。

		- 关闭键通常用于关闭界面临时层，或者放弃修改[全屏对话框](https://material.io/guidelines/components/dialogs.html#dialogs-full-screen-dialogs)。例如 Google 日历事件详情页（下图）。全屏打开日历事件详情属于更清楚的临时页，使用关闭键。Google 邮箱应用（下图）中，从收件箱到邮件正文的渐进效果显示，邮件正文是收件箱页面的叠加层，因此使用关闭键较合适。而 Gmail 应用中（下图）邮件正文是作为一个独立层存在于应用中的，因此使用返回键。


		There’s no hard rule for creating history via in-context navigation. Whether history is created relies entirely on what kind of in-context navigation the app uses and where the user is taken. In cases where it’s not clear exactly what kind of history should be created, it’s good to know what the up and back buttons do in general.
		对于上下文导航，并没有对访问记录的硬性规定。历史记录的创建与否完全取决于使用什么形式的上下文导航，还有用户通过导航要去哪里。为了以防万一，在某些情况里应用创建什么类型的历史记录并不明确，设计者最好了解下，在通常情况点击返回键和向上键设置会产生什么操作。


		Tabs are great for filtering, segmenting, or providing depth to related pieces of content. Unrelated pieces of content, or content with its own deep hierarchy may be better served by using other navigation patterns.
		标签页是很好的页面内容过滤，分段，分级工具。但是对于毫无关联的内容，或是层级化结构内容，也许其它的导航模式会更合适。


		Google+ (above, center) uses tabs to segment Collections, a single content type that leads to very heterogeneous content deeper in the app.
		Google+ 应用（中）使用标签页将收藏列表分块，每个类别下都是深层异构的内容。


		Also be aware of visibility — the drawer can be good for reducing visibility or compacting navigation away from the main content area, but that can also be a drawback depending on how the destinations in your app need to be presented and accessed.
		还有需要注意的一点是界面的可见度。侧边栏可以很好的帮助应用减少可见度，压缩与主要内容无关的导航区。但是，这也可能成为应用的不足，取决于导航栏的链接获取展示的具体场景。


		In-context navigation is comprised of any navigational interaction outside of the components described above. This includes things like buttons, tiles, cards, and anything else that takes the user elsewhere in an app.
		上下文导航由所有非上述导航控件间的交互组成。这些控件包括像按钮，方块，卡片，还有其它应用内跳转的内容。


		### 🔄 Combining patterns
		### 🔄 Combining patterns 混合模式

安卓界面导航初识 #2005

安卓界面导航初识 #2005

Conversation

horizon13th commented Aug 5, 2017 • edited by linhe0x0 Loading

sumimakito commented Aug 5, 2017

linhe0x0 commented Aug 5, 2017

sumimakito left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

laiyun90 commented Aug 7, 2017

linhe0x0 commented Aug 7, 2017

laiyun90 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

laiyun90 commented Aug 8, 2017

horizon13th commented Aug 9, 2017

horizon13th commented Aug 9, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

horizon13th commented Aug 11, 2017

linhe0x0 commented Aug 14, 2017

horizon13th commented Aug 15, 2017 • edited Loading

horizon13th commented Aug 5, 2017 •

edited by linhe0x0

Loading

horizon13th commented Aug 15, 2017 •

edited

Loading