2

Glympse iPhone アプリを初めて起動すると、Glympse のイントロ画面が表示されます。画面を上下にスクロールするとダイナミックに内容が変化し、アニメーションもとても滑らかです。設定メニューでこのイントロを再生することもできます。

iPhoneでこのような画面位置認識アニメーションページを構築する方法を知りました。この画面は html5+css3 を使用して構築されているのだろうか? このページにいいね!

4

2 に答える 2

3

イントロシーケンスを実装する方法は次のとおりです。

UIScrollViewDelegate はスクロールビュー コンテンツの実際の表示座標を提供しなかったため、UIScrollView から派生した新しいクラスを作成し、setContentOffsetをオーバーライドしました。また、setContentOffset が呼び出されたときにトリガーされ、setContentOffset メソッドに渡された contentOffset 値をリスナーに通知するデリゲート プロトコルも定義しました。 (理想的には、これは iOS の UIScrollViewDelegate デリゲートの一部でした)

デリゲートの実装者は、スクロールが発生したときに実際のコンテンツ オフセットを受け取ることができるようになりました。ビューがスクロールされ、さまざまなコンテンツが表示されると、contentOffset の垂直座標に基づいてアニメーションをトリガーします。これらのトリガーは、アニメーション UI 要素が表示されたり表示されなくなったりする 2 つの関数呼び出しに関連付けられた垂直ポイント ( Y 値 ) の配列で定義されます。

contentOffset Y 値がトリガー ポイントより大きい場合、特定の UI 要素をビューにアニメーション表示し、アニメーションを「トリガー」として設定しました。アニメーションは通常、ブロックベースのアニメーションを使用したフェードインまたはサイズ変更です。Y 値がトリガー ポイントよりも小さく、アニメーションが以前にトリガーされた場合、フェードアウトなどの別のアニメーションを使用してオブジェクトをビューから外し、マークを「トリガーされていない」としてマークします。

UI 要素が表示されているかどうかを判断するための重要な計算は次のとおりです。

    CGPoint point = [contentOffset CGPointValue];
    CGFloat visible = _scrollView.bounds.size.height + point.y;

    if ( _triggers[ndx].y < visible )
    {
        if ( !_triggers[ndx].triggered )
        {
            _triggers[ndx].triggered = true;
            // call trigger's function to animate item into view
        }
    }
    else
    {
        if (_triggers[ndx].triggered)
        {
            _triggers[ndx].triggered = false;
            // call trigger's function to animate item out of view
        }
    }
于 2012-11-14T23:21:33.697 に答える
2

これがどれほどスムーズかを見ると、HTML5 ではなくCABasicAnimationUIScrollViewDelegate.

コア アニメーション プログラミング ガイドの紹介コア アニメーション クックブックを読むことから始めます。

于 2012-11-14T09:21:32.413 に答える