Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
4
Help us understand the problem. What is going on with this article?
@pittanko_pta

AppleWatchで寿司を廻す

More than 3 years have passed since last update.

ヘイラッシャイ

寿司は日本人の心ですよね?
いつでもどこでも寿司出せたら最高だと思いませんか?

でも止まってる寿司は高い…廻っている寿司じゃないと…
ということでAppleWatchで寿司を廻してみました。

IMG_5910.PNG

起動すると寿司が出てきます。
Digital Crownをまわすと寿司が廻ります。

IMG_5911.PNG

止めると大将が出てきます

IMG_5912.PNG

動画は↓から
https://www.instagram.com/p/BNPOBmOB---/

どうやら文字は回せないらしい

UILabelと違ってWKInterfaceLabelにはtransformプロパティがないので
iOSでやるようにスッとは回らなかったです。

http://qiita.com/shu223/items/e704f70abc50da32ba38 によると
Appleですらアニメーションは連番画像を切替えているということだそうで…

そこでImageを連番で書き出して、それを回してみることにしました。
ウニやイクラも回すことができますし、好みの寿司ネタを用意できるメリットもありますね。

ネタの準備

寿司なのでネタの準備は必要ですね。
なるべくなめらかに回したいので、Appleのサンプルと同じように44枚書き出すことにしました。
44枚画像を書き出したかったので、8.2度ずつ回転しては書き出す作業を行いました。

大きい寿司の絵文字はテキストエディットで🍣と入力して、
PDFで保存すればPhotoshopでイイカンジに取り込むことができました :)

書き出した直後は全部で2.5MBくらいありましたが、さすがに実機転送がしんどいので
PNGを圧縮しました。ImageAlpha便利。

実装

お恥ずかしながらObjective-Cの実装です。
InterfaceController.hWKCrownDelegateの追記をお忘れなく。

- (void)awakeWithContext:(id)context {
    [super awakeWithContext:context];

    WKCrownSequencer *sequencer = self.crownSequencer;
    [sequencer focus];
    sequencer.delegate = self;

    //最初なので寿司出しておきましょう
    [_sushiImage setImageNamed:@"sushi_1"];
    [_messageLabel setText:@"寿司を廻せ!!!!"];
}
- (void) crownDidRotate:(WKCrownSequencer *)crownSequencer
       rotationalDelta:(double)rotationalDelta {

    if (rotationalDelta > 0) _num++;
    if (rotationalDelta < 0) _num--;
    if (_num == 45) _num = 1;
    if (_num == 0) _num = 44;

    NSString *name = [NSString stringWithFormat:@"sushi_%d", _num];
    [_sushiImage setImageNamed:name];
    [_messageLabel setText:@"おすしぐるぐる"];
}

- (void) crownDidBecomeIdle:(WKCrownSequencer *)crownSequencer {
    [_messageLabel setText:@"( `o´)ヘイラッシャイ"];
}

あとは適当にStoryboardの要素とくっつけてあげれば完成です。
(気が向いたらもう少し細かく書くかも、あとGitHubにソース上げるかも)

【2016-11-26 追記】
GitHubにプロジェクトファイルをアップしました。ビルドして遊んでみてください。
https://github.com/Pittan/sushi4watchos-sample

4
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
pittanko_pta
Perfumeと乃木坂・欅坂が好きです。フロントエンドの人。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
4
Help us understand the problem. What is going on with this article?