Jump to content

Login form layout


Wicket

Recommended Posts

Hi All,

I have spent quite a bit of time to get a login form working with the correct layout.

Has anyone already put together a login form with a similar layout to the below? I do not mean the styling just the layout ->Image on top > username >password >login > forgot password > rememeber me.

I have been trying to achieve this with client side alignment - but just cant get anywhere near it. 

Could some post an example? So I can see how to do correctly. Thanks

image.png.77ff270e21aa650153b4d6d100261e97.png

Link to comment
Share on other sites

That is not my form it is from google - that is a layout I am trying to reproduce. 
not the styling just the layout of controls

I struggle to do layouts properly having a example project of the above layout using client side alignment would help me

Link to comment
Share on other sites

  • 2 weeks later...

205465225_Annotation2020-05-20125541.png.46c44bafd674727eb06329bb9d900483.png

This login screen contains 2 tabs one for the login and one for the initial setup or changes. The second one is normally not visible. I am still tuning the look and feel.

The user/ client can register as a new user/client and gets an activation code by e-mail, which they must enter the first time they login. When the password i forgotten they can request a reset, which will send a code to their registered e-mail. After entering this, they can change the password.(last link).

I am using the crisp theme. The form has no border.

Link to comment
Share on other sites

7 minutes ago, Wicket said:

Thanks for the help @Abaksoft, especially with the readme explaining how it all goes together. 

thx.

•  infact, in Desktop mode you can do it without Layout vbox. 

•  in mobile you need vbox. 

http://forums.unigui.com/index.php?/topic/14398-what-is-the-effect-of-clientheight-if-alignmentcontrol-is-unialignmentclient/&do=findComment&comment=78021

 

Link to comment
Share on other sites

How do you make the username and password UniEdits align center in the form? In this example they are not in the center - one side has more space than the other.

eg, 1 has less space (margin?) than 2

image.png.1b217f90c5af62253b0b575291ac85ce.png

Link to comment
Share on other sites

22 minutes ago, Wicket said:

How do you make the username and password UniEdits align center in the form? In this example they are not in the center - one side has more space than the other.

eg, 1 has less space (margin?) than 2

image.png.1b217f90c5af62253b0b575291ac85ce.png

for UniContainerPanel1: Layout:=vbox, LayoutAttribs: Aling:=Center, Pack:=start;

image.png.2cbba6dfe5274ba4625d863e17bf38a9.png

Link to comment
Share on other sites

  • 3 months later...
  • 1 year later...

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...