出自UXGuide.net

工具栏

Toolbars

If your application provides a number of actions users can take in the current context, it might be appropriate to provide a toolbar. A toolbar appears at the bottom edge of the screen and contains buttons that perform actions related to objects in the current view. A toolbar should not be used to switch among different modes in an application; if you need to do this, use a tab bar instead (see “Tab Bars” for more information).

如果你的应用程序允许用户对当前的页面进行一系列的操作，那么最好是为用户提供一个工具栏。工具栏出现于屏幕的最下方，提供可以对当前页面对象进行的操作。工具栏不应当用于转换程序的各种模式。如果你需要模式的转换，可以使用标签栏（详情参见“标签栏”）。

For example, when users view a message in Mail, the application provides a toolbar that contains items for deleting, replying to, and moving the message, in addition to checking for new mail and composing a new message. In this way, users can stay within the message-viewing context and still have access to the commands they need to manage their email. Figure 6-8 shows what this looks like.

举例来说，当用户在邮件系统中阅读一条消息时，应用程序就会提供一个工具栏，里面包含了一系列的按钮，用于删除、回复和移动该消息，还有查看新邮件和撰写新消息等。通过这种方式，用户可以一直停留在消息查看页面，于此同时进行和管理邮件相关的操作。如图图6-8所示。

Figure 6-8  A toolbar provides functionality within the context of a task
图6-8 工具栏为当前的任务提供了多种功能。

工具栏内容

Toolbar Contents

The toolbar displays toolbar items equally spaced across the width of the toolbar. It’s a good idea to constrain the number of items you display in a toolbar, so users can easily tap the one they want. Remember that the hit-region of a user interface element is recommended to be 44 x 44 pixels, so providing five or fewer toolbar items is reasonable. Figure 6-9 shows an example of appropriate spacing of toolbar items in a toolbar.

工具栏中的按钮以均匀方式水平分布。对工具栏中的按钮数目进行限制可以使用户更容易点击到他们需要的按钮。推荐的界面元素点击域大小为44×44像素，因此少于或等于五个的工具栏按钮是合理的。图6-9显示了一个工具栏中合理分布按钮的例子。

Figure 6-9  Appropriately spaced toolbar items
图6-9 合理分配的工具栏按钮

The items in both Figure 6-8 and Figure 6-9 do not include a bezel. In iPhone OS this style is called the plain style. (For an example of the bordered style, look at the buttons in Figure 6-7.) Although you can use either the bordered or plain style for buttons in a toolbar, you should not mix both styles in the same toolbar.

在图6-8和图6-9里的按钮都没有斜面。在iPhone OS中这种风格被称为平整风格。（描边风格参见图6-7（第70页）中的按钮）虽然可以在工具栏中同时使用描边和平整风格，但这种情况要避免发生在同一个工具栏中。

You can design your own icons for use in toolbar buttons, or you can take advantage of the predefined buttons iPhone OS provides. (See “Standard Buttons for Use in Toolbars and Navigation Bars” for more information on the buttons available to you.) If you choose to create custom toolbar buttons, be sure to make them as similar in size as possible to achieve a balanced, attractive appearance.

你可以为工具栏上的按钮设计特有的图标，也可以利用iPhone OS系统中已经定义好了的按钮。（参见“工具栏和导航栏中的标准按钮”（第116页）以获得更多你可以利用的按钮。）如果你选择创建自定义的工具栏按钮，务必要使他们的大小保持一致以形成外观上的平衡和美观。

工具栏的尺寸和颜色

Toolbar Size and Color

Changing the device orientation from portrait to landscape can change the height of the toolbar automatically (you should not specify the height programmatically). The thinner toolbar available in landscape orientation leaves more room for your screen contents. Be aware of the difference in heights when you design icons for toolbar buttons and when you design the layout of your screens.

将设备从纵向改变到横向的同时会自动改变工具栏的高度（你不应该特别指定一个高度）。窄的工具栏可以在横向布局的时候为你的内容留出更多空间。在设计工具栏上的图标或屏幕的布局时要注意高度的不同。

You can specify the color and translucency of a toolbar to coordinate with the overall look of your application and with the other bars in it (that is, navigation bars, tab bars, and the status bar). You can use a custom color or choose one of the standard colors:

你可以为你的工具栏指定颜色和透明度来使它的整体外观跟你的应用程序以及其他栏（即导航栏，标签栏，状态栏）一致。你可以使用自定义颜色或者选择一种标准颜色：

• Blue (the default color)
  蓝色（默认颜色）
• Black
  黑色

If it complements the look of your application, you can add translucency to the toolbar. When you use a translucent toolbar, the screen gives the impression of having a larger visible area, which is especially advantageous in landscape orientation.

你可以在工具栏中加入半透明的效果，前提是这样做能优化你的应用程序的外观。当你使用半透明的工具栏时，屏幕就有了更大的可视化区域，尤其是在横向使用的时候具有很大优势。

Strive for consistency in the appearance of toolbars and other bars in your application. If you use a translucent toolbar, for example, don’t combine it with an opaque navigation bar. And, avoid changing the color or translucency of the toolbar in different screens in the same orientation.

尽量保持你工具栏的外观和你应用程序的其他栏的一致性。例如，如果你使用半透明的工具栏，就不要把它融入不透明的导航栏中。并且要避免在同一个方向（横向或纵向）的不同页面中改变工具栏的颜色或透明度。