0

HTMLイベントに応じてビューを切り替えたいと思います。通常はマップされた画像をタップします。

私はこの投稿を通り抜けました。html要素にリスナーを追加してhref値を取得する方法を説明します。この手順は正常に実行されました。

次のステップは、正しいビューに切り替えることです。通常、href = "item1"の場合、 "item1"を表示するように切り替えたいのですが、これを実行する方法がわかりません。

私の見解ではhtml要素のコード：

<img class="map" src="folder/name_pic.jpg" ...usemap='#MapName' />
    <map name='#MapName' ...>
        <area shape=...... href="view1" />
        <area shape=...... href="view2" />
        <area shape=...... href="view3" />
    </map>

親タブパネルのコード：

panel.getEl().on({
    tap: function(e){

        var href = Ext.fly(e.getTarget(
                    'img.map')).getAttribute('href');

        // What goes HERE?
        // if (href == 'view1')
        //     display 'view1'...
},
delegate: 'img.map'
});
4

2 に答える 2

1

以下に示すサンプルコードを使用してこれを行うことができます。アプリケーションの設計に合わせて変更する必要がある場合がありますが、これが一般的な方法です。

Tapped: function() {
        // When the user taps on this item, create a new reference new viw, 
        // and set  it as the active item

        Ext.Viewport.setActiveItem(Ext.create('Your new view Goes here'));
    }

ありがとう

于 2012-11-30T11:48:31.333 に答える
1

コントローラで「ルート」ソリューションを使用して、目標を達成しました。

まず、マップされた画像を次のように定義します。

<img class="map" src="folder/name_pic.jpg" ...usemap='#MapName' />
     <map name='#MapName' ...>
         <area shape=...... href="/#view1" />
         <area shape=...... href="/#view2" />
         <area shape=...... href="/#view3" />
     </map>

そして、Controller.jsで：

config: {
    routes: {
        'view1': 'showView1',
        'view2': 'showView2',
        'view3': 'showView3'
    },
[...... code here...]

showView1: function() {

    this.getMainPanel().add({
        xtype: 'view1'
    });
},
showView2: function() {

    this.getMainPanel().add({
        xtype: 'view2'
    });
},

それは機能しますが、私には最適ではないようです。これからも頑張っていきます！

于 2012-12-13T22:24:11.497 に答える