• Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Aligning a Login Page at the center

 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,

I have a very basic question on flex. I'm facing problem in aligning a login page at the center of the page.




I want the component at the center of the screen.

Thanks
 
Hongli Li
Ranch Hand
Posts: 124
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
this will be a hard question unless you give more information about you layout, are you displaying this login as a popup, or just embed it to your application page. what's your layout options(absolute, vertical, horizontal, constrained layout...etc)
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,

Thanks for your reply.

Sorry for incomplete details. Yes its embed in the mxml page. The whole login.mxml page is embed in main index.mxml something like this....





login.mxml is a HBox (Code which I have posted in the first post is login.mxml code).

Also, layout which I have used is absolute. Which layout will help me in doing this?

Thanks in advance

Cheers
 
Hongli Li
Ranch Hand
Posts: 124
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
try change verticalAlign=center and horizontalAlign = center to verticalCenter="0" horizontalCenter="0"
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi Hongli,


Login screen is at the top left corner now not at the center of the page.


This is what I have done..


 
Hongli Li
Ranch Hand
Posts: 124
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
you should specify verticalCenter="0" horizontalCenter="0" at parent page the application page
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
No luck


my parent page (index.mxml) now looks like this (still login box comes at left topmost corner)

 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Please see the screenshot..How its currently displaying.

Pink box is where I want the login box to appear

Hope this makes more sense


 
Hongli Li
Ranch Hand
Posts: 124
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
what about removing horizontalCenter="0" verticalCenter="0" in your Application tag, you don't need them there. and further more you can modularize you component, make a login component then import it in your main page, so that you can reuse the loing component everywhere you want to use it.
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
sorry its not coming in the center (at pink rectangular box)

yes thats right. No need of that attibute in mx:Application tag
 
Hongli Li
Ranch Hand
Posts: 124
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
<!-- start login module include-->
<mx:HBox horizontalAlign="center"> will centerize your login page.
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
<mx:HBox horizontalAlign="center"> is just moving the login control from topmost left to topmost middle. Still its NOT at the pink box.
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have got it now




horizontalAlign center move the login control from topmost left to topmost middle and verticalAlign will move it from topmost middle to center of the page (i.e., at the pink box)


Happy ending
 
Hongli Li
Ranch Hand
Posts: 124
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
nice you got it, but if use flex builder or plugin for eclipse, you should be able to modify the container properties via Property panel, it's a WYSIWYG editor.
 
nazzy khan
Ranch Hand
Posts: 39
Android Eclipse IDE Spring
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Yeah thats right. Editplus little frustrating
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic