Metalに入門してみました

この記事はGeekWomenJapan Advent Calendar 2016の8日目の記事です。

qiita.com

以前から気になっていたiOSのグラフィックスAPIMetalに入門してみました。
そしてクリスマスらしく、クリスマスツリーをMetalで書いてみることにしました。

f:id:takopomm:20161208001504p:plain

(入門ということで生温かい目で見てください…!)

環境

ツリー概要

このように三角形を6個組み合わせてツリーのような形にしました。

f:id:takopomm:20161208003134p:plain

三角形の各頂点に、それぞれ色を付けています。
葉っぱの部分は、黄緑から濃緑にグラデーションしています。

Metalで描画するためにやったこと

各処理の詳細については省略しますが、Metalで描画する際のおおまかな流れです。

  1. Metal Deviceを作る
  2. コマンドキューを用意する
  3. レンダリングパイプラインを作る
  4. クリスマスツリーの三角形たちの頂点座標&色データを定義して、頂点バッファを作る
  5. 画面をクリア
  6. コマンドバッファを作る
  7. ツリーを描く
  8. 画面に表示する

このうち、5〜8を毎フレーム繰り返しており、常に画面全体を書き直しています。

実行してみる

Metalはシミュレータで動かないので、実機で実行する必要があります。

シミュレータを選択した状態で実行してみると、

Use of undeclared type 'CAMetalLayer'

と、Metalに関連するコードが解決できず、ビルドエラーになってしまいます。
(しばらくハマってしまいました)

Metalで描ける形状のメモ

  • point (点)
  • line (線分)
  • lineStrip (点を順番につなげて線にする)
  • triangle (三角形)
  • triangleStrip (頂点を共有した三角形)

四角形を描画するには、三角形を2つ並べます。

成果物

こちらにソースコードがあります。

github.com

MetalView.swiftに、ほとんどすべてが詰まっています。

感想

  • OpenGLの知識がまだうっすら残っている状態だったので、何をすればよいかおおよそ把握できていたことは、Metal入門においてかなりプラスに働きました。

  • Swiftで書けるところが好印象です。

  • ビルドにすごく時間かかりました。 ちょっと直して、もう一度実行する時の待ち時間が辛かったです。。(この辺りは何かTipsがあるのかもしれませんが)

  • やり残したことは、「テクスチャを貼る」。せめて背景画像を出せたら、もう少しマシな画面になったかも・・

最後に・・

GeekWomenのアドベントカレンダーということで、元気はじける3歳児を育てるヨボヨボお母さんエンジニアの小話など書こうかなと思っていましたが、ふとMetalの神様が降りてきました。今の業務で使うことはないのですが、久しぶりにグラフィックス周りに触れてみたらやっぱり楽しかったです。今年のうちにMetalとたわむれることができて良い年越しができそうです。

参考

Swift3でStringをMD5文字列に変換する時に得たことのメモ

StringをMD5に変換するのはこのようなコードになりました。

Swift3でStringをMD5に変換する

これを書いている中で学んだことのメモです。

文字の連結

NSDataではなくDataを使い、NSが付くものをあまり使わないようにと思っていたのです。

でも、MD5文字列に連結する箇所で、はじめはNSMutableStringを使っていました。

before

for i in 0 ..< digestLength {
    result.appendFormat("%02x", md5Buffer[i])
}
  • for文で書いていました
  • NSMutableStringを使っていました

何だかしっくりこない…と調べるうちにreduceが使えることを知りました。

after

md5String = (0..<digestLength).reduce("") { $0 + String(format:"%02x", md5Buffer[$1]) }
  • reduceを使いました
  • NSMutableStringがなくなりました

スッキリしました。

CountableRange

(0..<digestLength)

この部分はCountableRangeになっているのですね。

CountableRangeでは、mapfilterなどを使うことができます。

クロージャの書き方

きちんと理解できていなかったのでおさらい。
変化の軌跡を残してみます。

その1

md5String = (0..<digestLength).reduce("", { (result, index) -> String in
    return result + String(format: "%02x", md5Buffer[index])
})
  • 引数や戻り値の型をすべて記述しました。

その2

md5String = (0..<digestLength).reduce("") { result, index in result + String(format:"%02x", md5Buffer[index]) }
  • 型とreturnを省略しました。

その3

md5String = (0..<digestLength).reduce("") { $0 + String(format:"%02x", md5Buffer[$1]) }
  • 引数の名前を省略しました。

mapなどを使う時はこの省略形を最もよく目にするので、これを使うのが良いですね。

参考

MD5変換

CountableRange

クロージャ

httpの音楽ファイルをAVAudioPlayerで再生する

先日iTunes Search APIを使いまして、曲のプレビュー再生のURLを取得できることを知ったので、再生を試した時に書いたコードです。

AVAudioPlayerはシンプルに書けて再生できるので良いですね。

お母さんと仕事、なんとかやってこれました

この記事は「子育てプログラマ・ITエンジニア・Webデザイナー Part 2 Advent Calendar 2015」の16日目として書いております。
(遅れてしまい申し訳ありませんでした・・クリスマスにギリギリ滑り込みになってしまいました)

この記事は

「時間」がうまく使えず悩みながらも、お母さんと仕事をなんとかやってこれました、という話です。

簡単に自己紹介です

2歳児を子育て中のお母さんプログラマです。

子どもが生まれて

「時間」に対する意識ががらりと変わりました。

独身時代はなんと贅沢に使っていたことか・・と悔やまれるほど
時間というものの価値の重さを感じているところです。

時間がうまく作れず

私は子どもが生まれてから2年間、「自己研鑽する時間なんてどうやって持てばいいのか・・」と途方に暮れる日々でした。

私は優れた技術者などではなく、ごく平凡な能力の人です。
もし優秀な人ならば、子どもがいようがいまいが、関係なく、時間を適切に使って自分の能力を高めていくことができるのだろうと思います。

ところが私ときたら、自分の体力を保つのがやっとで(特に1歳半までは本当に大変でした)、Webでパワフルなママさんの紹介記事を読むたびに、頑張って輝いているママさんを見て励みになるどころか、「私ってやつはどうしてこうなんだ・・」と焦り、落ち込んだものです。

今となって冷静に考え直せば、時間を作ることもできただろうとも思いますが、当時の私は目の前の事をこなすのに手一杯で、そこまで頭が回っていませんでした。

それでも少しずつ

子が2歳になったあたりから、少しずつ自分の時間を作れるようになってきました。

たとえ10分でも「本読んだ!やった!」とか「コード書いた!よーし!」と、「毎日」「少しずつ」「続ける」こと、そしてそれに対して「OK、できた!」と心の中で自分に言うことが、今の私にとって一番良い道なのだな、とようやくわかってきたところです。
(それすら出来ない日もあります。仕方ないとあきらめたり、意地にならないようにしています。)(意地になるとストレスが溜まり家庭に跳ね返るので。。)

時短勤務

時短勤務で働くようになってから、「人日」という計算がうまく当てはまらず悩んだことがありました。

私は1日6時間勤務にしています。人日は一般的には8時間なので、日で見ると私は人より長い期間かかることになり、ガントチャートを見ては能力がとても落ちたように感じて苦しかったです。

それでも仕事を続けることができているのは、夫の理解、職場の理解、この二つの力がとても大きいです。
色々な考えがこんがらがっている私の頭の中を、的格に言語化して整理整頓してくれる夫。
時短勤務然り、急なお迎えや休みにも理解を示してくれる職場。
人が助けてくれると、私の心にのしかかっていたものが、一瞬で軽くなる。人の力はすごい。
それでもやはり負い目は感じますし悩むことはありますが、仕事を続けることができています。

親年齢2歳

実年齢はアラサー、でも2歳か、うふふ、などと思うと、ほんの少し若返った気がしてきます。 (完全に気のせいですが、よいのです。)

「ああ、今日も理不尽に怒ってしまった、駄目母・・」と落ち込む日も多々ありますが、
30代になっても、反省することや課題は山積みで、落ち込んだり元気になったり、怒ったり喜んだり、こんなにも感情が激しく揺れ動くのか、と思うと、「私まだまだ伸びしろいっぱいありそう!」と能天気に考えれば、自分にワクワクもしてきます。
(20代の頃は、30歳をどうやって生きているかなんて想像すらしていませんでした)

あっという間に2年過ぎてしまったので、この先もっと加速しそうでおそろしいです。
さて成人する頃には一体どうなってるのか・・(想像できない)
娘と一緒にコード書けているといいな。

YouTubeDataAPIの動画再生画質サイズまとめ

iOSYTPlayerViewに定義されている定数YTPlaybackQualityとサイズの対応表、および再生画質関連のメモ。

YouTube JavaScript Player API Reference  |  YouTube IFrame API  |  Google Developers

動画プレーヤーの高さは以下のいずれかの値に、プレーヤーのサイズは 16:9 のアスペクト比にそれぞれ設定することをお勧めします。

YTPlaybackQuality 高さ (pixel) サイズ (pixel) アスペクト比
kYTPlaybackQualitySmall 240 320x240 4:3
kYTPlaybackQualityMedium 360 640x360 or 480x360 16:9 or 4:3
kYTPlaybackQualityLarge 480 853x480 or 640x480 16:9 or 4:3
kYTPlaybackQualityHD720 720 1280x720 or 960x720 16:9 or 4:3
kYTPlaybackQualityHD1080 1080 1920x1080 or 1440x1080 16:9 or 4:3
kYTPlaybackQualityHighRes 1080以上 1920x1080以上 16:9以上

たとえば、画質レベル large をリクエストし、それが無効な場合、再生画質は medium に設定されます(このレベルが有効であれば)。

YouTube Data APIでパラメータに日時を扱うとき

たとえば、YouTube Data API SearchpublishedAfterなど日時のパラメータを使う際、NSDateからNSStringに変換するメモです。

おまけ

publishedAfterは、「その日時以降の動画を検索対象にする」というパラメータです。実際には、Nowのところには「1日前」「1ヶ月前」などを入れて使います。