2011-02-28 17 views
5

2に関連している私がやりたい事、:イメージを色づけする/色を表示する方法は?

  1. は、任意の色のブロックを表示します。だから、いつでも色を変えることができました。
  2. 色別に異なる色にすることができます。アルファダウンした色のオーバーレイはここで働くかもしれませんが、それは透明な背景を持ち、画像の完全な四角形を占めていない画像であると言います。

答えて

10

最初は簡単です。新しいUIViewを作成し、背景色を任意の色に設定します。

2番目はより困難です。言及したように、透明度を下げた状態で新しいビューを上に置くことはできますが、同じ場所でクリップするにはマスクを使用することをお勧めします。このような何か:

UIImage *myImage = [UIImage imageNamed:@"foo.png"]; 

UIImageView *originalImageView = [[UIImageView alloc] initWithImage:myImage]; 
[originalImageView setFrame:CGRectMake(0.0f, 0.0f, 100.0f, 100.0f)]; 
[parentView addSubview:originalImageView]; 

UIView *overlay = [[UIView alloc] initWithFrame:[originalImageView frame]]; 

UIImageView *maskImageView = [[UIImageView alloc] initWithImage:myImage]; 
[maskImageView setFrame:[overlay bounds]]; 

[[overlay layer] setMask:[maskImageView layer]]; 

[overlay setBackgroundColor:[UIColor redColor]]; 

[parentView addSubview:overlay]; 

あなたは実装ファイルに#import <QuartzCore/QuartzCore.h>する必要があります覚えておいてください。

+0

私はhori仕事に集中している。最初は、オーバーレイをUITableViewCellのサブビューとして追加していたところで、セルのサイズが変更されたときにセンタリングが失われました。私は、UITableViewCell自体の代わりに、セル内のUILabelフィールドのサブビューとしてオーバーレイを追加することでこれを修正しました。 – bneely

+1

テーブルビューセルの 'contentView'に追加することもできます。 –

2

1を達成する簡単な方法は、UILabelまたはUIViewを作成し、好きなようにbackgroundColorを変更することです。

色を重ねる代わりに色を掛ける方法があり、それは2の場合に有効です。this tutorialを参照してください。

11

別のオプション、このようなUIImage上のカテゴリのメソッドを使用することです...

// Tint the image, default to half transparency if given an opaque colour. 
- (UIImage *)imageWithTint:(UIColor *)tintColor { 
    CGFloat white, alpha; 
    [tintColor getWhite:&white alpha:&alpha]; 
    return [self imageWithTint:tintColor alpha:(alpha == 1.0 ? 0.5f : alpha)]; 
} 

// Tint the image 
- (UIImage *)imageWithTint:(UIColor *)tintColor alpha:(CGFloat)alpha { 

    // Begin drawing 
    CGRect aRect = CGRectMake(0.f, 0.f, self.size.width, self.size.height); 
    UIGraphicsBeginImageContext(aRect.size); 

    // Get the graphic context 
    CGContextRef c = UIGraphicsGetCurrentContext(); 

    // Converting a UIImage to a CGImage flips the image, 
    // so apply a upside-down translation 
    CGContextTranslateCTM(c, 0, self.size.height); 
    CGContextScaleCTM(c, 1.0, -1.0); 

    // Draw the image 
    [self drawInRect:aRect]; 

    // Set the fill color space 
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB(); 
    CGContextSetFillColorSpace(c, colorSpace); 

    // Set the mask to only tint non-transparent pixels 
    CGContextClipToMask(c, aRect, self.CGImage); 

    // Set the fill color 
    CGContextSetFillColorWithColor(c, [tintColor colorWithAlphaComponent:alpha].CGColor); 

    UIRectFillUsingBlendMode(aRect, kCGBlendModeColor); 

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

    // Release memory 
    CGColorSpaceRelease(colorSpace); 

    return img; 
} 
+0

良いですが、透明なピクセルも濃くなっています – zxcat

+2

1) "透明ピクセルも色付き"を修正するには、 'UIRectFillUsingBlendMode'の前に' CGContextClipToMask(c、aRect、self.CGImage);を追加してください。 2)真の色合いを適用し、画像値を保存するには、kCGBlendModeColorを使用します。 – Wienke

+1

これは、イメージの裏返しを上下逆にレンダリングします。コンテキストを取得したら、次の行を追加する必要があります。\t 'CGContextTranslateCTM(c、0、self.size.height); CGContextScaleCTM(c、1.0、-1。0); ' – chitza

-1

ここでは、この

- (void)viewDidLoad 
    { 
     [super viewDidLoad]; 
     UIView* maskedView = [self filledViewForPNG:[UIImage imageNamed:@"mask_effect.png"] 
               mask:[UIImage imageNamed:@"mask_image.png"] 
              maskColor:[UIColor colorWithRed:.6 green:.2 blue:.7 alpha:1]]; 


     [self.view addSubview:maskedView]; 

    } 

    -(UIView*)filledViewForPNG:(UIImage*)image mask:(UIImage*)maskImage maskColor:(UIColor*)maskColor 
    { 
     UIImageView *pngImageView = [[UIImageView alloc] initWithImage:image]; 
     UIImageView *maskImageView = [[UIImageView alloc] initWithImage:maskImage]; 

     CGRect bounds; 
     if (image) { 
      bounds = pngImageView.bounds; 
     } 
     else 
     { 
      bounds = maskImageView.bounds; 
     } 
     UIView* parentView = [[UIView alloc]initWithFrame:bounds]; 
     [parentView setAutoresizesSubviews:YES]; 
     [parentView setClipsToBounds:YES]; 

     UIView *overlay = [[UIView alloc] initWithFrame:bounds]; 
     [[overlay layer] setMask:[maskImageView layer]]; 
     [overlay setBackgroundColor:maskColor]; 

     [parentView addSubview:overlay]; 
     [parentView addSubview:pngImageView]; 
     return parentView; 
    } 
+0

答えを説明してください。 – hims056

4

を試してみて、あなたがすでにある場合は特に、画像の色味を実装するための別の方法ですQuartzCoreを他のものに使う

インポートQuartzCore:

#import <QuartzCore/QuartzCore.h>  

は透明のCALayerを作成し、色合いにしたい画像のためのサブレイヤとして追加:それはにISN場合

CALayer *sublayer = [CALayer layer]; 
[sublayer setBackgroundColor:[UIColor whiteColor].CGColor]; 
[sublayer setOpacity:0.3]; 
[sublayer setFrame:toBeTintedImage.frame]; 
[toBeTintedImage.layer addSublayer:sublayer]; 

は」(プロジェクトのフレームワークリストにQuartzCoreを追加します既に存在しています)、そうでなければ次のようなコンパイラエラーが発生します:

Undefined symbols for architecture i386: "_OBJC_CLASS_$_CALayer" 
関連する問題