Make background color change during scroll

前端 未结 5 1891
太阳男子
太阳男子 2021-01-14 07:10

I have an onboarding section of my app with 4 pages the users scrolls through horizontally to get an idea of how to use the app (standard). I want the background color to tr

5条回答
  •  余生分开走
    2021-01-14 07:43

    For anyone interested. This is the solution. I combined some answers I found on stack and adapted it to use 4 colors

    - (void)scrollViewDidScroll:(UIScrollView *)scrollView  {
    CGFloat pageWidth = self.scrollView.frame.size.width;
    float fractionalPage = self.scrollView.contentOffset.x / pageWidth;
    NSInteger page = lround(fractionalPage);
    self.pageControl.currentPage = page;
    
    // horizontal
    CGFloat maximumHorizontalOffset = scrollView.contentSize.width - CGRectGetWidth(scrollView.frame);
    CGFloat currentHorizontalOffset = scrollView.contentOffset.x;
    
    // percentages
    CGFloat percentageHorizontalOffset = currentHorizontalOffset / maximumHorizontalOffset;
    
    NSLog(@"content offfset: %f", percentageHorizontalOffset);
    
    if (percentageHorizontalOffset < 0.333333) {
        self.view.backgroundColor = [self fadeFromColor:self.colorArray[0] toColor:self.colorArray[1] withPercentage:percentageHorizontalOffset*3];
    } else if (percentageHorizontalOffset >= 0.333333 && percentageHorizontalOffset < 0.666667) {
        self.view.backgroundColor = [self fadeFromColor:self.colorArray[1] toColor:self.colorArray[2] withPercentage:(percentageHorizontalOffset-0.333333)*3];
    } else if (percentageHorizontalOffset >= 0.666667) {
        self.view.backgroundColor = [self fadeFromColor:self.colorArray[2] toColor:self.colorArray[3] withPercentage:(percentageHorizontalOffset-0.666667)*3];
    }
    }
    
    - (UIColor *)fadeFromColor:(UIColor *)fromColor toColor:(UIColor *)toColor withPercentage:(CGFloat)percentage
    {
        // get the RGBA values from the colours
    CGFloat fromRed, fromGreen, fromBlue, fromAlpha;
    [fromColor getRed:&fromRed green:&fromGreen blue:&fromBlue alpha:&fromAlpha];
    
    CGFloat toRed, toGreen, toBlue, toAlpha;
    [toColor getRed:&toRed green:&toGreen blue:&toBlue alpha:&toAlpha];
    
    //calculate the actual RGBA values of the fade colour
    CGFloat red = (toRed - fromRed) * percentage + fromRed;
    CGFloat green = (toGreen - fromGreen) * percentage + fromGreen;
    CGFloat blue = (toBlue - fromBlue) * percentage + fromBlue;
    CGFloat alpha = (toAlpha - fromAlpha) * percentage + fromAlpha;
    
    // return the fade colour
    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
    }    
    

提交回复
热议问题