web-dev-qa-db-ja.com

iOSでUIViewをマスクする方法

同様の質問を見たことがありますが、有効な答えが見つかりません。

灰色の画像を使用してUIViewをマスクしたい（マスキングのためにアルファスケールに変換する必要がある）。 UIViewには背景があります。画像をマスクするのは簡単なはずですが、UIViewをマスクしたいと思います。

手がかりをいただければ幸いです。

iosuiviewmask
30
subchap

私はこの問題に数時間取り組んできましたが、あなたが望むことをするだろうと思う解決策があります。まず、適切と思われる手段を使用してマスキング画像を作成します。ここではアルファ値のみが必要であり、他の色はすべて無視されることに注意してください。使用するメソッドがアルファ値をサポートしていることを確認してください。この例では.pngファイルからロードしていますが、.jpgファイルにはアルファ値がないので試さないでください。

次に、新しいレイヤーを作成し、そのコンテンツにマスクを割り当て、この新しいレイヤーをUIViewの独自のレイヤーに設定します。これにより、UIViewとそれに関連付けられているすべてのサブビューがマスクされることがわかります。

UIImage *_maskingImage = [UIImage imageNamed:@"mask"];
CALayer *_maskingLayer = [CALayer layer];
_maskingLayer.frame = theView.bounds;
[_maskingLayer setContents:(id)[_maskingImage CGImage]];
[theView.layer setMask:_maskingLayer];

これで、UIViewの背景色を好きなように設定でき、マスクを使用して色付きフィルターが作成されます。

編集： iOS8以降、別のビューをmaskViewプロパティに割り当てるだけで、ビューをマスクできるようになりました。一般的なルールは同じですが、maskViewのアルファレイヤーは、適用されるビューの不透明度を決定するために使用されます。

68
Ash

IOS 8.0以降をターゲットとするアプリの場合、これはうまく機能しました（この場合、マスクとしてグラデーションを使用）。これにより、マスクのサイズ変更や配置の必要がなくなります。

// Add gradient mask to view
func AddGradientMask(targetView: UIView)
{
    let gradientMask = CAGradientLayer()

    gradientMask.frame = targetView.bounds
    gradientMask.colors = [UIColor.blackColor().CGColor, UIColor.clearColor().CGColor]
    gradientMask.locations = [0.8, 1.0]

    let maskView: UIView = UIView()
    maskView.layer.addSublayer(gradientMask)

    targetView.maskView = maskView 
}

私の場合、ユーザーがスクロールを開始したらマスクを削除します。これは以下で行われます：

func scrollViewWillBeginDragging(scrollView: UIScrollView) {

    exerDetailsTableView.maskView = nil        
}

ここで、ビューは@IBOutletとして定義されています。

@IBOutlet weak var exerDetailsTableView: UITableView!

結果：

example screenshot

9
Stonetip

頭の上の正確なコードはわかりませんが、基本的な考え方は2つのUIViewを持つことです。 1つのUIViewのイメージプロパティをグレースケールイメージに設定し、他のUIViewを通常どおりに設定します。唯一の違いは、「通常の」イメージを含むUIViewの上に直接最初のUIViewを配置することです。

これであなたのアイデアをさらに一歩進めることができれば幸いです。

1
Jealous Republic