複数のアルファ値を持つ長方形のCALayerマスク

Question

UITableViewの上部をマスキングしてナビゲーションバーの錯覚を与えようとしています。上部の部分は50％の不透明度を持ち、残りのビューは100％の不透明度を持つ必要があります。

これはそうのように、CAGradientLayerで行うことは非常に簡単です：

- (void)addTopOpacityMask 
{ 
    CAGradientLayer *gradientLayer = [CAGradientLayer layer]; 
    gradientLayer.frame = self.tableView.frame; 

    id transparent = (id)[UIColor clearColor].CGColor; 
    id opaque = (id)[UIColor blackColor].CGColor; 
    gradientLayer.colors = @[transparent, opaque, opaque]; 
    gradientLayer.locations = @[@0.1, @0.11, @1]; 
    self.tableView.superview.layer.mask = gradientLayer; 
} 

しかし、私が言うことができるものと

は、 locationsプロパティのすべての値が一意である必要がありますので、常に小さな勾配が存在します（私は望んでいない）。場所を設定する

このマスクの高さを場所に変換する必要がある場合は、非常にセクシーな解決策のようです。

私はCAShapeLayerの使用について考えていました。下のコードを参照して、マスクとしてトップ部分を作成しましたが、マスクがトップ部分のみを覆うので、これは明らかに残りのテーブルビューを切り捨てます。

- (void)addTopOpacityMask 
{ 
    CAShapeLayer *shapeLayer = [CAShapeLayer layer]; 
    shapeLayer.fillRule = kCAFillRuleEvenOdd; 
    shapeLayer.fillColor = [UIColor blackColor].CGColor; 
    shapeLayer.opacity = 0.5; 
    CGRect maskRect = CGRectMake(0, 0, CGRectGetWidth(self.tableView.frame), 76); 

    CGPathRef path = CGPathCreateWithRect(maskRect, NULL); 
    shapeLayer.path = path; 
    CGPathRelease(path); 

    self.tableView.superview.layer.mask = shapeLayer; 
} 

私は何が欠けていますか？

テーブルビューの上部に透明なビューを50％追加するのではなく、マスクする必要がある理由は簡単です。テーブルビューには透明な背景もあり、ユーザーがその下をスクロールしたときにナビゲーションバーが表示されるようにしたい（yahoo天気アプリの動作/使用方法と同様）。

EDIT：

を明確にするために、これがデフォルト（あなたがナビゲーションバーを見ることができない旨の通知）によってどのように見えるかです：

そして、このことがどうなるかでありますテーブルビューの下にスクロールし始めると（テーブルビューのアルファは途切れますが、半透明のビューの背景色は変更されません）、

Answer 1

もう一度編集：もう一度試してみてください。もう一度試してみてください。これはもう1回お試しください。それをもう少し遊んだ...マスクの半透明部分に本当に低い不透明度値が必要な効果を得ているようです。とにかく、このコード：

- (void)addTopOpacityMask { 

    CGRect rect = _tableView.frame; 
    CGRect r = rect; 

    UIGraphicsBeginImageContext(rect.size); 
    CGContextRef context = UIGraphicsGetCurrentContext(); 

    // fill a "top rect" with black at 5% opacity 
    r.size.height = 76; 

    CGContextSetFillColorWithColor(context, [UIColor colorWithWhite:0.0 alpha:0.05].CGColor); 
    CGContextFillRect(context, r); 

    // fill the rest of the layer with black at 100% opacity 
    r.origin.y = 76; 
    r.size.height = rect.size.height; 

    CGContextSetFillColorWithColor(context, [UIColor blackColor].CGColor); 
    CGContextFillRect(context, r); 

    // grab a UIImage from the context 
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 

    // create a Layer 
    CALayer *theLayer = [CALayer layer]; 

    // set the Layer content to the just-created image 
    theLayer.contents = (__bridge id _Nullable)(image.CGImage); 

    theLayer.frame = rect; 

    // mask the view holding the tableview 
    _tableView.superview.layer.mask = theLayer; 

} 

は私にこの結果を与える：

と

---

編集：わからない私が見ている何しかし、見ている...しかし、あなたはそれを試してみましたか？ このような？

- (void)addTopOpacityMask 
{ 
    CAGradientLayer *gradientLayer = [CAGradientLayer layer]; 
    gradientLayer.frame = self.tableView.frame; 

    id transparent = (id)[UIColor clearColor].CGColor; 
    id opaque = (id)[UIColor blackColor].CGColor; 

    // use 4 color slots 
    gradientLayer.colors = @[transparent, transparent, opaque, opaque]; 

    // and 4 color locations (I don't get an error when using 2 of the same values) 
    gradientLayer.locations = @[@0.1, @0.11, @0.11, @1]; 

    self.tableView.superview.layer.mask = gradientLayer; 
} 

---

あなたは単にこのような何か... CALayerを作成し、それを半透明の背景色を与えることができます。これを行う

CALayer *theLayer = [CALayer alloc]; 
CGRect r = tableView.bounds; 
r.size.height = 76.0; 
theLayer.frame = r; 
theLayer.backgroundColor = [UIColor colorWithWhite:0.0 alpha:0.5].CGColor; 
[tableView.superview.layer addSublayer:theLayer];