Hoạt ảnh UIScrollview tùy thuộc vào độ lệch nội dung

Question

Tôi đang sử dụng UIScrollView ngang và tôi muốn chuyển đổi màu nền tùy thuộc vào giá trị x của bù đắp nội dung.

Ví dụ: Chiều rộng của UIScrollView là 640px. Khi độ lệch nội dung bằng 0px, màu nền phải có màu đỏ. Khi bù đắp nội dung là 320 px, nền phải có màu vàng. Nhưng phần quan trọng nhất là khi UIScrollview ở giữa 0px và 320px, màu nền phải nằm giữa màu đỏ và màu vàng.

Gợi ý: Ứng dụng twitter cho iOS có cùng hoạt ảnh khi bạn vuốt sang trái từ tìm kiếm. Nhãn trên điều hướng hơi biến mất.

Answer 1

Bạn cần phải tạo ra các màu sắc tùy thuộc vào tỷ lệ bù đắp.

Cách dễ nhất để tạo sự thay đổi giữa các màu như thế này là sử dụng không gian màu HSB.

Ngoài ra, đây không phải là hoạt ảnh. Hiệu ứng "hoạt hình" được cung cấp cho bạn bởi scrollview. Bạn chỉ cần đặt màu mỗi khi chế độ xem cuộn thay đổi.

Trong phương thức ủy nhiệm, bạn có thể làm một việc như thế này.

Chỉnh sửa để làm cho linh hoạt hơn

// this just calculates the percentages now and passes it off to another method. 
- (void)scrollViewDidScroll:(UIScrollView *)scrollView 
{ 
    // vertical 
    CGFloat maximumVerticalOffset = scrollView.contentSize.height - CGRectGetHeight(scrollView.frame); 
    CGFloat currentVerticalOffset = scrollView.contentOffset.y; 

    // horizontal 
    CGFloat maximumHorizontalOffset = scrollView.contentSize.width - CGRectGetWidth(scrollView.frame); 
    CGFloat currentHorizontalOffset = scrollView.contentOffset.x; 

    // percentages 
    CGFloat percentageHorizontalOffset = currentHorizontalOffset/maximumHorizontalOffset; 
    CGFloat percentageVerticalOffset = currentVerticalOffset/maximumVerticalOffset; 

    [self scrollView:scrollView didScrollToPercentageOffset:CGPointMake(percentageHorizontalOffset, percentageVerticalOffset)]; 
} 

// this just gets the percentage offset. 
// 0,0 = no scroll 
// 1,1 = maximum scroll 
- (void)scrollView:(UIScrollView *)scrollView didScrollToPercentageOffset:(CGPoint)percentageOffset 
{ 
    UIColor *HSBColor = [self HSBColorForOffsetPercentage:percentageOffset.x]; 

    UIColor *RGBColor = [self RGBColorForOffsetPercentage:percentageOffset.x]; 
} 

// HSB color just using Hue 
- (UIColor *)HSBColorForOffsetPercentage:(CGFloat)percentage 
{ 
    CGFloat minColorHue = 0.0; 
    CGFloat maxColorHue = 0.2; // this is a guess for the yellow hue. 

    CGFloat actualHue = (maxColorHue - minColorHue) * percentage + minColorHue; 

    // change these values to get the colours you want. 
    // I find reducing the saturation to 0.8 ish gives nicer colours. 
    return [UIColor colorWithHue:actualHue saturation:1.0 brightness:1.0 alpha:1.0]; 
} 

// RGB color using all R, G, B values 
- (UIColor *)RGBColorForOffsetPercentage:(CGFloat)percentage 
{ 
    // RGB 1, 0, 0 = red 
    CGFloat minColorRed = 1.0; 
    CGFloat minColorGreen = 0.0; 
    CGFloat minColorBlue = 0.0; 

    // RGB 1, 1, 0 = yellow 
    CGFloat maxColorRed = 1.0; 
    CGFloat maxColorGreen = 1.0; 
    CGFloat maxColorBlue = 0.0; 

    // if you have specific beginning and end RGB values then set these to min and max respectively. 
    // it should even work if the min value is greater than the max value. 

    CGFloat actualRed = (maxColorRed - minColorRed) * percentage + minColorRed; 
    CGFloat actualGreen = (maxColorGreen - minColorGreen) * percentage + minColorGreen; 
    CGFloat actualBlue = (maxColorBlue - minColorBlue) * percentage + minColorBlue; 

    return [UIColor colorWithRed:actualRed green:actualGreen blue:actualBlue alpha:1.0]; 
} 

Tôi không biết làm thế nào phương pháp RGB sẽ thực hiện trên các giá trị giữa. Nó có thể đi màu nâu ở giữa vv ... nhưng bạn có thể chơi xung quanh.

này nên cung cấp cho bạn một ý tưởng về làm thế nào để động ANYTHING sử dụng giao diện cuộn như một cách để kiểm soát nó.

Sử dụng phương pháp này bạn có thể kiểm soát độ mờ, kích thước, xoay, kích thước phông chữ, v.v. Bạn thậm chí có thể kết hợp nhiều thứ (như tôi đã làm với RGB).

Answer 2

Trong đại biểu scrollview bạn thử một cái gì đó như thế này:

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{ 
    CGPoint a = self.mainScrollView.contentOffset; 
    if(a.x >= 320){ 
     [UIView animateWithDuration:0.5 animations:^{ 
      [self.view setBackgroundColor:[UIColor redColor]]; 
     }]; 
    } 
    else{ 
     [UIView animateWithDuration:0.5 animations:^{ 
      [self.view setBackgroundColor:[UIColor yellowColor]]; 
     }]; 
    } 
}