watchOS 2 第一章:Hello, Apple Watch!

这本书的笔记


watchOS 2 第一章:Hello, Apple Watch!_第1张图片
Paste_Image.png

这是本书第一章,非常简单的。
打开开始项目。run:

watchOS 2 第一章:Hello, Apple Watch!_第2张图片
Paste_Image.png

创建Watch Kit App:

watchOS 2 第一章:Hello, Apple Watch!_第3张图片
Paste_Image.png
watchOS 2 第一章:Hello, Apple Watch!_第4张图片
Paste_Image.png
watchOS 2 第一章:Hello, Apple Watch!_第5张图片
Paste_Image.png

选择


Paste_Image.png

运行:

watchOS 2 第一章:Hello, Apple Watch!_第6张图片
Paste_Image.png

看下项目的工程目录:
1.HelloAppleWatch WatchKit App目录下有个Interface.storyboard。它是用来设计我们的app的。
2.HelloAppleWatch WatchKit App Extension中有个InterfaceController,它类似于iOS中UIViewController


watchOS 2 第一章:Hello, Apple Watch!_第7张图片
Paste_Image.png

创建Watch app类似于创建iOS app,在sb中创建好UI,然后把UI object链接到Controller
我们先放个label上去:

watchOS 2 第一章:Hello, Apple Watch!_第8张图片
Paste_Image.png

把label的属性设置为下图,watch app的布局方式和iOS不同,不能随便拖动label的位置,通过设置Alginment设置它的位置:


watchOS 2 第一章:Hello, Apple Watch!_第9张图片
Paste_Image.png

label的size根据它的内容变化:

Paste_Image.png

Setting label text in code

把label链接到Controller:

watchOS 2 第一章:Hello, Apple Watch!_第10张图片
Paste_Image.png

用代码在willActivate设置label的内容:


watchOS 2 第一章:Hello, Apple Watch!_第11张图片
Paste_Image.png
watchOS 2 第一章:Hello, Apple Watch!_第12张图片
Paste_Image.png

Apple's color emoji font

接下来我们用emoji来把文字替换掉。
选择Hello,然后按control + command + 空格,选择你想要得表情,重复下面操作:

watchOS 2 第一章:Hello, Apple Watch!_第13张图片
Paste_Image.png
watchOS 2 第一章:Hello, Apple Watch!_第14张图片
Paste_Image.png
watchOS 2 第一章:Hello, Apple Watch!_第15张图片
Paste_Image.png

Casting emoji fortunes

Sharing EmojiData.swift between iPhone and Watch apps

把想共用的文件:

watchOS 2 第一章:Hello, Apple Watch!_第16张图片
Paste_Image.png

Creating a random emoji fortune

1.在InterfaceController中添加:

watchOS 2 第一章:Hello, Apple Watch!_第17张图片
Paste_Image.png

2.在InterfaceController中willActivate()加入下面的代码:

watchOS 2 第一章:Hello, Apple Watch!_第18张图片
Paste_Image.png

run:

watchOS 2 第一章:Hello, Apple Watch!_第19张图片
Paste_Image.png

Tell me another one...

Replacing the label with a button

打开Interface.storyboard删除label,改成拖个button进去,把它的Alignment改成下面那样,还有button在Height,改成是watch屏幕的高度的0.9


watchOS 2 第一章:Hello, Apple Watch!_第20张图片
Paste_Image.png

然后添加下面的代码:

watchOS 2 第一章:Hello, Apple Watch!_第21张图片
Paste_Image.png

Dressing up your app

接下来为应用添加背景。先添加资源:
Devices那里注意选择Apple Watch


watchOS 2 第一章:Hello, Apple Watch!_第22张图片
Paste_Image.png
watchOS 2 第一章:Hello, Apple Watch!_第23张图片
Paste_Image.png

你可能感兴趣的:(watchOS 2 第一章:Hello, Apple Watch!)