View Full Version : Code Editing?

30 Jan 2012, 7:54 PM
Perhaps I missed something somewhere, but I thought this edition of Designer would allow the editing of the generated code. The code view window contains a banner that says "Code is Read Only" and there doesn't seem to be an obvious way around it. How does one go about editing the code inside Designer?

Thank You,
M. McConnell

30 Jan 2012, 9:47 PM
M. McConnell -

You can edit the code but the designer enforces that you follow a structure to building your applications.

At the top left hand side of the code viewer you will see a dropdown that allows you to switch between the ui class and the implementation class. These views are read-only. All other methods in the dropdown can be edited.

You can add more functions to the class by adding "Basic Functions" or event bindings to the class.

31 Jan 2012, 6:40 AM
Thanks for your quick reply, Aaron. I'll take another look when I start to piece together an application over the next couple of days.

I have to say, the Sencha framework (and tooling) is leaps and bounds ahead of anything else I've looked out in the wild. Most of my time is spent developing enterprise Flex applications and I'm still inclined to believe Flex is better suited for large scale applications. However, with everything you're doing to make Sencha a better suite of solutions, the line is definitely starting to blur. You guys do great work.

Thank You,
Mike McConnell

31 Jan 2012, 4:02 PM
@aconran (http://www.sencha.com/forum/member.php?802-aconran) , How to run Basic Function inside Class initComponent?

31 Jan 2012, 6:12 PM
@aconran (http://www.sencha.com/forum/member.php?802-aconran) , How to run Basic Function inside Class initComponent?

THis is currently not possible.

31 Jan 2012, 7:25 PM
Any alternative? Using controller?

31 Jan 2012, 8:54 PM
We have a ticket to be able to add user specific code inside the initComponent but this is currently not possible.

What are you trying to achieve? You probably could use a controller and/or some other technique to get what you want. If you post the full example, please start another thread and link to it from here.

1 Feb 2012, 1:11 PM
How's does one run code in the launch function? I ended up creating a Basic Function in the Application class and modifying (or hacking) the Application file in .metadata to get the Basic Function called from the launch function. What's the "right" way to accomplish this?


1 Feb 2012, 1:31 PM
Hugo -

After clicking on the application, goto the code view. You can then change the drop down at the top left to "launch" and then edit the code.

We know that this user experience is not ideal and are looking at how to make it more obvious.

1 Feb 2012, 7:04 PM
One thought @wemerson.januario was to allow you to mark a function as an init function and thus Designer would call this function from the init function for a view, model, store, controller. How does that feel?

2 Feb 2012, 2:32 AM
nice idea @philstrong. I would be nice to to have possibility to mark function to be called from init functions.

3 Feb 2012, 1:28 PM
Some thing like this?

For non visual:

var me = this;
cfg = cfg || {};
cfg = me.beforeConstructor(cfg); // If defined
me.callParent([Ext.apply({}, cfg)]);
me.afterConstructor(); // If defined

For visual:

var me = this;
var args = arguments;
args = beforeInitComponent(arguments); // If defined
me.afterInitComponent(); // If defined

17 Feb 2012, 6:12 PM
So would I be coming to the correct conclusion if I said that Designer is intended to discourage me from adding listeners willy nilly in my containers via the read-only restrictions in favor of Controller based stuff?

17 Feb 2012, 6:20 PM
delgrundy -

Its not as simple as that, both basic event bindings and controller actions have a time and a place. In general if behavior can be limited to be scoped within all of its child pieces and is not interacting with other components its better to be baked right in.

If you are interacting with separate components then you should probably be using controller actions.

There is no hard and fast rule but this could be used as a general guideline.

17 Feb 2012, 7:44 PM
Fair enough. But I don't see where I have the freedom in an XDS project to just add a listener to a container as a configuration object. So am I to assume that what I am supposed to be doing if, for example, I want to support a tap event on a panel that I should add a Basic Event Binding to the component and then create a Basic Function that does the listener stuff to support it?

17 Feb 2012, 8:03 PM
A basic event binding also consists of the function. So you just need to add the basic event binding, configure the event type/name and then go into code view and edit the source code for the event binding.

17 Feb 2012, 8:12 PM
ah ha! Ok so how do I specify the swipe, tap etc? I see the listener object configuration showing up in the panel config now as a result of having selected a name/event in the BEB, but that is based on all things except such things as tap, swipe etc. In this vid: http://docs.sencha.com/touch/2-0/#!/video/intro-to-listeners
he shows three ways to add a listener and the addListener() function specifies tap, swipe and such. Since I am confined to the name/events offered by the BEB, where should the specification of the user touch events come into play?

17 Feb 2012, 9:24 PM
I think I just answered my own question. As usual I am making something easy to be difficult. Rather than add a generic event binding, I just need to select the events directly from the container. Then all of the touch events are right there. Or I suppose I could have just said "Duh.."

18 Feb 2012, 11:29 AM
I think I just answered my own question.
Glad you figured it out. :-)

28 Feb 2012, 11:31 PM
Please provide feedback: