Swift転職なら=>【LevTech】
↑クリックして拡大
↑クリックして拡大
↑クリックして拡大
↑クリックして拡大

頭痛が減ったので共有です!

rebuild.fmを応援しています!

HOME > WatchKitでタイマーアプリを作成する

WatchKitでタイマーアプリを作成する。

サンプル画像

簡単なアプリを作成しながらAppleWatchを学んでいきます。前回の記事で大まかな動きは理解できましたので、 つぎはAppleWatchとアプリとの連携をタイマー機能を利用して検証していきます


参考:Apple Watchでカウントダウンアプリを作る

やってみた(AppleWatch上でのタイマー処理)

ひとまず簡単なものを作成してみます。iPhone端末のメインアプリ側との連携をしないで、AppleWatch側だけでタイマー処理設定ー>実行するタイマーです

サンプル画像

StoryBoardに手動でラベル(WKInterfaceLabel)をドラッグして、WatchKit ExtensionのInterfaceController.swiftにIBOutletで関連付けます。(※プログラムから動的にaddSubView追加しようと しましたができませんでした、できないのかな?方法はまだ不明。)

タイマー処理を追加します。


import WatchKit
import Foundation

class InterfaceController: WKInterfaceController {
    
    @IBOutlet weak var timerLabel: WKInterfaceLabel!
    var higeCnt = 0;
    
    override func awakeWithContext(context: AnyObject?) {
        super.awakeWithContext(context)
        var timer = NSTimer.scheduledTimerWithTimeInterval(1.0, target: self, selector: Selector("onHigenobita"), userInfo: nil, repeats: true);
    }
    func onHigenobita(){
        //ここが実行されます
        timerLabel.setText("ひげが\(++higeCnt)本のびた");
    }

    override func willActivate() {
        // This method is called when watch view controller is about to be visible to user
        super.willActivate()
    }

    override func didDeactivate() {
        // This method is called when watch view controller is no longer visible
        super.didDeactivate()
    }
}

サンプル画像

特に問題なくAppleWatchでもひげが伸びるタイマーを作成できました!

カスタマイズ

どうせなので以下のアニメーションgif画像も一緒に表示できるかを検証してみます。

ヒゲサンプル画像

そもそもアニメーションGIFを表示できるのか


参考:WatchKit Framework Reference WKInterfaceImage Class Reference
参考:WatchKitでWKInterfaceImageを使ってアニメーション

このあたりを読むとWKInterfaceImageはアニメーションGIFをそのまま読み込むのは無理そうで、パラパラマンガ的に表示させるとのことです。ということで、 このサイトでgifを分割します。こんな便利なサイト知りませんでした、超オススメ! Gifをフレームに分割してくれるサイト=ezgif.com

サンプル画像サンプル画像

このサイトからgifのフレームをゲット!そのままだとXCodeでインポートできなかったのでJpegに変換

ヒゲサンプル画像

イメージアセットに追加します。

ヒゲサンプル画像

StoryBoardにWKInterfaceImageをドラッグして追加して同じようにIBOutletで関連づけます。(Ctrlドラッグ)

ヒゲサンプル画像

プロパティで、imageファイル名(連番)、Duration, Animateを調整します。プレビューの画像がはてなになるけどOKです。

そして、実行すると、、、、

サンプル画像

なんだかキモい

まとめ

最終的にキモいものが出来上がってしまいました。ごめんなさい。

前の記事はこちらからです!

次の記事はこちらからです!

↓こんな記事もありますよ!

のんでいるくすり: 3.11震災時の体験から開発されたお薬アプリ。無料

今日は薬を便利にかつ守秘的にメモできるアプリのんでいる薬をご紹介します。 実はアプリレビューは初めて。 SwiftサラリーマンのFBページを経由して開発者でもあり薬剤師のBlueRoy(ブルーロワ・インク) Inc. のShige様とお知り合いになる事ができて、是非レビューさせて下さいと私からお願いした経緯で今回レビュー記事に繋がりました。 Shige様、快く了承頂き本当にありがとうございました!

UITableViewCellをプログラムで動的に作成する

UITableViewをStoryboardで作成する方法は結構ありますが、プログラムだけで作成するサンプルが少なかったので共有します。

WatchKitでタイマーアプリを作成する。

簡単なアプリを作成しながらAppleWatchを学んでいきます。前回の記事で大まかな動きは理解できましたので、 つぎはAppleWatchとアプリとの連携をタイマー機能を利用して検証していきます
このエントリーをはてなブックマークに追加
右側のFacebookのLikeをクリック頂けると記事更新の際に通知されますので宜しければご利用下さい!