画像の透過部分を無視するUIImageViewのサブクラス

1. RMShapedImageView
画像の透過部分を無視するUIImageViewのサブクラス
@hiranodept
13年4月5日金曜日

2. 自己紹介
平野百貨店
平野 哲也
@hiranodept
こんなアプリ作りました。
Happynote EverShaker Simple Routine パズタス きょうのネコ
※MORE6月号（4月27日発売）コラム「トレンド★パパラッチ」で紹介してくれるらしい
13年4月5日金曜日

3. RMShapedImageView
画像の透過部分を無視するUIImageViewのサブクラス
RMShapedImageView (Apache License ver2.0)
https://github.com/robotmedia/RMShapedImageView
13年4月5日金曜日

4. 困ったことありませんか？
透過PNGの透過部分にはタッチを
反応させたくない
この部分
13年4月5日金曜日

5. 困ったことありませんか？
もし重なる部分が出てくると...
一番後ろ
真ん中
一番前
13年4月5日金曜日

6. 困ったことありませんか？
もし重なる部分が出てくると...
一番後ろ
真ん中
一番前
13年4月5日金曜日

7. 困ったことありませんか？
もし重なる部分が出てくると...
一番後ろ
真ん中
一番前
13年4月5日金曜日

8. RMShapedImageView
透過部分を無視してくれる
UIImageViewのサブクラス
透過部分
13年4月5日金曜日

9. RMShapedImageView
ポイント
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
この中で、タッチポイントのピクセルが
アルファ値が0かどうか判定している
また、1ピクセルを取り出して判定しているので
その判定を緩くするオプション shapedPixelTolerance もあるみたい。
このプロパティに入れた数値分、周辺のピクセルもテストしてくる。
多分、パフォーマンスに影響でるかと。
13年4月5日金曜日

10. RMShapedImageView
使い方
お使いのプロジェクトに
RMShapedImageView.hと.mを入れる
あとは、
UIImageViewだったオブジェクトを
RMShapedImageViewにリネームするだけ
13年4月5日金曜日

11. RMShapedImageView
IBでの注意点
ModeがCenterになっているので、ScaleToFillに
※ハマりどころ
UIImageViewをRMShapedImageViewにする
13年4月5日金曜日

12. RMShapedImageView
リンゴと手が重なっていてもちゃんと認識する
顔
手 画像の矩形
リンゴ 体
13年4月5日金曜日

13. RMShapedImageView
RMShapedImageView (Apache License ver2.0)
https://github.com/robotmedia/RMShapedImageView
元ネタ
Detect touches only on non-transparent pixels of UIImageView,
efficiently
http://stackoverflow.com/questions/13291919/detect-touches-
only-on-non-transparent-pixels-of-uiimageview-efficiently
13年4月5日金曜日

14. ありがとうございました
@hiranodept
13年4月5日金曜日