【Apple Watchアプリ】ボタン内の文字の先頭に画像を入れる方法【WatchKit】

公開日: : 最終更新日:2015/03/30 iOSアプリ開発

20150327-131839.jpg

Apple Watch向けのアプリを作るためのフレームワーク「WatchKit」。そのWatchKitでボタン内に画像と文字を埋め込む方法について紹介したいと思います。

    

ボタンのContentをGroupに切り替える

20150327-133118.jpg

WatchKitのボタン(WKInterfaceButton)にはContentという設定があり、通常はTextになっていますが、これをGroupに切り替えることでボタン内にGroupを入れることができるようになります。

    

グループのHeightを設定する

20150327-133039.jpg

一番外側のグループ(WKInterfaceGroup)では、SizeのHeightをFixedの44くらいに設定しておきます。これがボタンの高さとなります。

    

Insetsで隙間を空ける

20150327-133319.jpg

あとはイメージ(WKInterfaceImage)とラベル(WKInterfaceLabel)を横に並べます。

イメージの外側にグループを1個置いて、InsetsをCustomにしてRightを設定することで、ラベルとの隙間を空けることができます。

    

手順が分かる動画はコチラ

今回の全手順が分かる動画を作ってみました。詳しい操作についてはこちらを参照して下さい。

    

@akio0911はこう思った。

WatchKitは、iOSアプリで使ってきたUIKitとはかなり勝手が異なりますね。また何か分かったらTIPSとしてブログに書きたいと思います!

    

関連記事

この記事が気に入ったら「いいね!」しよう

follow us in feedly

Feedlyで最新記事を購読

Twitterで更新情報をゲット!

LINEでご感想・ご要望お送りください!
(スマホでLINEを起動 > 友だち追加 > QRコード)

【RxSwift】ストリームのcompletedをつぶす(消し去る)方法

RxSwiftで元々のストリームからcompletedをつぶす

【RxSwift】completedかerrorが流れてきたらsubscribeはdisposeされる

RxSwiftにおいて、completedかerrorが流れて

init(frame:), init(coder:), awakeFromNib, prepareForInterfaceBuilder が呼ばれる条件をまとめてみた

カスタムViewを作った際に呼ばれる初期化系メソッドの条件や順

【WWDC2018】iOSエンジニア的に気になる新機能・新APIまとめ

こんにちは、@akio0911です。 先日開催されたWW

【Swift】Codableで後からキーを追加した場合の挙動

こんにちは、@akio0911です。 SwiftのCod

→もっと見る

PAGE TOP ↑