 |
The Raven Magician
Joined: 13 Oct 2000 Posts: 463
|
Posted: Wed Sep 08, 2004 11:29 pm
Alignment Question |
How would I align something like this:
Code: |
_______________________________________________
( Control )
_________ _________________________ _________
( Button1 )( EditBox )( Button2 )
_______________________________________________
( )
( )
( )
( ClientWindow )
( )
( )
(_______________________________________________) |
When I resize it, I want it to resize Control, EditBox, and ClientWindow, keeping Button1 and Button2 at the left and right.
Code: |
_______________________________
( Control )
_________ _________ _________
( Button1 )( EditBox )( Button2 )
_______________________________
( )
( )
( )
( ClientWindow )
( )
( )
(_______________________________) |
I tried to figure out the alignments I would need... this was my first attempt, in pseudo-Zeus:
<control align=top/>
<button1 align=nexttop/>
<editbox align=nextleft/>
<button2 align=nextleft/>
<clientwindow align=client/>
Result:
Version 0.1
Code: |
_______________________________
( Control )
_______________________________
( )
( )
( )
( )
( ClientWindow )
( )
( )
( )
(_______________________________) |
Well... that's no good. The client window covered up the controls. Bleh. Well, let's temporarily get rid of the client window so we can see behind it...
Result:
Version 0.2
Code: |
_______________________________
( Control )
_______________________________ _________ _________
( Button1 )( EditBox )( Button2 ) |
Ugh. So aligning something as 'nexttop' also made it fill the entire top of the window by default. I fixed that by adding a width= parameter to Button1, and put the ClientWindow back in with align=nexttop.
Result:
Version 0.3
Code: |
_____________________________________
( Control )
_________ _________ _________
( Button1 )( EditBox )( Button2 )
______________
( )
( ClientWindow )
(______________) |
Fun. So, without align=client, the memo field of course makes itself the default small size. I suspected this, but I had to try it. Also, the Editbox and Button2 are aligned left, they do not stretch to the right edge or resize themselves at all.
I'm getting very confused here, and running out of alignment types to play with. Would someone be so kind as to shed some light on how this would be done properly? I want to avoid, if not eliminate entirely, hardcoded width and margin settings. If I need a numbered parameter, then it's not the way I'd prefer to solve it.
Note: Viewing the source in the links provided is easy with IE. Also, the important parts are easier to see if you close <head>, <dock>, and the second <window...> tag. |
|
|
 |
Zugg MASTER

Joined: 25 Sep 2000 Posts: 23379 Location: Colorado, USA
|
Posted: Thu Sep 09, 2004 1:21 am |
This is when you need to use panels to help. Here is the result:
Code: |
<control align=top/>
<panel align=top height=22>
<button1 align=left/>
<button2 align=right/>
<editbox align=client/>
</panel>
<clientwindow align=client/> |
Adjust the height property of the panel to take up whatever amount of room you want.
What's tricky about this is that the alignments "top,bottom,left,right,client" are from Delphi and the others are added by Zeus. Since the Delphi alignments have no knowledge of the other modes that are added, when you use "client" alignment, it only looks at the other controls with "top,bottom,etc" to determine how much space to take up.
One trick you can use is to know that the order of the properties is the order they are executed, so if you put align=client you can then do something like autotop=true to modify the top of the control to be at the bottom of the previous control. That would have fixed your first situation I think.
But using panels is a more straightforward way to do things. You can actually achieve any effect at all using panels and the default Delphi alignments. |
|
|
 |
Rainchild Wizard

Joined: 10 Oct 2000 Posts: 1551 Location: Australia
|
Posted: Thu Sep 09, 2004 1:49 am |
align="chaotic neutral" ;)
One thing I find annoying (or lacking) in Delphi/C++Builder which would be nice to see automatic in zeus is sure you can do the panel / align left, right, client, but you can't do width = 33% and have them proportionally resize... always the left and right stay the same size while the client one gets much bigger.
Some kinda percentile widths would be nice to have if it's not too annoying to code (heh, I gave up bothering with my C++Builder appz because it was annoying to code). |
|
|
 |
Zugg MASTER

Joined: 25 Sep 2000 Posts: 23379 Location: Colorado, USA
|
Posted: Thu Sep 09, 2004 5:13 pm |
It's pretty complex to code, and it interfers with the existing Delphi anchoring and alignment. But I think I have a trick that I working on...
I've got a set of "splitter" components that I'm adapting for Zeus because the default <SPLITTER> (which wraps the Delphi TSplitter component) basically doesn't work in any useful way. One of the properties of these new splitter components is the ability to handle proportional resizing and percentage sizing.
So, what you would end up doing is something like this:
<Left Control/>
<SPLITTER Percentage='33' Proportional='true'/>
<Right Control/>
Or something close to that. I don't have this implemented yet, but that is what I am thinking. The Splitter will take the control just before it and the control just after it and put them into the two panels used by the splitter.
So now the only trick is finding a way to hide the splitter itself so that it looks like you just have two panels with proportional alignment. I'm hoping that I can find a way to do that. |
|
|
 |
slicertool Magician

Joined: 09 Oct 2003 Posts: 459 Location: USA
|
Posted: Thu Sep 09, 2004 8:17 pm |
How would this work with 3 or more items in a row? Would the splitter component try to cascade the percentage being as it looks at the before and after controls?
|
|
|
 |
Krule Adept
Joined: 12 Nov 2000 Posts: 268 Location: Canada
|
Posted: Thu Sep 09, 2004 10:50 pm |
Panels..reminds me of java...Man laying out stuff in java is !fun...perhaps we'll see a Gui programer to help develop zeus apps one day?
|
|
|
 |
Zugg MASTER

Joined: 25 Sep 2000 Posts: 23379 Location: Colorado, USA
|
Posted: Thu Sep 09, 2004 11:48 pm |
The splitter control will take the control before it and the control after it and encapsulate them into a new panel that is "client" aligned, with the two controls aligned within this panel with a splitter between them.
Now, if you want multiple controls where the first control is 10%, the second is 30% and the third is 60%, for example, then my guess is that you will need to do something like this:
<control1/>
<splitter1 percentage='10' proportional='true'/>
<control2/>
<splitter2 percentage='40' proportional='true'/>
<control3/>
The first splitter (splitter1) takes the control before (control1) and control after (control2) and puts them into a panel with a splitter between them, giving control1 10% of the space.
The second splitter (splitter2) takes the control before (which is now a panel containing a splitter and the other 2 controls) and creates a new panel where the first control has 40% of the space, and the remaining control (control3) has 60%.
But I'm just speculating. Until I actually implement this and find out how the 3rd party splitter component really works, I won't really know how this will work. As always my goal is to make it straightforward and as easy as possible.
And yes, a GUI (or IDE) is on my list for the far future if Zeus does well. But I'm trying to make the XML code easy to understand. It is certainly not going to be as much of a pain as it is in Java. Fun = Not!. I'm trying to make it so that the simple XML does what you'd expect as a default, and then if you want to tweak it you can do that with more complicated properties. |
|
|
 |
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
|