extjs - Where to use listeners and where to use controller - Sencha Touch 2 -

i confused between proper usage of listeners vs controllers

e.g. same button, can make handler button-tap event in button description :

ext.viewport.add({     xtype: 'button',     centered: true,     text: 'my button',      listeners: {         tap: function() {             alert("you tapped me");         }     } }); 

and in separate controller below.

ext.define("notesapp.controller.notes", {     extend: "ext.app.controller",     config: {         refs: {             newnotebtn: reference button here         },         control: {             newnotebtn: {                 tap: "onnewnote"             }         }     },     onnewnote: function () {         console.log("onnewnote");     }   }); 

what best practice, , there trade-offs?

thanks

to controller or not controller, question.

well, technically, nothing prevent doing 1 or other. have established way how decide myself:

1. i install listeners on view if job doing not cross boundaries of view. if take form example, disabling , enabling, showing , hiding of fields, if depends on state of form stay within form - no controller.
2. i delegate logic controller if action in 1 view (a button click, example) influences view or whole application.

again, these preferences, can have another.