Ios 淡入UITableView的边缘

我对我的问题做了一些研究，不幸的是，我的问题没有解决办法。 最近的一次是，但仍然不是给我的

我希望我的桌子在顶部应用“不可见渐变”。如果电池与上边缘的距离为50像素，它将开始消失。离上边缘越近，零件越不可见。单元高度约为200像素，因此单元的下部需要100%可见。但是不用担心——我需要一个表视图（或表视图容器）来完成这个任务，因为类似的表可以显示其他单元格

如果表格是纯色视图的子视图，我可以通过添加一个水平渐变的图像来实现，我可以拉伸到任何宽度。该图像的顶部像素从背景的确切颜色开始，向下移动相同颜色时，alpha较少

但是。。。 我们有一个透明颜色的UITableView。表格下方没有纯色，而是图案图像/纹理，在应用程序的其他屏幕上也可能有所不同

你知道我怎样才能做到这一点吗

关于

我参加了教程并做了一些更改和补充：

• 它现在可以在所有的桌面视图上工作——即使它们是大屏幕的一部分
• 不管背景是什么，也不管tableview后面有什么，它都可以工作
• 遮罩的变化取决于表格视图的位置-当滚动到顶部时，只有底部褪色，在滚动到底部时，只有顶部褪色

1。首先导入

QuartzCore

并在控制器中设置遮罩层：

@interface mViewController : UIViewController <UIScrollViewDelegate>

编辑：无需在课堂上参考

CAGradientLayer

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>

@interface mViewController : UIViewController
.
.
@end

3.通过将其添加到控制器的

.h

中，确保您是

UIScrollViewDelegate

的代表：

@interface mViewController : UIViewController <UIScrollViewDelegate>

---

再次说明：大多数解决方案都来自cocoanatics教程。

这是我通过继承UITableView对淡入淡出表视图的版本。针对iOS 7和iOS 8进行测试

不需要实现scrollViewDidScroll，可以改用LayoutSubview

通过观察边界的变化，遮罩是 旋转发生变化时，始终正确放置

可以使用“百分比”参数更改边缘的淡入度，即 在某些情况下，找到一个看起来更好的小值

CEFadingTableView.m

#import "CEFadingTableView.h"

@interface CEFadingTableView()

@property (nonatomic) float percent; // 1 - 100%

@end

@implementation CEFadingTableView

- (void)awakeFromNib
{
    [super awakeFromNib];

    self.percent = 5.0f;

    [self addObserver:self forKeyPath:@"bounds" options:0 context:nil];
}

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
    if(object == self && [keyPath isEqualToString:@"bounds"])
    {
        [self initMask];
    }
}

- (void)dealloc
{
    [self removeObserver:self forKeyPath:@"bounds"];
}

- (void)layoutSubviews
{
    [super layoutSubviews];

    [self updateMask];
}

- (void)initMask
{
    CAGradientLayer *maskLayer = [CAGradientLayer layer];

    maskLayer.locations = @[@(0.0f), @(_percent / 100), @(1 - _percent / 100), @(1.0f)];

    maskLayer.bounds = CGRectMake(0, 0, self.frame.size.width, self.frame.size.height);

    maskLayer.anchorPoint = CGPointZero;

    self.layer.mask = maskLayer;

    [self updateMask];
}

- (void)updateMask
{
    UIScrollView *scrollView = self;

    CGColorRef outer = [UIColor colorWithWhite:1.0 alpha:0.0].CGColor;
    CGColorRef inner = [UIColor colorWithWhite:1.0 alpha:1.0].CGColor;

    NSArray *colors = @[(__bridge id)outer, (__bridge id)inner, (__bridge id)inner, (__bridge id)outer];

    if(scrollView.contentOffset.y <= 0) // top
    {
        colors = @[(__bridge id)inner, (__bridge id)inner, (__bridge id)inner, (__bridge id)outer];
    }
    else if((scrollView.contentOffset.y + scrollView.frame.size.height) >= scrollView.contentSize.height) // bottom
    {
        colors = @[(__bridge id)outer, (__bridge id)inner, (__bridge id)inner, (__bridge id)inner];
    }

    ((CAGradientLayer *)scrollView.layer.mask).colors = colors;

    [CATransaction begin];
    [CATransaction setDisableActions:YES];
    scrollView.layer.mask.position = CGPointMake(0, scrollView.contentOffset.y);
    [CATransaction commit];
}

@end

#导入“CEFadingTableView.h”
@接口CEFadingTableView（）
@属性（非原子）浮动百分比；//1 - 100%
@结束
@CEFadingTableView的实现
-（无效）从NIB中唤醒
{
[超级awakeFromNib]；
自身百分比=5.0f；
[self-addObserver:self-forKeyPath:@“bounds”选项：0上下文：nil]；
}
-（void）observeValueForKeyPath:（NSString*）对象的键路径：（id）对象更改：（NSDictionary*）更改上下文：（void*）上下文
{
if（object==self&[keyPath isEqualToString:@“bounds”]）
{
[自初始化掩码]；
}
}
-（无效）解除锁定
{
[self-removeObserver:self-forKeyPath:@“bounds”]；
}
-（无效）布局子视图
{
[超级布局子视图]；
[自我更新任务]；
}
-（无效）初始化掩码
{
CAGradientLayer*maskLayer=[CAGradientLayer层]；
maskLayer.locations=@[@（0.0f），@（百分之一百），@（百分之一至百分之一百），@（1.0f）]；
maskLayer.bounds=CGRectMake（0,0，self.frame.size.width，self.frame.size.height）；
maskLayer.anchorPoint=CGPointZero；
self.layer.mask=maskLayer；
[自我更新任务]；
}
-（void）updateMask
{
UIScrollView*scrollView=self；
CGColorRef outer=[UIColor colorWithWhite:1.0 alpha:0.0].CGColor；
CGColorRef inner=[UIColor COLORRWITHWHITE:1.0 alpha:1.0].CGColor；
NSArray*colors=@[（u桥id）外部、（u桥id）内部、（u桥id）内部、（u桥id）外部]；
if（scrollView.contentOffset.y=scrollView.contentSize.height）//底部
{
颜色=@[（__桥id）外部、（_桥id）内部、（_桥id）内部、（_桥id）内部]；
}
（（CAGradientLayer*）scrollView.layer.mask）。颜色=颜色；
[交易开始]；
[CATTransaction setDisableActions:是]；
scrollView.layer.mask.position=CGPointMake（0，scrollView.contentOffset.y）；
[CATransaction-commit]；
}
@结束

这是阿维尔·格罗斯对斯威夫特的回答的翻译

import UIKit

class mViewController: UIViewController, UIScrollViewDelegate {

    //Emitted boilerplate code

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()

        if self.tableView.layer.mask == nil {

            //If you are using auto layout
            //self.view.layoutIfNeeded()

            let maskLayer: CAGradientLayer = CAGradientLayer()

            maskLayer.locations = [0.0, 0.2, 0.8, 1.0]
            let width = self.tableView.frame.size.width
            let height = self.tableView.frame.size.height
            maskLayer.bounds = CGRect(x: 0.0, y: 0.0, width: width, height: height)
            maskLayer.anchorPoint = CGPoint.zero

            self.tableView.layer.mask = maskLayer
        }

        scrollViewDidScroll(self.tableView)
    }

    func scrollViewDidScroll(_ scrollView: UIScrollView) {

        let outerColor = UIColor(white: 1.0, alpha: 0.0).cgColor
        let innerColor = UIColor(white: 1.0, alpha: 1.0).cgColor

        var colors = [CGColor]()

        if scrollView.contentOffset.y + scrollView.contentInset.top <= 0 {
            colors = [innerColor, innerColor, innerColor, outerColor]
        } else if scrollView.contentOffset.y + scrollView.frame.size.height >= scrollView.contentSize.height {
            colors = [outerColor, innerColor, innerColor, innerColor]
        } else {
            colors = [outerColor, innerColor, innerColor, outerColor]
        }

        if let mask = scrollView.layer.mask as? CAGradientLayer {
            mask.colors = colors

            CATransaction.begin()
            CATransaction.setDisableActions(true)
            mask.position = CGPoint(x: 0.0, y: scrollView.contentOffset.y)
            CATransaction.commit()
        }

    }

    //Emitted boilerplate code
}

导入UIKit
类mViewController:UIViewController、UIScrollViewDelegate{
//发出的样板代码
重写func viewdilayoutsubviews（）{
super.viewDidLayoutSubviews（）
如果self.tableView.layer.mask==nil{
//如果您使用的是自动布局
//self.view.layoutifneed（）
let maskLayer:CAGradientLayer=CAGradientLayer（）
maskLayer.locations=[0.0,0.2,0.8,1.0]
让宽度=self.tableView.frame.size.width
让高度=self.tableView.frame.size.height
maskLayer.bounds=CGRect（x:0.0，y:0.0，宽度：宽度，高度：高度）
maskLayer.anchorPoint=CGPoint.zero
self.tableView.layer.mask=maskLayer
}
scrollViewDidScroll（self.tableView）
}
func scrollViewDidScroll（scrollView:UIScrollView）{
让outerColor=UIColor（白色：1.0，alpha:0.0）。cgColor
让innerColor=UIColor（白色：1.0，alpha:1.0）.cgColor
变量颜色=[CGColor]（）
如果scrollView.contentOffset.y+scrollView.contentInset.top=scrollView.contentSize.height{
颜色=[outerColor，innerColor，innerColor，innerColor]
}否则{
颜色=[outerColor，innerColor，innerColor，outerColor]
}
如果let mask=scrollView.layer.mask as？CAGradientLayer{
mask.colors=颜色
CATransaction.begin（）
CATTransaction.setDisableActions（true）
mask.position=CGPoint（x:0.0，y:scrollView.contentOffset.y）
CATransaction.commit（）
}
}
//发出的样板代码
}

Swift版本的@vict

import UIKit

class mViewController: UIViewController, UIScrollViewDelegate {

    //Emitted boilerplate code

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()

        if self.tableView.layer.mask == nil {

            //If you are using auto layout
            //self.view.layoutIfNeeded()

            let maskLayer: CAGradientLayer = CAGradientLayer()

            maskLayer.locations = [0.0, 0.2, 0.8, 1.0]
            let width = self.tableView.frame.size.width
            let height = self.tableView.frame.size.height
            maskLayer.bounds = CGRect(x: 0.0, y: 0.0, width: width, height: height)
            maskLayer.anchorPoint = CGPoint.zero

            self.tableView.layer.mask = maskLayer
        }

        scrollViewDidScroll(self.tableView)
    }

    func scrollViewDidScroll(_ scrollView: UIScrollView) {

        let outerColor = UIColor(white: 1.0, alpha: 0.0).cgColor
        let innerColor = UIColor(white: 1.0, alpha: 1.0).cgColor

        var colors = [CGColor]()

        if scrollView.contentOffset.y + scrollView.contentInset.top <= 0 {
            colors = [innerColor, innerColor, innerColor, outerColor]
        } else if scrollView.contentOffset.y + scrollView.frame.size.height >= scrollView.contentSize.height {
            colors = [outerColor, innerColor, innerColor, innerColor]
        } else {
            colors = [outerColor, innerColor, innerColor, outerColor]
        }

        if let mask = scrollView.layer.mask as? CAGradientLayer {
            mask.colors = colors

            CATransaction.begin()
            CATransaction.setDisableActions(true)
            mask.position = CGPoint(x: 0.0, y: scrollView.contentOffset.y)
            CATransaction.commit()
        }

    }

    //Emitted boilerplate code
}

class FadingTableView : UITableView {
  var percent = Float(0.05)

  private let outerColor = UIColor(white: 1.0, alpha: 0.0).cgColor
  private let innerColor = UIColor(white: 1.0, alpha: 1.0).cgColor

  override func awakeFromNib() {
    super.awakeFromNib()
    addObserver(self, forKeyPath: "bounds", options: NSKeyValueObservingOptions(rawValue: 0), context: nil)
  }

  override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
    if object is FadingTableView && keyPath == "bounds" {
        initMask()
    }
  }

  deinit {
    removeObserver(self, forKeyPath:"bounds")
  }

  override func layoutSubviews() {
    super.layoutSubviews()
    updateMask()
  }

  func initMask() {
    let maskLayer = CAGradientLayer()
    maskLayer.locations = [0.0, NSNumber(value: percent), NSNumber(value:1 - percent), 1.0]
    maskLayer.bounds = CGRect(x:0, y:0, width:frame.size.width, height:frame.size.height)
    maskLayer.anchorPoint = CGPoint.zero
    self.layer.mask = maskLayer

    updateMask()
  }

  func updateMask() {
    let scrollView : UIScrollView = self

    var colors = [CGColor]()

    if scrollView.contentOffset.y <= -scrollView.contentInset.top { // top
        colors = [innerColor, innerColor, innerColor, outerColor]
    }
    else if (scrollView.contentOffset.y + scrollView.frame.size.height) >= scrollView.contentSize.height { // bottom
        colors = [outerColor, innerColor, innerColor, innerColor]
    }
    else {
        colors = [outerColor, innerColor, innerColor, outerColor]
    }

    if let mask = scrollView.layer.mask as? CAGradientLayer {
        mask.colors = colors

        CATransaction.begin()
        CATransaction.setDisableActions(true)
        mask.position = CGPoint(x: 0.0, y: scrollView.contentOffset.y)
        CATransaction.commit()
     }
  }
}