私の Sencha Touch 2 アプリは非常に複雑です。そのため、ここでコード スニペット全体を表示することはできません。何をすべきかを簡単に説明します。私のアプリでは、次のグローバル構造を持っています:
- メインコンテナ
- ツールバートップ
- カードスイッチ
- リンクされたインスタンスに基づく異なるパネル
- ツールバーの下部
Cardswitch でリンクされているパネルの 1 つがホーム パネルです。このパネルの構造は次のとおりです。
- メインコンテナ
- パネル左 (レイアウト vbox)
- さらに3つのパネル
- パネル右 (レイアウト vbox)
- データビュー付きパネル
- (*私の問題パネル)動的に生成されたセグメント化されたボタンを持つパネル
- パネル左 (レイアウト vbox)
すべて正常に動作します。「問題パネル」の動的ボタンは、ストア データに基づいてコントローラー起動関数を介して生成されます。各ボタンは設計され、いくつかの html とカスタム画像で満たされています。
今私の問題:各ボタンはタップ機能も提供します。この関数は、ボタンの位置に基づいてオーバーレイをポップアップする必要があります。したがって、ボタンが生成されるコントローラー関数には、次のようなコードがあります。
...
var panel = this.getContent();
var overlay = Ext.create('MyApp.view.Overlay');
panel.add(overlay);
...
ご覧のとおり、私のオーバーレイは別のクラスです。var パネルは、ボタンが表示される「問題パネル」です。ボタン項目のタップ機能のコード (うまく機能します) は次のとおりです。
listeners: {
tap: function() {
//overlay.showBy(this);
overlay.show();
}
}
そしてオーバーレイのコード:
Ext.define('MyApp.view.Overlay', {
extend: 'Ext.Panel',
alias: 'widget.Overlay',
config: {
centered: true,
height: 200,
hidden: true,
html: 'This is just a overlay',
id: 'pOverlay',
ui: 'light',
width: 200,
hideOnMaskTap: true,
modal: true
}
});
もし私がするなら
panel.add(overlay);
タップ関数を呼び出すだけです
overlay.show();
すべてがうまく高速ですが、押されたボタンに対してオーバーレイがポップアップしません。だから私は使いたい
overlay.showBy(button);
しかし、そうすると、オーバーレイがポップアップするのに約2秒以上かかり、非常に遅くなります(Windows 7 @quadcoreでchromeを使用)。私は sencha-touch 2.0.1.1 を使用しています。オーバーレイをパネルに追加するのではなく、ビューポートに追加してから show を呼び出したときに期待していました。
//panel.add(overlay);
Ext.Viewport.add(overlay);
...
overlay.show();
パネルに追加すると、それほど速くは表示されません。showBy() の機能が必要ですが、アプリケーションよりもはるかに高速です。私に何ができる?アプリケーション全体で行った間違いはありますか? 他に何か?私はこの単純なオーバーレイを3日以上扱っているので、あなたが私を助けてくれることを願っています....
編集:テストのために、Cardswitchコンテナに含まれないように、ホームパネル(問題のあるパネルを含む)を初期ビューとして使用しました。その後、showBy() を実行しましたが、パネル全体がカードスイッチに含まれている場合よりもはるかに高速です。show() 関数だけを使用する場合ほど速くはポップアップしませんが、問題ありません。しかし、パネルを埋め込む必要があるため、それはまだ解決策ではありません。
また、2 つのオプションを持つ単純な選択フィールドを使用してみました。選択フィールドもオーバーレイを使用してオプションを表示しますが、選択フィールドは問題パネルのオーバーレイと同じくらい遅いです。:(
編集 2: 私はここでその問題の同様の説明を見つけました: http://www.sencha.com/forum/showthread.php?203501-ShowBy-with-Flexed-panels-and-a-box-layout-popup-is -slow しかし、そのスレッドの回避策は私にはうまくいきません。showBy() を使用する代わりに、選択フィールドの項目リストを画面の中央に表示するオーバーレイを作成するにはどうすればよいですか?