iPhoneプログラミングの質問です。

UIImageを使って、一部分だけが透明な穴が開いたような感じの画像を生成したいです。
どのようにすれば良いでしょうか?

回答の条件
  • 1人5回まで
  • 登録:
  • 終了:2010/02/09 21:00:03
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ベストアンサー

id:heke2mee No.3

回答回数162ベストアンサー獲得回数43

ポイント26pt

ポイントが勿体無いからコメント欄を空けたほうがいいですよ


こちらには開発環境がないため正しいソースは提供できませが

たぶんmaskImageが間違ってる気がします。


問題を単純にするためサンプルのようにマスク画像を

UIImage *maskImage = [UIImage imageNamed:@"mask.png"];

のように直接指定して試してください。




曇りガラスを指で擦ったような画像を作成する流れ


用意するもの

●オリジナルの画像

●曇った画像(アルファブレンド済みの画像)

●マスク画像1(白四角の中に黒丸)実際には指で擦った部分のイメージ

●マスク画像2(黒四角の中に白丸)実際には指で擦ってない部分のイメージ

(マスク画像1とマスク画像2は白と黒が反転したものなのでプログラムでも作れます)


まず、オリジナルの画像とマスク画像1でマスク済みの画像Aを作成する。

(画像Aはマスク画像1で黒だった部分がオリジナルの画像になっている)<==指で擦った部分のイメージ

次に曇った画像とマスク画像2でマスク済みの画像Bを作成する。

(画像Bはマスク画像2で黒だった部分が曇った画像になっている)<==擦ってない部分のイメージ


最後に画像Aと画像Bを合成すると曇りガラスを指で擦ったような画像になる。

合成する方法はヘルプにあると思います。

http://q.hatena.ne.jp ダミー

id:uniom

「回答受付中はコメントをつけられません。」になっています。

マスク画像を直接指定で実行してみたのですが、

マスク画像が

CGContextDrawImage(context, rect, masked);

のrect(320×480)にあわせて引き伸ばされてしまいます。

参考URLものはマスク画像も元画像も同じ大きさなので、うまくいっているように思います。

しかも、白でマスクしたらその部分が消去されるのですが、黒でマスクしても黒以外の部分は消去されません。

何卒よろしくお願いします。

2010/02/04 16:58:58

その他の回答2件)

id:heke2mee No.1

回答回数162ベストアンサー獲得回数43

ポイント27pt

こちらが参考になると思います。

マスクを使って画像を切り抜く

http://d.hatena.ne.jp/KishikawaKatsumi/20090419/1240147321

id:uniom

切り抜かれたほうの画像が欲しいです。切り抜かれた方の画像はどのように抽出できますでしょうか?

2010/02/02 22:12:04
id:heke2mee No.2

回答回数162ベストアンサー獲得回数43

ポイント27pt

コメント欄が開いてないので、こちらで失礼します。

サンプルにある、白四角の中に黒丸の画像と逆の

黒四角の中に白丸とすればいいと思います。

簡単に言うと、マスク画像で黒にしてる部分が残り

白の部分が消えると言う事です。

http://q.hatena.ne.jp ダミー

id:uniom

以下でうまくいきませんでした。何も表示されません。

CGPoint p = [[touches anyObject] locationInView:self];

UIImage* blackImage = [UIImage imageNamed:@"black.png"];

UIImage *whiteImage = [UIImage imageNamed:@"white.png"];

CGRect rect = CGRectMake(0, 0, 320.0f, 480.0f);

CGRect whiteRect = CGRectMake(p.x, p.y, whiteImage.size.width, whiteImage.size.height);

UIGraphicsBeginImageContext(blackImage.size);

[blackImage drawInRect:rect];

[whiteImage drawInRect:whiteRect blendMode:kCGBlendModeNormal alpha:1.0];

UIImage *maskImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

CGImageRef maskRef = maskImage.CGImage;

// マスクを作成する

CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef),

CGImageGetHeight(maskRef),

CGImageGetBitsPerComponent(maskRef),

CGImageGetBitsPerPixel(maskRef),

CGImageGetBytesPerRow(maskRef),

CGImageGetDataProvider(maskRef), NULL, false);

// マスクの形に切り抜く

UIImage *originalImage = [UIImage imageNamed:@"test.png"];

CGImageRef masked = CGImageCreateWithMask(originalImage.CGImage, mask);

// コンテキストに描画する

CGContextDrawImage(context, rect, masked);

// 表示する

[self setNeedsDisplay];

2010/02/03 15:00:01
id:heke2mee No.3

回答回数162ベストアンサー獲得回数43ここでベストアンサー

ポイント26pt

ポイントが勿体無いからコメント欄を空けたほうがいいですよ


こちらには開発環境がないため正しいソースは提供できませが

たぶんmaskImageが間違ってる気がします。


問題を単純にするためサンプルのようにマスク画像を

UIImage *maskImage = [UIImage imageNamed:@"mask.png"];

のように直接指定して試してください。




曇りガラスを指で擦ったような画像を作成する流れ


用意するもの

●オリジナルの画像

●曇った画像(アルファブレンド済みの画像)

●マスク画像1(白四角の中に黒丸)実際には指で擦った部分のイメージ

●マスク画像2(黒四角の中に白丸)実際には指で擦ってない部分のイメージ

(マスク画像1とマスク画像2は白と黒が反転したものなのでプログラムでも作れます)


まず、オリジナルの画像とマスク画像1でマスク済みの画像Aを作成する。

(画像Aはマスク画像1で黒だった部分がオリジナルの画像になっている)<==指で擦った部分のイメージ

次に曇った画像とマスク画像2でマスク済みの画像Bを作成する。

(画像Bはマスク画像2で黒だった部分が曇った画像になっている)<==擦ってない部分のイメージ


最後に画像Aと画像Bを合成すると曇りガラスを指で擦ったような画像になる。

合成する方法はヘルプにあると思います。

http://q.hatena.ne.jp ダミー

id:uniom

「回答受付中はコメントをつけられません。」になっています。

マスク画像を直接指定で実行してみたのですが、

マスク画像が

CGContextDrawImage(context, rect, masked);

のrect(320×480)にあわせて引き伸ばされてしまいます。

参考URLものはマスク画像も元画像も同じ大きさなので、うまくいっているように思います。

しかも、白でマスクしたらその部分が消去されるのですが、黒でマスクしても黒以外の部分は消去されません。

何卒よろしくお願いします。

2010/02/04 16:58:58
  • id:uniom
    UIGraphicsGetImageFromCurrentImageContext()で生成した画像でマスクするとうまくいきません。
    画像合成の仕方は他にもありますでしょうか?
    ただ、マスク自体のやり方は理解しました。
  • id:heke2mee
    勘違いでした。
    マスクの白いところが描画されて黒が描画されないみたいですね。


    その他のサンプルです。
    http://ameblo.jp/xcc/entry-10430704418.html


    こちらは知っているかもしれませんが
    iPhoneアプリケーションプログラミングガイド
    http://developer.apple.com/jp/iphone/library/documentation/iPhone/Conceptual/iPhoneOSProgrammingGuide/Introduction/Introduction.html
  • id:uniom
    できました。やはり、黒が描画で、白が描画されないが正解のようです。
    いろいろ、ありがとうございました。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません