画像をブレンド加工する「DCBlendImage」クラス

Objective-Cで Photoshopのように画像を合成して表示する「DCBlendImage」クラスを作成しました。

ベース画像とブレンド画像、ブレンドモード、アルファ値、画像の寸法を指定して使用します。

下記よりファイルのダウンロードが行えます。

ダウンロード

使用する画像

元画像

重ねて表示する画像

結果画像(ブレンドモード: スクリーン)

使用方法

合成された UIImageを取得し画面に追加

1
2
3
4
5
UIImage *compositeImage = [DCBlendImage blendImage:<ベース画像の UIImage blendImage:<ブレンド画像の UIImage
                                         blendMode:kCGBlendModeScreen(ブレンドモード) blendAlpha:<ブレンド画像のアルファ値>
                                              rect:<画像のレクタングル>];
UIImageView *compositeImageView = [[UIImageView alloc] initWithImage:compositeImage];
[self.view addSubview:compositeImageView];

合成された UIImageViewを取得し画面に追加

1
2
3
4
UIImageView *compositeImageView = [DCBlendImage blendImageView:<ベース画像の UIImage blendImage:<ブレンド画像の UIImage
                                                     blendMode:kCGBlendModeScreen(ブレンドモード) blendAlpha:<ブレンド画像のアルファ値>
                                              rect:<画像のレクタングル>];
[self.view addSubview:compositeImageView];

ブレンドモードの種類

CGBlendMode 説明
kCGBlendModeMultiply 乗算
kCGBlendModeScreen スクリーン
kCGBlendModeOverlay オーバーレイ
kCGBlendModeDarken 比較(暗)
kCGBlendModeLighten 比較(明)
kCGBlendModeColorDodge 覆い焼きカラー
kCGBlendModeColorBurn 焼きこみカラー
kCGBlendModeSoftLight ソフトライト
kCGBlendModeHardLight ハードライト
kCGBlendModeDifference 差の絶対値
kCGBlendModeExclusion 除外
kCGBlendModeHue 色相
kCGBlendModeSaturation 彩度
kCGBlendModeColor カラー
kCGBlendModeLuminosity 輝度
kCGBlendModeClear 透明色で描画

ソースコード

DCBlendImage.h

1
2
3
4
5
6
7
8
9
#import <UIKit/UIKit.h>

@interface DCBlendImage : UIImage

#pragma mark - public method
+ (UIImage *)blendImage:(UIImage *)baseImage blendImage:(UIImage *)blendImage blendMode:(CGBlendMode)blendMode blendAlpha:(CGFloat)blendAlpha rect:(CGRect)rect;
+ (UIImageView *)blendImageView:(UIImage *)baseImage blendImage:(UIImage *)blendImage blendMode:(CGBlendMode)blendMode blendAlpha:(CGFloat)blendAlpha rect:(CGRect)rect;

@end

DCBlendImage.m

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
#import "DCBlendImage.h"

@implementation DCBlendImage

#pragma mark - Blend Image

// 合成された UIImage取得
+ (UIImage *)blendImage:(UIImage *)baseImage blendImage:(UIImage *)blendImage blendMode:(CGBlendMode)blendMode blendAlpha:(CGFloat)blendAlpha rect:(CGRect)rect
{
    UIGraphicsBeginImageContext(rect.size);

    [baseImage drawInRect:rect];
    [blendImage drawInRect:rect blendMode:blendMode alpha:blendAlpha];

    UIImage *compositeImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return compositeImage;
}

#pragma mark - Blend Image View

// 合成された UIImageView取得
+ (UIImageView *)blendImageView:(UIImage *)baseImage blendImage:(UIImage *)blendImage blendMode:(CGBlendMode)blendMode blendAlpha:(CGFloat)blendAlpha rect:(CGRect)rect
{
    UIGraphicsBeginImageContext(rect.size);

    [baseImage drawInRect:rect];
    [blendImage drawInRect:rect blendMode:blendMode alpha:blendAlpha];

    UIImage *compositeImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    UIImageView *compositeImageView = [[UIImageView alloc] initWithImage:compositeImage];

    return compositeImageView;
}

@end

サンプルソースコード

ViewController.h

1
2
3
4
5
6
#define BASE_IMG_NAME  @"Asymmetry_640_1136"
#define BASE_IMG_EXT   @"jpg"
#define BLEND_IMG_NAME @"blend_image"
#define BLEND_IMG_EXT  @"png"
#define BLEND_ALPHA    1.0
#define IMG_RECT       CGRectMake(0, 0, 320, 568)

ViewController.m

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
//合成された UIImageを取得し画面に追加
- (void)setCompositeImage
{
    UIImage *baseImage = [self getUIImageFromResources:BASE_IMG_NAME ext:BASE_IMG_EXT];
    UIImage *blendImage = [self getUIImageFromResources:BLEND_IMG_NAME ext:BLEND_IMG_EXT];
    UIImage *compositeImage = [DCBlendImage blendImage:baseImage blendImage:blendImage
                                             blendMode:kCGBlendModeScreen blendAlpha:BLEND_ALPHA
                                                  rect:IMG_RECT];
    UIImageView *compositeImageView = [[UIImageView alloc] initWithImage:compositeImage];
    [self.view addSubview:compositeImageView];
}

//合成された UIImageViewを取得し画面に追加
- (void)setCompositeImageView
{
    UIImage *baseImage = [self getUIImageFromResources:BASE_IMG_NAME ext:BASE_IMG_EXT];
    UIImage *blendImage = [self getUIImageFromResources:BLEND_IMG_NAME ext:BLEND_IMG_EXT];
    UIImageView *compositeImageView = [DCBlendImage blendImageView:baseImage blendImage:blendImage
                                                         blendMode:kCGBlendModeScreen blendAlpha:BLEND_ALPHA
                                                              rect:IMG_RECT];
    [self.view addSubview:compositeImageView];
}

//画像ファイル取得
- (UIImage *)getUIImageFromResources:(NSString*)fileName ext:(NSString*)ext
{
    NSString *path = [[NSBundle mainBundle] pathForResource:fileName ofType:ext];
    UIImage *img = [[UIImage alloc] initWithContentsOfFile:path];
    return (img);
}

お薦めの参考書

本気ではじめるiPhoneアプリ作り Xcode 7.x+Swift 2.x対応
iOSアプリ開発をこれから始める方に最もお薦めな一冊です。解り辛い点は図解入りで解説されており、プログラミングの動作の仕組みから詳しく知ることができます。基本から通信処理まで押さえられており、アプリ公開の手順についても解説されています。

   このエントリーをはてなブックマークに追加

About

Masaki Hirokawa (@dolice_apps)

デザインエンジニア 廣川政樹の開発ブログ。Objective-Cや Javaなど iPhone/Androidアプリ開発に関する技術情報を掲載しています。

iPhone apps

  • リラックス・ヒーリング(無料)
  • 望みが叶う!引き寄せの法則アプリ(無料)
  • ミステリー - 怖い話や不思議な体験、都市伝説まとめ
  • 浮世絵壁紙 - 美しい日本画ギャラリー(無料)
  • アート壁紙HD(無料)
  • 綺麗な壁紙HD iPhone 7/7 Plus/SE & iPod対応(無料)
  • クールな壁紙HD iPhone 7/7 Plus/SE & iPod対応(無料)

Android apps

  • 浮世絵壁紙 - 美しい日本画ギャラリー
  • 綺麗な高画質壁紙

Objective-C Classes

Tag Cloud

ActionScript(9) ActionScript3(7) Ad(4) Adfurikun(2) AdMob(9) Android(10) Animation(17) AppDelegate(3) ARC(1) ArrayList(1) AVAudioPlayer(4) AVAudioSession(1) AVFoundation(3) Banner(2) Bitmap(1) Camera(4) CGAffineTransform(4) CGBlendMode(2) CGContextRef(1) CGImageRef(1) Classes(44) CLLocationManager(1) ConnectivityManager(1) ContentResolver(1) CoreLocation(2) Delegate(3) Device(7) Display(1) DisplayMetrics(1) Download(101) Facebook(6) Foundation(72) Framework(2) Google Analytics(1) Handler(1) iAd(6) ImageView(1) In-AppPurchase(1) iOS(12) iOS 7(15) iOS 7.1(3) iOS 8(1) iPad(7) iPhone(21) iPhone 6(4) Java(7) JavaScript(2) LINE(4) Localize(1) Magazine(1) MediaStore(1) MFComposeViewController(1) Nend(1) NetworkInfo(1) NSArray(23) NSCalendar(3) NSData(2) NSDate(7) NSDateComponents(2) NSDateFormatter(2) NSDictionary(12) NSEnumerator(1) NSIndexSet(1) NSInteger(6) NSMutableArray(17) NSMutableDictionary(5) NSMutableOrderedSet(7) NSMutableString(4) NSMutableURLRequest(1) NSNotificationCenter(1) NSNumber(1) NSObject(1) NSOrderedSet(7) NSRange(2) NSSelectorFromString(1) NSSet(6) NSString(19) NSTimer(4) NSTimeZone(1) NSURL(7) NSURLConnection(1) NSURLRequest(2) NSUserDefaults(7) NSXMLParser(2) Objective-C(222) PHP(1) Products(14) QuartzCore(3) RSS(2) Runnable(1) Sample(51) Screensaver(9) SDK(2) ShareCompat(1) Social(10) StoreKit(1) Twitter(6) UIAccelerometer(3) UIActionSheet(1) UIActivityIndicator(1) UIActivityIndicatorView(3) UIActivityViewController(1) UIAlertView(5) UIApplication(7) UIButton(4) UIColor(3) UIDatePicker(5) UIDevice(6) UIDeviceOrientation(1) UIEvent(6) UIImage(15) UIImagePickerController(4) UIImageView(12) UIKit(58) UILabel(7) UINavigationBar(4) UINavigationItem(1) UIPasteboard(4) UIScreen(1) UIScrollBar(1) UIScrollView(1) UISlider(3) UIStoryboardSegue(3) UISwitch(1) UITabBar(3) UITableView(4) UITextField(2) UIView(11) UIViewAnimationTransition(1) UIViewController(4) UIWebView(5) WindowManager(1) Xcode(48) Xcode 5(8) Xcode 5.1(2)