2012-03-30 25 views
0

私はこれをしばらく見てきました。透明部分のない画像マスク

私は現在、私はスライダーがなくなった量に灰色の背景でuiimageviewを伸ばしてるカップ

enter image description here

超えるグレー画像を入れしようとしています。

-(void) sliderChanged:(CGFloat) value{ 
drinksView.grayArea.frame = CGRectMake(0 , -value ,372 ,value); 

私は

何私がしたいことは、灰色の部分のみカップがある部分(例えば部分画像をカバーすることである...これは私が望んでいないものを、非常に汚れている知っています透明ではない)。カップのイメージは透明な背景を持っています

これを達成する方法のアイデアはありますか?私はマスクが付いたノブで、多くのチュートリアルは私をどこにも導かず、可能かどうかわからない。

PS:カップ画像がガラスあなたがこの方法に慣れるために必要なすべての

答えて

1

を精緻ご容赦します。代わりにUIImageViewを使用しての

  1. 、あなたのオーバーレイとして灰色の背景にCALayerを使用します。これは、あなたが何をする必要があるかです。 sliderChanged:メソッドは変更されませんが、drinksView.grayAreaはビューではなくレイヤーになります。
  2. これまでのところ、効果はまったく同じになります。さて、grayAreaのマスクを設定する必要があります。私はスケールが変更されたように、層がコンテンツをストレッチしますデフォルトではと思います

    CALayer * maskLayer = [CALayer new]; 
    maskLayer.contents = myCupImage.CGImage; 
    grayArea.mask = maskLayer; 
    
  3. :次の操作を行います。私たちはそれを望んでいません。これは、レイヤーのcontentsGravityをたとえばkCAGravityTopに設定することで解決できます。

これは、必要な操作を行う必要があります。

注意点:コンテンツの重力の変化にマスクがどのように対処しているかはわかりません。

(カップ画像のサイズに等しい) grayAreaための固定枠を設定
  1. :あなたはその前面に問題がある場合は、コンテナ層を追加することによってそれを修正することができます。 、あなたのsliderChanged:

    CALayer * container = [CALayer new]; 
    container.masksToBounds = YES; 
    [container addSublayer:grayArea]; 
    [drinksView.layer addSublayer:container]; 
    
  2. を代わりにgrayAreacontainerのフレームを変更します。

  3. は、代わりに直接grayAreaを追加する、そのためのコンテナ層を導入します。

希望します。

+0

これは魅力のように働いていた、私はそれcuzの下で私の最終的なコードを投稿しますいくつかの強化が必要でした。 Ty非常に – SnK

1

まずに変更することができますので、カップの周りにパスを描画することはできませんそれは何

// masks the item based on the MaskImage 
- (UIImage*) itemMask : (UIImage*)image withMask:(UIImage*)maskImage 
{ 
    UIImage* afterMasking = nil; 

    CGImageRef maskRef = maskImage.CGImage; 

    CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef), CGImageGetHeight(maskRef), CGImageGetBitsPerComponent(maskRef), CGImageGetBitsPerPixel(maskRef), CGImageGetBytesPerRow(maskRef), CGImageGetDataProvider(maskRef), NULL, false); 

    CGImageRef masked = CGImageCreateWithMask([image CGImage], mask); 
    CFRelease(mask); 
    afterMasking = [UIImage imageWithCGImage:masked]; 
    CFRelease(masked); 
    return afterMasking; 
} 

それはあなたのカップイメージとマスクイメージを一緒にフィードして、あなたのカップイメージをマスクするということです。それはあなたのカップイメージだけを覆い隠すことはありませんので、心配する必要はありません。

問題は、グレーボックスのサイズが変更されることです。私がこれにどのようにアプローチするかは、スライダーの値に応じてマスクを切り抜くことです。だから、ブラックボックスを作って、その方法でそれをフィードする前に、grayBGでどのように処理するかを変更してください。それは速くなければならないので、私は詳しく説明しませんが、最後にこのようなことがあります。半分は私は考えることができる最も簡単な方法は、マスクされたのCALayerを使用することで、グラフィックス

Image With large sliderImage With small slider

+0

最初の答えは私のために働いたので、私はこのしようとしなかった(固定価格プロジェクトを;))の努力のおかげでとにかく – SnK

0
drinksView.grayLayer = [CALayer new]; 
    drinksView.grayLayer.frame = CGRectMake(0, 0, 372, 0); 
    drinksView.grayLayer.contentsGravity = kCAGravityTop; 

    CALayer * topLayer = [CALayer new]; 
    topLayer.frame = CGRectMake(0, 0, 372, 367); 
    UIImage * grayImage = [UIImage imageNamed:@"grayDrink.png"]; 
    topLayer.contents = (id) grayImage.CGImage; 

    CALayer * maskLayer = [CALayer new]; 
    maskLayer.contents = (id)cupImage.CGImage; 
    maskLayer.masksToBounds = YES; 

    maskLayer.bounds = CGRectMake(0, 0, 372, 367); 
    maskLayer.position = CGPointMake(186,184); 

    [topLayer setMask:maskLayer]; 
    [drinksView.grayLayer addSublayer:topLayer]; 
    [drinksView.grayLayer setMasksToBounds:YES]; 
    [[drinksView layer]addSublayer:drinksView.grayLayer]; 
関連する問題