美文网首页
IOS下拉放大图片

IOS下拉放大图片

作者: 尕qin | 来源:发表于2016-10-14 17:04 被阅读0次

先看下效果图吧

aaaa.gif

图片录制大了点不好意思!

介绍

先讲一些思路吧:

注意:

很多人以为这个图片是表头,如果你把它设置做表头是不可能出现这种效果的。

布局方法:

直接加在表上面。

例子

我用的是第一种
宏定义和属性

//屏幕宽度
#define SCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width;
@property(weak,nonatomic)UIScrollView *scrollView;
@property(weak,nonatomic)UIPageControl *page;
@property(weak,nonatomic)UIButton *searchBtn;

Scrollview 图片布局跟平时一样布局自己加上去就行了,不贴那么多代码了

UIScrollView *scrollView=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_WIDTH*5/7)];
scrollView.delegate=self;
//scrollView直接加tableView上面
[self.tableView addSubview:scrollView];

//红色的条 可以换成其他控件
UIButton *searchBtn=[UIButton buttonWithType:UIButtonTypeCustom];
searchBtn.frame=CGRectMake(10, SCREEN_WIDTH*5/7-40, SCREEN_WIDTH-20, 30);
//注意。加在tableView上别加在scrollView上
[self.tableView addSubview:searchBtn];
self.scrollView=scrollView;
self.page=page;

//滚动的点UIPageControl
UIPageControl *page=[[UIPageControl alloc]initWithFrame:CGRectMake(0,SCREEN_WIDTH*5/7-10, SCREEN_WIDTH, 10)];
//注意。加在tableView上别加在scrollView上
[self.tableView addSubview:page];
self.searchBtn=searchBtn;

为什么红色的条和page不是加在scrollView上呢?因为我使用的是transform放大,如果不是用transform放大scrollView里面的图片布局非常难了。

下面是下拉放大

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    //判断下拉的时候 SCREEN_WIDTH*5/7是scrollView的高度再*2
    //解释一下为什么*2 一个视图缩小成0.5倍,体积为原来的1/4,所以*2,高度就对了
    if (scrollView.contentOffset.y<0) {
        self.scrollView.transform=CGAffineTransformMakeScale(1-scrollView.contentOffset.y/SCREEN_WIDTH*5/7*2, 1-scrollView.contentOffset.y/SCREEN_WIDTH*5/7*2);
        //让scrollView一直在最顶 改变scrollView的y值 
        CGRect tempFrame=self.scrollView.frame;
        tempFrame.origin.y=scrollView.contentOffset.y;
        self.scrollView.frame=tempFrame;
    }
}

下面把tableView的第0个区头空出scrollView的高度,别返回nil (不返会nil,scrollView会被区头盖在) 就不会挡住tableView需要显示的东西了

-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    if (section==0) {
        //第一个区空出表头高度
        return  SCREEN_WIDTH*5/7;
    }else{
        return 30;
    }
}
-(UIView*)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    if (section==0) {
        return nil;
    }else{
        UIView *view=[[UIView alloc] init];
        return view;
    }
}

还是不行的可以留言问我,觉得不错的点个赞。

相关文章

  • iOS 下拉图片放大

    详情页,tableview的headview,下拉图片放大

  • iOS下拉放大图片

    闲来无事,模仿小恩爱写了个图片下拉放大的demo。效果如下: 具体实现特别简单,主要实现代码如下: 下拉时实现放大...

  • IOS下拉放大图片

    先看下效果图吧 图片录制大了点不好意思! 介绍 先讲一些思路吧: 注意: 很多人以为这个图片是表头,如果你把它设置...

  • IOS下拉放大图片

    个人很喜欢这种效果,后面会在这个项目更新新效果。版本记录2017.1.24 (最基础图片下拉放大)https://...

  • 简单实现下拉图片放大④ + pageControl指示器

    传送门 : 简单实现下拉图片放大① - 全屏手势简单实现下拉图片放大② - 单张图简单实现下拉图片放大③ - 定时...

  • 利用UITableiew实现下拉放大图片

    表格头视图实现下拉放大图片需要签订 // 下拉放大图片 -(void)xialafangda{ UIImageVi...

  • 图片下拉放大

    //-----------------------------ViewController.m----------...

  • 下拉放大图片

    现在越来越多的APP中存在下拉放大图片的效果,今天贡献一下我的实现这种方法的原理,和我遇到的坑。?效果图 使用懒加...

  • 图片下拉放大

  • 图片下拉放大

    传送门//_bgImageView是要放大的图片,ImageWidth、ImageHeight分别是 _bgIma...

网友评论

      本文标题:IOS下拉放大图片

      本文链接:https://www.haomeiwen.com/subject/yaagyttx.html