IOS 类似直播的tableView 顶部透明度渐变效果

这篇具有很好参考价值的文章主要介绍了IOS 类似直播的tableView 顶部透明度渐变效果。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

IOS 类似直播的tableView 顶部透明度渐变效果

在工程中,需要类似直播的tableView 顶部透明度渐变效果。这个渐变的效果呢,而且不能有覆盖在背景图上的感觉。底部背景图在没有数据的情况下,没有遮罩效果。首先想到了CAGradientLayer。

CAGradientLayer主要属性

  • colors

var colors: [AnyObject]?
一个内部是CGColorRef的数组,规定所有的梯度所显示的颜色,默认为nil

  • locations

var locations: [NSNumber]?
一个内部是NSNumber的可选数组,规定所有的颜色梯度的区间范围,选值只能在0到1之间,并且数组的数据必须单增,默认值为nil

  • endPoint

var endPoint: CGPoint
图层颜色绘制的终点坐标,也就是阶梯图层绘制的结束点,默认值是(0.5,1.0)

  • startPoint

var startPoint: CGPoint
与endPoint相互对应,就是绘制阶梯图层的起点坐标,绘制颜色的起点,默认值是(0.5,0.0)

  • type

var type:String
绘制类型,默认值是kCAGradientLayerAxial,也就是线性绘制,各个颜色阶层直接的变化是线性的

主要是通过一个背景View:layerImageView,通过设置layerImageView的maskLayer:gradientLayer,之后再讲tableView放置在layerImageView上就可以实现这样的效果了。

具体代码如下

    #import "ViewController.h"

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>

@property (nonatomic, strong) UIImageView *backImageView;
@property (nonatomic, strong) UIImageView *layerImageView;
@property (nonatomic, strong) CAGradientLayer *gradientLayer;
@property (nonatomic, strong) UITableView *tableView;
@property (nonatomic, strong) NSMutableArray *dataList;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    self.view.backgroundColor = [UIColor brownColor];
    self.dataList = @[@"真理惟一可靠的标准就是永远自相符合。",@"时间是一切财富中最宝贵的财富。",@"世界上一成不变的东西,只有“任何事物都是在不断变化的”这条真理。",@"真理惟一可靠的标准就是永远自相符合。",@"时间是一切财富中最宝贵的财富。",@"世界上一成不变的东西,只有“任何事物都是在不断变化的”这条真理。",@"真理惟一可靠的标准就是永远自相符合。",@"时间是一切财富中最宝贵的财富。",@"世界上一成不变的东西,只有“任何事物都是在不断变化的”这条真理。",@"真理惟一可靠的标准就是永远自相符合。",@"时间是一切财富中最宝贵的财富。",@"世界上一成不变的东西,只有“任何事物都是在不断变化的”这条真理。"];
    [self createGradientView];
}

//创建渐变视图
- (void)createGradientView{
    
    self.backImageView.frame = self.view.bounds;
    [self.view addSubview:self.backImageView];
    
    self.layerImageView.frame = CGRectMake(0.0, 200, self.view.frame.size.width, self.view.frame.size.height - 200);
    [self.view addSubview:self.layerImageView];
    
    [self.layerImageView addSubview:self.tableView];
    self.tableView.frame = self.layerImageView.bounds;
    
    self.gradientLayer.frame = self.layerImageView.bounds;
    
    NSArray *colors = @[(id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:0.5].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        (id)[UIColor colorWithWhite:0 alpha:1.0].CGColor,
                        ];
    [self.gradientLayer setColors:colors];
    self.gradientLayer.hidden = NO;
}

- (CAGradientLayer *)gradientLayer {
    if (!_gradientLayer) {
        _gradientLayer = [CAGradientLayer layer];
        NSArray *colors = @[(id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            (id)[UIColor colorWithWhite:0 alpha:0].CGColor,
                            ];
        [_gradientLayer setColors:colors];
        [_gradientLayer setStartPoint:CGPointMake(0, 0)];
        [_gradientLayer setEndPoint:CGPointMake(0, 1)];
        _gradientLayer.hidden = YES;
        [self.layerImageView.layer setMask:_gradientLayer];
    }
    return _gradientLayer;
}

- (UIImageView *)layerImageView {
    if (!_layerImageView) {
        _layerImageView = [[UIImageView alloc] initWithFrame:CGRectZero];
        _layerImageView.backgroundColor = [UIColor clearColor];
        _layerImageView.userInteractionEnabled = YES;
    }
    return _layerImageView;
}

- (UIImageView *)backImageView {
    if (!_backImageView) {
        _backImageView = [[UIImageView alloc] initWithFrame:CGRectZero];
        _backImageView.backgroundColor = [UIColor clearColor];
        _backImageView.image = [UIImage imageNamed:@"login_bg_image"];
        _backImageView.contentMode = UIViewContentModeScaleAspectFill;
        _backImageView.userInteractionEnabled = YES;
    }
    return _backImageView;
}

- (UITableView *)tableView {
    if (!_tableView) {
        _tableView = [[UITableView alloc] initWithFrame:CGRectZero style:UITableViewStylePlain];
        _tableView.backgroundColor = [UIColor clearColor];
        _tableView.delegate = self;
        _tableView.dataSource = self;
        _tableView.scrollEnabled = YES;
        _tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
        _tableView.estimatedRowHeight = 0;
        _tableView.estimatedSectionHeaderHeight = 0;
        _tableView.estimatedSectionFooterHeight = 0;
    }
    return _tableView;
}

#pragma mark UITableViewDataSource
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 1;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return self.dataList.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *cellIdentifier = @"SDUsualAddressTableViewCell";
    UITableViewCell *cell = (UITableViewCell *)[tableView dequeueReusableCellWithIdentifier:cellIdentifier];
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
        cell.backgroundColor = [UIColor blackColor];
    }
    
    cell.selectionStyle = UITableViewCellSelectionStyleNone;
    cell.textLabel.font = [UIFont systemFontOfSize:14];
    cell.textLabel.textColor = [UIColor whiteColor];
    cell.textLabel.text = [self.dataList objectAtIndex:indexPath.row];

    return cell;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

本文为学习的记录,以便之后查阅。谢谢。文章来源地址https://www.toymoban.com/news/detail-532180.html

到了这里,关于IOS 类似直播的tableView 顶部透明度渐变效果的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 透明度和透明贴图制作玻璃水杯

    模型透明度是指一个物体或模型在呈现时的透明程度。它决定了物体在渲染时,是否显示其后面的物体或背景。 在图形渲染中,透明度通常以0到1之间的值表示。值为0表示完全透明,即物体不可见,背景或其他物体完全穿透;值为1表示完全不透明,即物体完全可见,没有透

    2024年02月07日
    浏览(53)
  • Unity之透明度混合与ps的透明度混合计算结果不一致(gamma矫正和线性空间)

    前段时间学习shader时发现了一个问题,一张纯红色透明度为128的图片叠加在一张纯绿色的图片上在unity中得出的结果与ps中的结果不一致。网上查找了ps中的透明混合的公式为  color = A.rgb*A.alpha + B.rgb*(1-A.alpha)。自己计算了一下结果总是不对。  红色透明度128的图           

    2024年02月05日
    浏览(49)
  • Android 透明度设置

    目录 一、透明度对照表 二、透明度介绍 三、透明度设置 3.1 xml设置 3.2 代码设置   注:00是完全透明,FF就是完全不透明         我们的UI小姐姐就喜欢给 「不透明度」 ,这个需要自己判断一下。         Android中的颜色值通常遵循RGB/ARGB标准,使用时通常以“#”字符

    2024年02月05日
    浏览(50)
  • uniapp中map组件打点/地图上显示圆/设置map圆的透明度(十六进制颜色透明度)

    一般来说我们都是想设置成透明的圆,十六进制的后两位表示颜色 eg:#0000006A 6A就是表示透明度,数字越大透明度越高

    2024年02月12日
    浏览(50)
  • ObjectArx 设置填充透明度问题

    初始化透明度参数AcCmTransparency对象时,需要调用setAlpha设置透明度值,这里传入的值是0 255,但cad特性面板上显示的是0 90,且经过测试发现,传入值与特性面板显示的值也是不同的,比如传入90,显示64,百度搜索了个寂寞,最后还是在谷歌找到了答案,原来设置的值和特性面

    2024年02月15日
    浏览(49)
  • Android中设置颜色透明度

    1.布局中的xml设置 2.在代码中用的话就是用Java代码设置是这样设置的 3.从FF开始表示完全不透明,到00表示完全透明。左边的是透明百分比,右边是透明的代号,如果你想设置颜色透明50%,就是 #809E9E9E

    2024年02月14日
    浏览(43)
  • WPF 控件设置透明度的方法

    方法一:通过 Opacity 属性设置背景色透明度。范围从0-1,0表示完全透明,看不见。     通过 Opacity 属性去改变控件透明度 会影响子控件的透明度,是因为Opacity属性是在UIElement 类(以及Brush基类)中定义,所有元素都具有该属性; 界面如下图图  方法二:通过Background 属性的

    2024年02月11日
    浏览(49)
  • 人工智能透明度的最新进展

    作者:禅与计算机程序设计艺术 人工智能(AI)已经成为社会发展的重要组成部分。随着人工智能技术的不断发展,在法律界也逐渐将其作为重要的驱动力之一。然而,由于人工智能算法和模型的黑箱特性,加之对人工智能模型的理解能力有限,因此导致人工智能系统产生的

    2024年02月08日
    浏览(52)
  • Unity中特效透明度动态设置

    在Unity开发中,特效的透明度无法直接使用代码或者动画直接控制很不方便,便制作了一个一个脚本,专用来控制一个节点下的所有子节点的透明度。  在其父节点添加即可  

    2024年02月15日
    浏览(42)
  • Android 透明度颜色值对照表

      注:00是完全透明,FF就是完全不透明         我们的UI小姐姐就喜欢给 「不透明度」 ,这个需要自己判断一下。 二、透明度介绍         Android中的颜色值通常遵循RGB/ARGB标准,使用时通常以“#”字符开头,以16进制表示。         Android中的颜色值一般格式是:#AAR

    2024年04月14日
    浏览(74)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包