iOS渐变动画与uiscrollview分页

时间:2014-08-30 16:45:20

标签: ios objective-c uiscrollview gradient cagradientlayer

我有一个3页的水平滚动视图。

我希望每页的背景颜色不同,并在3种颜色之间绘制渐变。

第1页用绿色,第2页用蓝色,第3页用红色。 我怎么能这样做?

我在考虑ScrollViewDidScroll委托方法:

- (void)scrollViewDidScroll:(UIScrollView *)sender
{

CGFloat pageWidth = self.statisticScrollView.frame.size.width;

float fractionalPage = self.statisticScrollView.contentOffset.x / pageWidth;
NSLog(@"fractional Page: %f", fractionalPage);

NSInteger lowerNumber = floor(fractionalPage);
NSLog(@"lower Page: %i", lowerNumber);

NSInteger upperNumber = lowerNumber + 1;
NSLog(@"upper Page: %i", upperNumber);

if (self.lastContentOffset > sender.contentOffset.x){
    //RIGHT --->
    if (lowerNumber == 0) {
        //gradient green to blue
    }else if (lowerNumber == 1){
        //gradient blue to red
    }else if (lowerNumber == 2){
        //end pages
    }
}else if (self.lastContentOffset < sender.contentOffset.x){
    //LEFT <----
    if (lowerNumber == 0) {
        //gradient blue to green
    }else if (lowerNumber == 1){
        //gradient red to blue
    }else if (lowerNumber == 2){
        //end pages
    }
}
}

我可以使用fractionalPage来设置渐变的百分比吗?

我了解了startPoint的{​​{1}}和endPoint属性,但似乎无法正常工作。

任何建议将不胜感激! 提前谢谢

1 个答案:

答案 0 :(得分:0)

startPointendPoint属性的测量值为0到1,而不是视图的坐标系,这可能是您遇到的问题。因此,要从一侧到另一侧运行渐变,您需要像这样声明它。

gradlayer.startPoint = CGPointMake(0, 0.5);
gradlayer.endPoint = CGPointMake(1, 0.5);

实现您想要做的事情的一种简单方法是使用预先配置的渐变向滚动视图添加子图层。

CGFloat width = CGRectGetWidth(self.view.frame);
CGFloat height = CGRectGetHeight(self.view.frame);

self.scroller.contentSize = CGSizeMake(3*width, height);
self.gradlayer = [CAGradientLayer layer];
self.gradlayer.frame = CGRectMake(0, 0, width*3, height);

[self.scroller.layer addSublayer:self.gradlayer];

self.gradlayer.colors = @[((id)[UIColor redColor].CGColor),((id)[UIColor greenColor].CGColor),((id)[UIColor blueColor].CGColor)];

self.gradlayer.startPoint = CGPointMake(0, 0.5);
self.gradlayer.endPoint = CGPointMake(1, 0.5);

但是,如果您的内容大小变大,这可能会导致内存问题。

我看了一下Sim,看起来似乎没有更多的页面。我去了10,它似乎与3页大致相同,但它是一个考虑因素,所以你可能不得不回到你原来根据水平偏移调整颜色数组的理论。

我认为scrollviews内部分页有效地处理其子层以避免这种情况。

甜蜜的配色方案。杰瑞加西亚会很自豪。

enter image description here