次の方法で共有

iOS 7 の概要

  • [アーティクル]

この記事では、iOS 7 で導入された主要な新しい API について説明します。ここでは、ビュー コントローラーの切り替え、UIView アニメーションの機能強化、UIKit Dynamics、Text Kit などについて扱います。 また、ユーザー インターフェイスについてのいくつかの変更点と、新しく強化されたマルチタスク機能についても説明します。

iOS 7 は、iOS における大規模な更新の 1 つです。 これにより、アプリケーション クロムではなくコンテンツに焦点を当てる、まったく新しいユーザー インターフェイス デザインが導入されます。 視覚的な変更に加えて、iOS 7 では、豊富な対話とエクスペリエンスを作成するための新しい API が、非常に多く追加されています。 このドキュメントでは、iOS 7 で導入された新しいテクノロジについて見て行くとともに、さらなる探索の出発点の役割も果たしています。

UIView アニメーションの機能強化

iOS 7 では UIKit でのアニメーションのサポートが強化されており、以前は Core Animation フレームワークに降りていき直接実行する必要があった処理を、アプリケーションで実行できるようになりました。 たとえば、UIView では、以前は CALayer に適用していた CAKeyframeAnimation のキーフレーム アニメーションとともに、スプリング アニメーションを実行できるようになりました。

スプリング アニメーション

UIView では、アニメーション化プロパティが変更され、スプリング効果がサポートされるようになりました。 これを追加するには、次に説明するように、ばね減衰比と初期ばね速度の値を渡しながら、AnimateNotify または AnimateNotifyAsync メソッドを呼び出します。

  • springWithDampingRatio – 0 から 1 の値。この値を小さくすると振動が大きくなります。
  • initialSpringVelocity – アニメーション距離の合計に対する、1 秒あたりの最初のばね速度。

次のコードは、イメージ ビューの中心が変更されたときにスプリング効果を生成します。

void AnimateWithSpring ()
{
    float springDampingRatio = 0.25f;
    float initialSpringVelocity = 1.0f;

    UIView.AnimateNotify (3.0, 0.0, springDampingRatio, initialSpringVelocity, 0, () => {

        imageView.Center = new CGPoint (imageView.Center.X, 400);

    }, null);
}

次の図に示すように、このスプリング効果により、アニメーションが新しい中心位置に移動すると、画像ビューがバウンスしているように見えます。

このスプリング効果により、アニメーションが新しい中心位置に移動すると、画像ビューがバウンスしているように見えます

キーフレーム アニメーション

UIView クラスに、 UIView でキーフレーム アニメーションを作成するための、AnimateWithKeyframes メソッドが含まれるようになりました。 このメソッドは、キーフレームを含めるパラメータとして追加の NSAction が渡される点を除き、 UIView の他のアニメーション メソッドと類似しています。 NSAction 内で UIView.AddKeyframeWithRelativeStartTime を呼び出すことによって、キーフレームが追加されます。

たとえば、次のコード スニペットでは、ビューの中心をアニメーション化しビューを回転させる、キーフレーム アニメーションを作成します。

void AnimateViewWithKeyframes ()
{
    var initialTransform = imageView.Transform;
    var initialCeneter = imageView.Center;

    // can now use keyframes directly on UIView without needing to drop directly into Core Animation

    UIView.AnimateKeyframes (2.0, 0, UIViewKeyframeAnimationOptions.Autoreverse, () => {
        UIView.AddKeyframeWithRelativeStartTime (0.0, 0.5, () => {
            imageView.Center = new CGPoint (200, 200);
        });

        UIView.AddKeyframeWithRelativeStartTime (0.5, 0.5, () => {
            imageView.Transform = CGAffineTransform.MakeRotation ((float)Math.PI / 2);
        });
    }, (finished) => {
        imageView.Center = initialCeneter;
        imageView.Transform = initialTransform;

        AnimateWithSpring ();
    });
}

AddKeyframeWithRelativeStartTime メソッドの最初の 2 つのパラメータは、キーフレームの開始時間と継続時間を、それぞれアニメーション全体の長さに対する割合として指定します。 上の例では、最初の 1 秒間に画像ビューが新しい中心に対しアニメーション化され、次の 1 秒間に 90 度回転します。 このアニメーションでは、UIViewKeyframeAnimationOptions.Autoreverse をオプションとして指定しているため、両方のキーフレームは反転方向にもアニメーション化されます。 最後に、完了ハンドラーの終了時の値が初期状態に設定されます。

次のスクリーンショットは、キーフレームを通じて結合されたアニメーションを示しています。

このスクリーンショットは、キーフレームを通じて結合されたアニメーションを示しています

UIKit Dynamics

UIKit Dynamics は、アプリケーションが物理に基づいてアニメーション化された相互作用を作成できるようにする、UIKit の新しい API セットです。 UIKit Dynamics は、これを可能にするために 2D 物理エンジンをカプセル化しています。

この API は本質的に宣言型です。 オブジェクト (ビヘイビアーと呼ばれます ) を作成して、重力、衝突、ばねなどの物理概念を表現することで、物理の相互作用がどのように動作するかを宣言します。次に、動的アニメータと呼ばれる、ビューをカプセル化するための別のオブジェクトに動作をアタッチします。 この動的アニメータにより、宣言された物理動作が、動的アイテム (UIView などの IUIDynamicItem を実装するアイテム ) に対し適用されます。

次のように、複雑な相互作用をトリガーするために使用できるプリミティブな動作には、いくつかの種類があります。

  • UIAttachmentBehavior – 同時に動く 2 つの動的なアイテムをアタッチするか、動的アイテムをアタッチ ポイントにアタッチします。
  • UICollisionBehavior – 動的なアイテム同士を衝突させられるようにします。
  • UIDynamicItemBehavior – 弾力性、密度、摩擦など、動的アイテムに適用するプロパティの一般的なセットを指定します。
  • UIGravityBehavior - 動的アイテムに重力を適用し、重力方向にアイテムが加速するようにします。
  • UIPushBehavior – 動的アイテムに力を適用します。
  • UISnapBehavior – 動的アイテムをスプリング効果を使用して、ある位置にスナップできるようにします。

プリミティブは多数存在するものの、UIKit Dynamics を使用して物理ベースの相互作用をビューに追加する一般的なプロセスは、各ビヘイビアー間で一貫しています。

  1. 動的アニメータを作成します。
  2. ビヘイビアーを作成します。
  3. 動的アニメータにビヘイビアーを追加します。

Dynamics の例

UIView に対し、重力と衝突境界を追加する例を見てみましょう。

UIGravityBehavior

画像ビューに重力を追加するには、上記の 3 つの手順に従います。

この例では、この ViewDidLoad メソッドを使用します。 まず、次のように UIImageView インスタンスを追加します。

image = UIImage.FromFile ("monkeys.jpg");

imageView = new UIImageView (new CGRect (new CGPoint (View.Center.X - image.Size.Width / 2, 0), image.Size)) {
                    Image =  image
                }

View.AddSubview (imageView);

これにより、画面の上端の中央に画像ビューが作成されます。 重力でこの画像を "落下" させるには、次の UIDynamicAnimator のインスタンスを作成します。

dynAnimator = new UIDynamicAnimator (this.View);

UIDynamicAnimator は、アタッチ されたビヘイビアーごとにアニメーション化される項目を含む、参照 UIView または UICollectionViewLayout のインスタンスを受け取ります。

次に、UIGravityBehavior インスタンスを作成します。 次のように、IUIDynamicItem を実装する 1 つ以上のオブジェクト (UIView など) を渡すことができます。

var gravity = new UIGravityBehavior (dynItems);

この場合のビヘイビアーには、アニメーション化する単一の UIImageView インスタンスが含まれている、IUIDynamicItem の配列が渡されます。

最後に、動的アニメータにビヘイビアーを追加します。

dynAnimator.AddBehavior (gravity);

この結果、下図に示すように、重力により画像が下方向に動かされます。

開始画像の場所終了画像の場所

画面の境界についての制約は存在しないため、この画像ビューは単純に下部に外れます。 画像が画面の端と衝突するようにビューを制限するには、 UICollisionBehavior を追加します。 これについては、次のセクションで説明します。

UICollisionBehavior

まず最初に UICollisionBehavior を作成し、それを、UIGravityBehavior で行なったのと同じように動的アニメータに追加します。

UICollisionBehavior を含むようにコードを変更します。

using (image = UIImage.FromFile ("monkeys.jpg")) {

    imageView = new UIImageView (new CGRect (new CGPoint (View.Center.X - image.Size.Width / 2, 0), image.Size)) {
        Image =  image
    };

    View.AddSubview (imageView);

    // 1. create the dynamic animator
    dynAnimator = new UIDynamicAnimator (this.View);

    // 2. create behavior(s)
    var gravity = new UIGravityBehavior (imageView);
    var collision = new UICollisionBehavior (imageView) {
        TranslatesReferenceBoundsIntoBoundary = true
    };

    // 3. add behaviors(s) to the dynamic animator
    dynAnimator.AddBehaviors (gravity, collision);
}

UICollisionBehavior には、TranslatesReferenceBoundsIntoBoundry という名前のプロパティがあります。 これを true に設定することで、参照ビューの境界が衝突の境界線として使用されます。

これで、重力により画像が下方向に動かされると、画面の下部から少し離れて跳ね返った後、そこに落ち着きます。

UIDynamicItemBehavior

追加の動作により、落下する画像ビューのビヘイビアーをさらに制御することができます。 たとえば、弾力性を高めるために UIDynamicItemBehavior を追加すると、画面の下部と衝突したときの画像のバウンスをより大きくできます。

UIDynamicItemBehavior の追加は、他のビヘイビアーのものと同じ手順に従って行ないます。 まず、ビヘイビアーを作成します。

var dynBehavior = new UIDynamicItemBehavior (dynItems) {
    Elasticity = 0.7f
};

次に、そのビヘイビアーを動的アニメータに追加します。

dynAnimator.AddBehavior (dynBehavior);

この動作が設定された画像ビューは、境界と衝突すると、より大きなバウンスを発生します。

一般的なユーザー インターフェイスの変更

UIKit Dynamics、コントローラーの切り替え、強化された UIView アニメーションなど、前述の新しい UIKit API に加えて、iOS 7 では、UI のさまざまな視覚的変更と、各種ビューとコントロールに関連する API の変更が導入されています。 詳細については、「iOS 7 ユーザー インターフェイスの概要」を参照してください。

テキスト キット

Text Kit は、強力なテキスト レイアウトとレンダリングの機能を備える新しい API です。 これは、低レベルの Core Text フレームワーク上に構築されていますが、Core Text よりもはるかに簡単に使用できます。

詳細については、「TextKit」 を参照してください

マルチタスキング

iOS 7 では、バックグラウンド処理を実行するタイミングとその方法を変更しています。 タスクがバックグラウンドで実行されている場合、iOS 7 でのタスクの完了はアプリケーションを有効なまま維持しなくなりました。アプリケーションは非継続的な方法で、バックグラウンド処理のために起動されます。 iOS 7 では、バックグラウンドで新しいコンテンツを使用してアプリケーションを更新する、3 つの新しい API も追加されています。

  • バックグラウンド フェッチ – アプリケーションがバックグラウンドで、一定の間隔でコンテンツを更新できるようにします。
  • リモート通知 - アプリケーションがプッシュ通知を受信したときに、コンテンツを更新できるようにします。 通知は、サイレントにすることも、ロック画面にバナーを表示させることもきます。
  • バックグラウンド転送サービス – 大きなファイルなどのデータを、固定された時間制限なしでアップロードおよびダウンロードできるようにします。

新しいマルチタスク機能の詳細については、Xamarin のバックグラウンド処理ガイドの、iOS セクションを参照してください。

まとめ

この記事では、iOS におけるいくつかの主要な新機能について説明します。 最初に、ビュー コントローラーにカスタムの画面切り替えを追加する方法を示します。 次に、コレクション ビューの切り替えを、ナビゲーション コントローラー内から、およびコレクション ビュー間の対話形式の両方から使用する方法を示します。 次に、UIView アニメーションに対して行われたいくつかの機能強化について説明し、以前は Core Animation に対して直接プログラミングを必要としていた処理のために、UIKit をアプリケーションで使用する方法を示します。 最後に、物理エンジンを UIKit に導入する新しい UIKit Dynamics API について、Text Kit フレームワークで利用可能になったリッチ テキスト サポートと共に紹介します。