UIScrollview Animation abhängig vom Inhalt Offset

Question

Ich benutze eine horizontale UIScrollView, und ich möchte eine Hintergrundfarbe Übergang abhängig von der x-Wert des Inhalts Offset.

Beispiel: Die Breite von UIScrollView ist 640px. Wenn der Inhaltsoffset gleich 0px ist, muss die Hintergrundfarbe rot sein. Wenn der Inhaltsoffset 320 px beträgt, muss der Hintergrund gelb sein. Aber der wichtigste Teil ist, wenn die UIScrollview zwischen 0px und 320px liegt, muss die Hintergrundfarbe zwischen rot und gelb sein.

Hinweis: Die Twitter App für iOS hat die gleiche Animation, wenn Sie von einer Suche nach links wischen. Die Beschriftung auf der Navigation verschwindet leicht.

Answer 1

Sie müssen die Farbe erstellen, die auf den Offset-Prozentsatz abhängig.

Der einfachste Weg, um eine solche Farbverschiebung zu erzeugen, ist die Verwendung des HSB-Farbraums.

Auch dies ist keine Animation. Der Effekt "Animation" wird Ihnen von der Scrollansicht gegeben. Sie müssen die Farbe nur jedes Mal festlegen, wenn sich die Bildlaufansicht ändert.

In der Delegate-Methode könnten Sie so etwas tun.

bearbeiten flexibler

// 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]; 
} 

ich nicht zu machen wissen, wie die RGB-Methode auf Mittelwerte durchführen wird. Es kann braun in der Mitte usw. gehen, aber Sie können herumspielen.

Dies sollte Ihnen eine Idee geben, wie ANYTHING mit der Bildlaufansicht als eine Möglichkeit, es zu steuern animieren.

Mit dieser Methode können Sie die Deckkraft, Größe, Drehung, Schriftgröße, etc ... Sie können sogar mehrere Dinge kombinieren (wie ich mit RGB).

Answer 2

In Ihrem Scroll Delegierten versuchen, etwas wie folgt aus:

-(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]]; 
     }]; 
    } 
}