13

以前にこの質問をしたことがありますが、あなたの助けを借りて何を達成したいのかを明確にするために、もう一度連絡したいと思います. 時間の経過とともに (サイクルで) わずかに変化する太陽天気アプリ (スクリーンショットを提供) の背景と同様に、xCode で iOS アプリケーションの背景を作成する方法を知りたいと思っていました。ご覧のとおり、グラデーションは非常に滑らかで、明らかに 2 つ以上の主要なポイントが含まれています。コードの例またはスニペットに関するヘルプは大歓迎です。ありがとう、ベン。

スクリーンショット 1 スクリーンショット 2

4

2 に答える 2

16

私が必要とするのは：

  1. CAGradientLayerビュー コントローラ (またはカスタム ビュー) にa を追加します。例:

    @property (nonatomic, retain) CAGradientLayer *gradient;

  2. ビュー コントローラーの viewDidLoad で、グラデーション レイヤーを作成してビューに追加します。

    self.gradient = [CAGradientLayer layer];
gradient.frame = self.view.bounds;
gradient.colors = [NSArray arrayWithObjects:
               (id)topColor.CGColor,
               (id)bottomColor.CGColor,
               nil];
gradient.locations = [NSArray arrayWithObjects:
                  [NSNumber numberWithFloat:0.0f],
                  [NSNumber numberWithFloat:0.7],
                  nil];
[self.view.layer addSublayer:self.gradient];

    3a. self.gradient次のようにして、適切な間隔で更新するコントローラーに NSTimer を追加します。

      topColor = ...; bottomColor = ...;
  NSArray* newColors = [NSArray arrayWithObjects:
                 (id)topColor.CGColor,
                 (id)bottomColor.CGColor,
                 nil];
 [(CAGradientLayer *)self.layer setColors:newColors];

    これにより、各ステップでグラデーションに使用する色を正確に決定できます。それ以外の場合は、次のようなアニメーションを試すことができます。

    3b. このようにアニメーションを追加し、

    - (void)animateLayer... {

  [UIView animateWithDuration:duration 
                        delay:0
                      options:UIViewAnimationOptionCurveEaseInOut
                   animations:^{
    [CATransaction begin];
    [CATransaction setAnimationDuration:duration];

      topColor = ...; bottomColor = ...;
      NSArray* newColors = [NSArray arrayWithObjects:
                 (id)topColor.CGColor,
                 (id)bottomColor.CGColor,
                 nil];
     [(CAGradientLayer *)self.layer setColors:newColors];

     [CATransaction commit];
  }
          completion:^(BOOL b) {
              [self animateLayer..];
          }];
}

3a と 3b を組み合わせることもできます。

于 2013-02-17T12:14:58.033 に答える
13

簡単な作業例:

.h ファイル

@property (strong, nonatomic) CAGradientLayer *gradient;

.m ファイル

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear: animated];

    self.gradient = [CAGradientLayer layer];
    self.gradient.frame = self.view.bounds;
    self.gradient.colors = @[(id)[UIColor purpleColor].CGColor,
                             (id)[UIColor redColor].CGColor];

    [self.view.layer insertSublayer:self.gradient atIndex:0];

    [self animateLayer];
}

-(void)animateLayer
{

    NSArray *fromColors = self.gradient.colors;
    NSArray *toColors = @[(id)[UIColor redColor].CGColor,
                          (id)[UIColor orangeColor].CGColor];

    [self.gradient setColors:toColors];

    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"colors"];

    animation.fromValue             = fromColors;
    animation.toValue               = toColors;
    animation.duration              = 3.00;
    animation.removedOnCompletion   = YES;
    animation.fillMode              = kCAFillModeForwards;
    animation.timingFunction        = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    animation.delegate              = self;

    // Add the animation to our layer

    [self.gradient addAnimation:animation forKey:@"animateGradient"];
}

色をシフトする追加のメソッドを実装してから、変更を元に戻すことができます。しかし、これはあなたがそこに到達するのに役立つはずです.

于 2014-02-21T12:50:39.163 に答える