3

画面上の 2 つのパネルをフェード効果で入れ替える最良の方法は何ですか?

CSS を使用して互いの上に配置した 2 つのパネルがあります。panelOne が表示され、 panelTwo が非表示になります。

別のボタン (どちらのパネルでもない) をクリックすると、 panelOne がフェードアウトし、 panelTwo がフェードインします。

私は現在、以下のコードを使用してこれを機能させていますが、テスト用にここにある一部の Android デバイスではかなり遅いことがわかりました。私が現在使用しているものよりも良い方法はありますか?このアニメーションを改善するにはどうすればよいですか?

このコードはボタン タップで実行されます。

Ext.Anim.run(panelOne, 'fade', {
   duration: 100,
   after: function() {
      panelOne.hide();
   }
});
Ext.Anim.run(panelTwo, 'fade', {
   out: false,
   duration: 100,
   before: function() {
      panelTwo.show();
   }
});

どんな助けでも大歓迎です。

ありがとう。

4

2 に答える 2

2

Ext.Animそんなに長く使う必要はありません。

たとえば、アプリには、1 番目と 2 番目のアイテムとしてそれぞれ とをExt.Container含む があります。panelOnepanelTwo

次に、アニメーションを使用してからpanelOneに移動する場合は、次のようにします。panelTwofade

Ext.getCmp('your_container_id').animateActiveItem(1,'fade')

またはこれを行うことができます:

  • showAnimation: 'fadeIn'panelTwo の構成に追加します
  • hideAnimation: 'fadeOut'panelOne の設定に追加します

それが役に立てば幸い。

于 2012-05-31T06:22:31.713 に答える
0

持続時間などの他の設定を制御するには、次を使用します:

hideAnimation: {type:'fadeOut', duration: 1000}

于 2012-08-07T08:31:32.293 に答える