Ext JS Screencast #006 Layouts: Container, Anchor and Form

Posted on 05. Feb, 2009 by Jay Garcia in EXT Examples, EXTJS, ScreenCasts

Ext JS Screencast #006 Layouts: Container, Anchor and Form from Jay Garcia on Vimeo.

Ext JS Screencast #006 Layouts: Container, Anchor and Form

Help me deliver these videos to you faster!

Editing and compressing h.264 video for screencasts has become insanely expensive in terms of time. A 40 minute 720p video can take up to four or more hours on the final compression. My goal is to be able to deliver these videos to you faster, but I need your help! Please donate any amount to help me purchase faster hardware, allowing me to deliver videos faster to you.

$ 1755 / 3500 raised

Donate:

Like what you've seen or read? Use the below links to share and enjoy.

17 Responses to “Ext JS Screencast #006 Layouts: Container, Anchor and Form”

geoffrey.mcgill

06. Feb, 2009

Great job on the videos… more please.

mp4 downloads would be handy.

[thumbs up]
Jay Garcia

06. Feb, 2009

Thanks dude. I’ll post an update to the Ext thread when the 640X480 MP4 is available. i’m compressing it this morning.
mjlecomte

06. Feb, 2009

Nice work as always…looking forward to the next one.
Jay Garcia

06. Feb, 2009

Just edited to add M4V version download.
sadjo

26. Feb, 2009

all videos are excelent
I would like to make some screencast about other subjects
Can you tell me which tool do you use to make yours ?
thanks
Jay Garcia

06. Mar, 2009

Hi Sadjo,

I use screenflow.
robwilson

12. Mar, 2009

Hi, another great video – thanks. It never ceases to amaze me how much more I take in watching a brief video than spending ages reading a tutorial! Saying that – I’m sure when I receive you’re book I will find that just as useful
Jay Garcia

12. Mar, 2009

Thanks for the feedback Rob.

I hope the book is as useful. I’m reworking chapter 1 to be a bit smoother on the transition for newcomers to the framework. So far, it seems to be the most challenging.
jsonx

12. Sep, 2009

Thanks for great videos. Please keep going on more videos.
andyroot

24. Nov, 2009

I tried the anchor layout example and I can not get it to work.

Ext.wba.WidgetPanel = function(){
new Ext.Window({
title:’My window’,
width:600,
height:600,
layout:’anchor’,
items:[
{html:'left',anchor:'50%,100%'},
{html:'right',anchor:'50%,100%'}
]
}).show();
};

the panels just stack
andyroot

24. Nov, 2009

they don’t stretch the width or height of the window
andyroot

24. Nov, 2009

I tried this too, I went to http://www.extjs.com/deploy/dev/docs/ and hit F12 to open firefox and pasted the following into the console

Ext.get(document.body).update(”);
var win = new Ext.Window({
title:’my Window’,
height:300,
width:300,
layout:’anchor’,
items:[
{
html:'panel1',
anchor:'100%,50%'
},
{
html:'panel2',
anchor:'100%,50%'
}
]
});
win.show();

the result is 2 panels stacked with out filling the window.
What am I doing wrong here? why are the panels not stretching?
andyroot

24. Nov, 2009

the blog striped out my html for the first line just replace the first line with

Ext.get(document.body).update(”);
andyroot

24. Nov, 2009

aaarg! if you copy and past my example the syntaxError is from the first line, replace the double quote in the update function with 2 single quotes to produce an empty string
Jay Garcia

30. Nov, 2009

Andy, try using http://pastebin.com
andyroot

01. Dec, 2009

pastebin.com did not solve my anchor layout issue. Do you know why it is not working like in your screencast example?
andyroot

01. Dec, 2009

Jay,
OK, I got it to work, I had a comma in my anchor values. Feel free to remove my previous posts, I won’t be offended.

thanks