Customize your Login Box

Customize the login box for your own branding or look-and-feel.

Qt Creator provides a default login box.

Figure: Default login box


The default login box created with Qt Creator.

Before you begin

Download Qt Creator, available from the Qt website. Download the version for your operating system.

Create a blank form widget

To create a custom login box from Qt Creator, run the integrated Qt Designer. To start:
  1. Open Qt Creator.
  2. Select File > New File or Project.
  3. Under File and Classes select Qt. Select Qt Designer Form. Click Choose....

    The form Choose a Form Template opens.

  4. Under templates\forms, select Widget. Click Next....p

    The Location form opens.

  5. Enter a Name for your .ui file and the Path where it will be stored. Click Next.

    The Project Management form opens.

  6. Click Finish.

Create the form

In Qt Designer Form, create a form with the following items:
  • a QWidget for the form
  • a QPushButton named m_OKPushButton for the OK button
  • a QPushButton named m_CancelPushButton for the Cancel button
  • a QLabel named m_UserNameLabel for the label dedicated to the user name
  • a QLabel named m_PasswordLabel for the label dedicated to the password
  • a QLineEdit named m_UserNameLineEdit for the edit field where the user enters his name
  • a QLineEdit named m_PasswordLineEdit for the edit field where the user enters his password
  • a QCheckBox named m_SaveCheckBox for the checkbox which allows the password to be saved
Optional :
  • a QLabel named m_TextLabel if you're using a customized message when asking for the password again

Assign the custom login box

Assign the form you created (the .ui file) to a shortcut.

You assign the form:
  • in step 5 when creating a Direct connection shortcut.
  • in step 3 when creating an HTTP shortcut.

Figure: Specify the Login form


Screen capture of a New Shortcut wizard, step 5.

Once assigned, your form is used instead of the default login box.

Tips

  • As with a Genero layout, use a Vertical Layout and Horizontal Layout to correctly align and organize your widgets.
  • We strongly recommend you embed all elements in a Grid layout (QGridLayout). The Genero Desktop Client (GDC) always resizes the Login Box to its minimum size. When previewing (Alt+Shift+R or Tools > Form Editor > Preview ) your form in the Qt Designer, you should not be able to resize it to a very tiny size; using a grid layout around the various items helps to avoid this. Another solution is to specify a minimum size for the QWidget Form. For this, change the parameters (Width, Height) of the attribute minimumSize of the QWidget Form.
  • Use Horizontal and Vertical Spacers to better control the free space.
  • You can add widgets typically not used in a login box, such as TextEdit or RadioButton widgets.

Sample

This login box is produced by a customized .ui file. You can request a copy of this file from your local support.

Figure: Customized login box example


The figure is a screen shot of a customized login box.