View Full Version : Using the Sencha Designer 2 for the first time

6 Feb 2012, 5:25 PM
Hi Guys.

I've recorded myself using the designer for the first time, I tried to talk about what I was thinking when using the tool.

http://www.screenr.com/wA9s (part 1 5:00min)
http://www.screenr.com/BK9s (part 2 5:00min)
http://www.screenr.com/KK9s (part 3 3:40min)

Things I like:
* Filters
* Component inspector
* Ability to add controllers, models and views
* Changing properties is really simple

Things that I didn't like
* The code is read-only :(

Things I didn't know how to do:
* Linking a CSS file
* Running the app from the designer

Nice work guys!

PS: forgive me for my poor english when speaking :">

6 Feb 2012, 6:28 PM
crysfel -

I'm in the process of watching your videos :)

Re: the code being read-only. This is only when you look at the entire view of the code. The implementation where you would write your source code is editable.

Re: linking a css file, we will have a project setting coming in the near future which lets you link a css file in your export.

Re: running the app, launch your browser and point it to the directory you've built the application in (assuming its in a web accessible location) C:\Inetpub\wwwroot, ~/Sites, etc

You can also export it to a separate directory if you'd like.

6 Feb 2012, 6:42 PM
Watching videos of people using the designer for the first time is very insightful. Thanks for that.

Projects with Sencha Designer 2.x own an entire directory. Only one project can live in a single directory. When you saved your test.xds file into your ~/Sites directory it is "owning" that directory. It created an app directory, a .metadata directory and a designer.html/js file. You should create a directory before saving your project into that location. We may change things so that when you initially save it asks you to create a directory rather than allowing you to save anywhere you'd like.

There is a bug in the initial release which was not setting autoCreateViewport: true on the Application. Check this and when you launch designer.html it will render the initial page you requested.

As I noted above, you can edit code but only when you are looking at the individual pieces. For example if you added an event handler to your button (by going to the bottom right clicking on Events and then clicking the plus next to "click"). You can then double click that event handler and edit the source code.

The green Preview button has not been implemented yet.

7 Feb 2012, 5:05 AM
Three things that I would recommend to the team:

-When creating a project, let the user specify the project name. Then create a directory with that name.
-Let the user change the filename of the designer.html/js. I think the most of us would prefer index.html/js instead of designer.* :)
-And please let us choose between different arrangements of the project/property and toolbox windows :)

8 Feb 2012, 10:19 AM
These videos are very valuable to us. Thank you crysfel!

In video 2 I think you were looking for a controller action to bind a listener to an event