この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
WKInterfaceButton
概要
WKInterfaceButtonオブジェクトは、画面上でタップ可能な領域(ボタン)を表します。 ボタンに表示するテキストや色・画像を設定することができます。
特性
ボタンは以下の特性を持ちます。
- カスタマイズ可能な背景を持つ
- 他の要素を区別するための丸角を持つ
- ラベルやグループオブジェクトを含めることができる
また、Apple はボタンを使用するときは以下のことを推奨しています。
- 横幅はスクリーンいっぱいになるように作成してください ボタンを横に並べなければいけない場合でも、並べられるボタンは最大 2 つです
- 可能な限りボタンの高さは統一してください
- デフォルトのcorner radiusを使用してください 標準のボタンのcorner radiusは6 ポイントです
作ってみる
実行画面
フォントスタイル
OS で用意されているWKInterfaceButtonのフォントスタイルは以下の9 種類です。 デフォルトのフォントスタイルはRegularです。
それぞれの見た目はこのようになっています。
ボタンタップ時のアクションを設定する
タップされた時のメソッドの登録はStoryboard 上からしかできないようです。 WatchKit では、UIControlのaddTargetに相当するメソッドは用意されていません。
WKInterfaceButton の定義
WKInterfaceButton は以下のように定義されています。
@availability(iOS, introduced=8.2)
class WKInterfaceButton : WKInterfaceObject {
func setTitle(title: String?)
func setAttributedTitle(attributedTitle: NSAttributedString?)
func setBackgroundColor(color: UIColor?)
func setBackgroundImage(image: UIImage?)
func setBackgroundImageData(imageData: NSData?)
func setBackgroundImageNamed(imageName: String?)
func setEnabled(enabled: Bool)
}
ボタンのタイトルと背景色/画像を設定できます。 また Enabled の切り替えもできるようです。
それでは実際に背景画像を設定してみましょう。
背景画像の設定
設定する画像はこちら。 ファイル名はmosaic@2x.pngとしています。
サンプルコード
@IBOutlet weak var button: WKInterfaceButton!
override func awakeWithContext(context: AnyObject?) {
super.awakeWithContext(context)
self.button.setBackgroundImageNamed("mosaic")
}
実行画面
背景画像によってボタンの高さが動的に変わるのでしょうか。 横幅は画面にフィットするようでした。 ここらへんの挙動はよくわかりませんでした。 ごめんなさい。
まとめ
WKInterfaceButtonはボタンを作成するために利用します。 ボタンタップ時のアクションは Storyboard から設定しましょう。