经验之谈—实现图片下拉放大的效果

40 篇文章 0 订阅
  • 这里我们主要是用一下,如何能保持原来的图片的宽高比来轻松的实现放大的效果,主要的是UIViewContentModeScaleAspectFill这个起的效果:

  • 我们用tableView来展示这个效果吧


  • 我们这里并没有计算图片的宽高比,直接用UIViewContentModeScaleAspectFill来实现

#import "ViewController.h"
const CGFloat ZYTopViewH = 350;
@interface ViewController ()
@property(nonatomic,weak)UIImageView *topView;


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];


    self.tableView.contentInset = UIEdgeInsetsMake(ZYTopViewH * 0.5, 0, 0, 0);
    UIImageView *topView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"biaoqingdi"]];
    topView.frame = CGRectMake(0, -ZYTopViewH, 375, ZYTopViewH);

    topView.contentMode = UIViewContentModeScaleAspectFill;

    [self.tableView insertSubview:topView atIndex:0];

    self.topView = topView;

}
  • 实现tableView的数据源方法
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 20;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{


    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cell"];
    if (cell == nil)
    {
       cell =  [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"];
    }

    cell.textLabel.text = [NSString stringWithFormat:@"test---%zd",indexPath.row];

    return cell;
}
  • 最后用scrollViewDidScroll来监听拖动事件
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat offsetY = scrollView.contentOffset.y;

    CGFloat offsetH = -ZYTopViewH * 0.5 - offsetY;

    if (offsetH < 0) return;

    CGRect frame = self.topView.frame;
    frame.size.height = ZYTopViewH + offsetH;
    self.topView.frame = frame;


}

看一下效果:
下拉放大


这里主要是讲UIViewContentModeScaleAspectFill的作用,但是我觉得这个demo中也牵扯到一些东西,也顺便讲讲

  • 为什么将UIImageView采用
[self.tableView insertSubview:topView atIndex:0];

这种方式来添加,其实一开始我也是直接让UIImageView作为headerView的,但是作为headerView的话,就不能让图片一开始显示一部分在外面了,也不好控制

  • 然后偏移量等,就自然而然的想到了。多尝试,就多收获。。。。
  • 3
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值