2

sencha touch でナビゲーションを作成してみました。私は理解できない状況に遭遇しました。戻るボタンを押したときにイベントリスナーが機能しない理由を理解するのを手伝ってください。

その場でパネルを追加するための別の場所を含むメイン コンテナーを作成しました。

戻るボタンと次のボタンは、メイン ビューの別のパネルにあります。

add 関数が起動すると、パネルの機能が追加され、一度は正常に動作します。しかし、戻るボタンをナビゲートすると、機能、つまり「piccsClicked」、「cvcsClicked」が機能しません。イメージが変わるところ。そして、他のいくつかの機能があります

問題と解決策を理解するのを手伝ってください。

私の推測では、xtype: "" + newPanel + "" を使用して戻るボタンを押したときにパネルを作成しているため、新しいパネルが作成され、関数はそれに適用されません。この問題を解決するために私を助けてください。

以下はコードです

 var current = 1;
 var myPanel = new Array("panelOne", "panelOneP", "panelTwoP", "panelThreeP", "panelFourP", "panelFiveP", "panelOneC", "panelTwoC", "panelThreeC", "panelFourCVC", "panelFiveC", "panelSixCGraph", "panelSixPGraph");

 Ext.define("myApp.controller.MainController", {
     extend: "Ext.app.Controller",

     config: {
         refs: {
             main: '#main',
             backButton: '#backButton',
             nextButton: '#nextButton',
             panelArea: '#panelArea', //this panel is in main view along with some other panels, among the other panels there is a panel which contains the back and next buttons
             panelOne: '#panelOne', // these are the views extending Ext.Panel
             panelOneP: '#panelOneP',
             panelTwoP '#panelTwoP',
             panelThreeP: '#panelThreeP',
             panelFourP: '#panelFourP',
             panelFiveP: '#panelFiveP',
             panelSixPGraph: '#panelSixPGraph',
             panelOneC: '#panelOneC',
             panelTwoC: '#panelTwoC',
             panelThreeC: '#panelThreeC',
             panelFourC: '#panelFourC',
             panelFiveC: '#panelFiveC',
             panelSixCGraph: '#panelSixCGraph',
             piccs: '#piccs', // these two are images in the panelOne
             cVCs: '#CVCs',
         },

         control: {
             cVCs: {
                 tap: 'cvcsClicked'
             },
             piccs: {
                 tap: 'piccsClicked'
             },
             backButton: {
                 tap: 'navigateBack'
             },
             nextButton: {
                 tap: 'navigateNext'
             },
         },
     },

     navigateBack: function () {
         current = current - 1;
         this.addPanel(myPanel[current]);
     },

     navigateNext: function () {
         current = current + 1;
         this.addPanel(myPanel[current]);
     },

     addPanel: function (newPanel) {

         this.getPanelArea().removeAt(0);

         }
         var myNewPanel = Ext.create('Ext.Panel', {
             items: [{
                 xtype: "" + newPanel + ""  // every view is given ID exactly as in the array
             }]
         });
         this.getPanelArea().add(myNewPanel);
     },

     piccsClicked: function () {
         var current = this.getPiccs().getSrc();
         if (current == 'resources/images/checkBoxUnchecked.jpg') {
             this.getPiccs().setSrc('resources/images/checkBoxChecked.jpg');
         } else {
             this.getPiccs().setSrc('resources/images/checkBoxUnchecked.jpg');
         }
     },

     cvcsClicked: function () {
         var current = this.getCVCs().getSrc();
         if (current == 'resources/images/checkBoxUnchecked.jpg') {
             this.getCVCs().setSrc('resources/images/checkBoxChecked.jpg');
         } else {
             this.getCVCs().setSrc('resources/images/checkBoxUnchecked.jpg');
         }
     },

 });
4

2 に答える 2

1

私も同じ悩みを抱えていました。私はこれを行うことで解決しました：

  1. コントローラーで、新しい を作成しますref。

    backToNav: 'myNavXtypeName button[text=Back]'

  2. 同じコントローラーで、ref を a にリンクしcontrolます。

    backToNav: {
        tap: 'backToNav'
}

  3. 最後に、ナビゲーション ビューのポップ機能を実装するコントローラー メソッドを作成します。

    backToNav: function() {
        Ext.getCmp('myNavXtypeName').pop()
}

終わり。 参照とコントロールの詳細については、こちらをご覧ください

于 2015-05-26T22:30:56.197 に答える
-1

コンマを置く場所に注意し、すべてが括弧で正しく,閉じ{られているかどうかを確認してください。}

,基本的に、括弧を閉じる前}や] 、最後に行ったように、何も入れないでください。

    },
});

またはその後'#CVCs',

    cVCs: '#CVCs',
},

},また、後に入れてもthis.getPanelArea().add(myNewPanel);よろしいですか？

    this.getPanelArea().add(myNewPanel);
},

これにより、コントローラーの定義が閉じられますが、さらに 2 つの関数がpiccsClickedあり、cvcsClickedそれを閉じる前に実行する必要があり},ます。

さらに、コントローラーを閉じる必要は});ありません}, (誤ってそこに残されている可能性があります)。

これを試して：

var current = 1;
var myPanel = new Array("panelOne", "panelOneP", "panelTwoP", "panelThreeP", "panelFourP", "panelFiveP", "panelOneC", "panelTwoC", "panelThreeC", "panelFourCVC", "panelFiveC", "panelSixCGraph", "panelSixPGraph");

Ext.define("myApp.controller.MainController", {
    extend: "Ext.app.Controller",

    config: {
        refs: {
            main: '#main',
            backButton: '#backButton',
            nextButton: '#nextButton',
            panelArea: '#panelArea', //this panel is in main view along with some other panels, among the other panels there is a panel which contains the back and next buttons
            panelOne: '#panelOne', // these are the views extending Ext.Panel
            panelOneP: '#panelOneP',
            panelTwoP '#panelTwoP',
            panelThreeP: '#panelThreeP',
            panelFourP: '#panelFourP',
            panelFiveP: '#panelFiveP',
            panelSixPGraph: '#panelSixPGraph',
            panelOneC: '#panelOneC',
            panelTwoC: '#panelTwoC',
            panelThreeC: '#panelThreeC',
            panelFourC: '#panelFourC',
            panelFiveC: '#panelFiveC',
            panelSixCGraph: '#panelSixCGraph',
            piccs: '#piccs', // these two are images in the panelOne
            cVCs: '#CVCs'
        },

        control: {
            cVCs: {
                tap: 'cvcsClicked'
            },
            piccs: {
                tap: 'piccsClicked'
            },
            backButton: {
                tap: 'navigateBack'
            },
            nextButton: {
                tap: 'navigateNext'
            }
        }
    },

    navigateBack: function () {
        current = current - 1;
        this.addPanel(myPanel[current]);
    },

    navigateNext: function () {
        current = current + 1;
        this.addPanel(myPanel[current]);
    },

    addPanel: function (newPanel) {
        this.getPanelArea().removeAt(0);
    },
 
    var myNewPanel = Ext.create('Ext.Panel', {
        items: [{
            xtype: "" + newPanel + ""  // every view is given ID exactly as in the array
        }]
    });

    this.getPanelArea().add(myNewPanel);

    piccsClicked: function () {
        var current = this.getPiccs().getSrc();
        if (current == 'resources/images/checkBoxUnchecked.jpg') {
            this.getPiccs().setSrc('resources/images/checkBoxChecked.jpg');
        } else {
            this.getPiccs().setSrc('resources/images/checkBoxUnchecked.jpg');
        }
    },

    cvcsClicked: function () {
        var current = this.getCVCs().getSrc();
        if (current == 'resources/images/checkBoxUnchecked.jpg') {
            this.getCVCs().setSrc('resources/images/checkBoxChecked.jpg');
        } else {
            this.getCVCs().setSrc('resources/images/checkBoxUnchecked.jpg');
        }
    }
});
于 2013-11-11T01:17:43.437 に答える