实现app的开始是定义storyboard场景。每个场景定义了app的一部分界面。可以为不同的尺寸自定义场景。
组装storyboard界面
WatchKit app和iOS app的布局模式不同。组装WatchKit app界面时,并不是把元素在一个空间里任意层次结构的摆放,而是把元素添加到场景,Xcode会管理他们,一行一行的竖直堆在上面。运行时,Apple Watch会根据可用的空间布局他们。
虽然Xcode处理了整体布局,WatchKit也提供了在场景中微调元素的方式。调整最多的是元素的大小和位置。可以改变元素的位置也可以改变水平竖直对齐方式。大小的话可以指定一个宽度或者让它根据可用的空间自己计算宽度。
Group对象提供了另外一种布局界面的方法。Group元素是其他元素的容器,可以在group中水平或竖直布局元素。可以group嵌套group然后用间距来改变他们的大小和位置。Group没有默认的可视图像,但是可以配置它的背景颜色或者图片。
下图展示了一个storyboard中的布局。前三个元素是标签,他们有不同的对齐方式。标签下面是一个包含两个图片水平布局的group对象。这个界面也包含了一个分割线还有一个按钮在group对象下面。
在Xcode中创建界面时,尽量让元素在有可用空间时自己调整位置。界面应该适应Apple Watch不同的尺寸。让系统自动布局可以减少为每种尺寸写布局的工作量。
适应不同的尺寸
Xcode支持为不同尺寸的Apple Watch自定义界面。默认情况下在storyboard中改变的尺寸会影响所有的尺寸,但是也可以在storyboard中为特定的尺寸定义。比如,可能需要在不同的尺寸上微调元素的大小或者指定不同的图片。
要定义指定的设备尺寸,点击属性旁边的(+)按钮然后选择特定的尺寸。对特定尺寸的更改只影响这个尺寸。下图显示了在Apple Watch 42mm上文字的缩放。
不应该让用户在不同的尺寸上感觉到明显的差异,尽量缩小不同尺寸设备上的差异。虽然可以每种尺寸单独实现一套界面,但是不推荐这样做。尽量所有尺寸使用一套界面。
要查看不同尺寸上的效果的话,可以使用storyboard底部的按钮来切换设备尺寸。storyboard默认显示通用尺寸。在通用尺寸下的更改会影响所有尺寸。如果切换到特定的模式下, 这时候的改变只影响那个尺寸。
运行时更新界面
在运行时,界面控制器可以对storyboard场景对应的对象做下面的操作:
- 设置或更新数据的值
- 改变界面的样子,如果对应的对象支持的话
- 改变对象的大小
- 改变对象的透明度
- 显示或隐藏一个对象
不能添加新的对象或者改变已有对象的顺序。虽然不能移除对象,但是可以隐藏它,这样可以临时不显示在界面上。当一个对象隐藏时,其他对象会占据这个对象以前占据的空间。如果要隐藏对象但是要保留位置,可以设置对象的透明度为0.
设置App的主题颜色
每个WatchKit app都有一个相关的主题颜色,会影响下面的UI元素:
- status bar上的标题
- short-look通知的app名字
app的主题颜色存储在storyboard的全局属性里。要访问这个属性的话, 选择storyboard然后选择File inspector。选择弹出菜单中的颜色,或者使用颜色选择器选择指定的颜色。
为界面国际化
WatchKit app的storyboard默认就启用了国际化。这会导致任何加到storyboard中的字符串会自动加到Localizable.strings文件中。只需要为特定语言翻译文件中的字符串,然后在发布的app中引用他们。当在运行时创建storyboard中的场景时,Xcode会加入对应的本地化后的字符串。
注意像label喝controls这类的UI控件有足够的空间显示。相对于把多个按钮放在同一行,把他们放在多行这样他们有足够的空间显示。
对于用程序设置的文字和图片,使用iOS和OS Xapp中同样的方法来国际化。
- 使用NSLocalizedString来加载字符串资源
- 使用NSNumberFormatter对象来格式化数字
- 使用NSDateFormatter对象来格式化时间。
使用WatchKit extension时,NSLocal对象会返回Apple Watch中配置的地点信息。使用这个类来获得用户选择的语言,以及备选语言,以及地点相关的信息。