描述:滚动视图上的图片渐变 其他控件随着滚动
作者的实现方法:
工具xcode7.1
//类名 实现滚动视图 图片不随滚动视图滚动 描述文字滚动
1.新建工程 用pod导入 pod 'LGSublimationView', '~> 1.0.0'
2.引入类名和代理#import <LGSublimationViewLGSublimationView.h>
<LGSublimationViewDelegate>
主体代码
-(void)loadView
{
[super loadView];
LGSublimationView *lgSublimer = [[LGSublimationView alloc]initWithFrame:self.view.bounds];
//加载图片
NSMutableArray*views = [NSMutableArray new];
for (int i = 1; i<=4; i++) {
UIImageView *view = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
view.image = [UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",i]];
view.contentMode = UIViewContentModeScaleAspectFill;
[views addObject:view];
}
//设置标题的字体属性
lgSublimer.titleLabelTextColor = [UIColor whiteColor];
lgSublimer.descriptionLabelTextColor = [UIColor whiteColor];
lgSublimer.delegate = self;
lgSublimer.titleLabelFont = [UIFont fontWithName:@"HelveticaNeue-Light" size:20];
lgSublimer.descriptionLabelFont = [UIFont fontWithName:@"HelveticaNeue-UltraLight" size:20];
lgSublimer.titleStrings = @[@"This is title one",
@"This is title two",
@"This is title three",
@"This is title four"];
//设置描述的字体
lgSublimer.descriptionStrings = @[@"This is a description of one",
@"This is description two and also happens to be multi line, which is sweet"
,@"This is description three",
@"follow luke on twitter @lukejgeiger"];
//图片加到视图上
lgSublimer.viewsToSublime = views;
//设置视图的背景色
UIView* shadeView = [[UIView alloc]initWithFrame:lgSublimer.frame];
shadeView.backgroundColor = [UIColor blackColor];
shadeView.alpha = .5;
lgSublimer.inbetweenView = shadeView;
[self.view addSubview:lgSublimer];
}
-(void)lgSublimationView:(LGSublimationView *)view didEndScrollingOnPage:(NSUInteger)page
{
NSLog(@"Current Page %i",(int)page);
}
我的模拟方法
具体思路就是 通过滚动视图的偏移量控制图片的透明度
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
@property (nonatomic,strong)UIScrollView *scrollview;
@property UIImageView *imageview;
@property UIImageView *imageview2;
@property UIImageView *imageview3;
@property UIImageView *imageview4;
@end
//仿写的思路 背景叠加4张图片 上面覆盖透明的滚动视图 视图上加对应的4个标题通过滚动视图的偏移量控制图片的显示与否
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
_imageview4=[[UIImageView alloc]initWithFrame:CGRectMake(0,0,self.view.frame.size.width,self.view.frame.size.height)];
_imageview4.contentMode=UIViewContentModeScaleAspectFill;
_imageview4.image=[UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",4]];
[self.view addSubview:_imageview4];
_imageview3=[[UIImageView alloc]initWithFrame:CGRectMake(0,0,self.view.frame.size.width,self.view.frame.size.height)];
_imageview3.contentMode=UIViewContentModeScaleAspectFill;
_imageview3.image=[UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",3]];
[self.view addSubview:_imageview3];
_imageview2=[[UIImageView alloc]initWithFrame:CGRectMake(0,0,self.view.frame.size.width,self.view.frame.size.height)];
_imageview2.contentMode=UIViewContentModeScaleAspectFill;
_imageview2.image=[UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",2]];
[self.view addSubview:_imageview2];
_imageview=[[UIImageView alloc]initWithFrame:CGRectMake(0,0,self.view.frame.size.width,self.view.frame.size.height)];
_imageview.contentMode=UIViewContentModeScaleAspectFill;
_imageview.image=[UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",1]];
[self.view addSubview:_imageview];
//加4个label
_scrollview=[[UIScrollView alloc]initWithFrame:CGRectMake(0,0,self.view.frame.size.width, self.view.frame.size.height)];
self.scrollview.delegate=self;
self.scrollview.showsHorizontalScrollIndicator=YES;
self.scrollview.pagingEnabled=YES;
self.scrollview.scrollEnabled=YES;
self.scrollview.contentSize=CGSizeMake(4*self.view.frame.size.width,0);
self.scrollview.backgroundColor=[UIColor clearColor];
//创建4个lable
for (int i=0;i<4;i++) {
UILabel *label=[[UILabel alloc]initWithFrame:CGRectMake(100+i*self.view.frame.size.width,300,200,50)];
label.text=[NSString stringWithFormat:@"第%d个页面",i+1];
[_scrollview addSubview:label];
}
[self.view addSubview:_scrollview];
// Do any additional setup after loading the view, typically from a nib.
}
//在代理
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
//计算偏移量
if ((scrollView.contentOffset.x/self.view.frame.size.width>0)&&(scrollView.contentOffset.x/self.view.frame.size.width<1)) {
self.imageview.alpha=1-scrollView.contentOffset.x/self.view.frame.size.width;
}
if ((scrollView.contentOffset.x/self.view.frame.size.width>1)&&(scrollView.contentOffset.x/self.view.frame.size.width<2)) {
self.imageview2.alpha=2-scrollView.contentOffset.x/self.view.frame.size.width;
}
if ((scrollView.contentOffset.x/self.view.frame.size.width>2)&&(scrollView.contentOffset.x/self.view.frame.size.width<3)) {
self.imageview3.alpha=3-scrollView.contentOffset.x/self.view.frame.size.width;
}
if ((scrollView.contentOffset.x/self.view.frame.size.width>3)&&(scrollView.contentOffset.x/self.view.frame.size.width<4)) {
self.imageview4.alpha=4-scrollView.contentOffset.x/self.view.frame.size.width;
}
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end