Difference between revisions of "GUI design"

From Lazarus wiki
Jump to navigationJump to search
Line 10: Line 10:
 
Settings that should be applied in general are;
 
Settings that should be applied in general are;
  
* '''BorderStyle''' : bsSizeToolWin
+
* '''BorderStyle''' : bsSizeable
 
* '''Position''' : poScreenCenter
 
* '''Position''' : poScreenCenter
 
* '''FormStyle''' : fsStayOnTop (or show the dialog using ShowModal)
 
* '''FormStyle''' : fsStayOnTop (or show the dialog using ShowModal)
  
=== General layout ===
+
===General layout===
* On the bottom a panel should be placed with the required buttons to close / cancel the dialog, or to recieve help.
+
* On the bottom all required buttons to close / cancel the dialog, or to recieve help should be placed
* At least fit on a 800x640 screen
+
* At least fit a screen of 800x640
 
* Close on Escape (if key not used otherwise)
 
* Close on Escape (if key not used otherwise)
 
* Define default button and Return activates it (if key not used)
 
* Define default button and Return activates it (if key not used)
 
* Medium to complex dialogs should be resizable and size is stored
 
* Medium to complex dialogs should be resizable and size is stored
  
==== Dialog panel ====
+
====Button panel====
The dialog panel should consist at least of the following elements;
+
The button panel should consist at least of the following elements;
  
 
* OK button
 
* OK button
Line 32: Line 32:
 
An example is shown below:
 
An example is shown below:
  
<center>[[Image:example.jpg]]<center>
+
<center>bottom panel.jpg</center>
 +
 
 +
==Dialogs to be converted to LFM==
 +
Bold items are already converted
 +
Italic items are being worked on
 +
 
 +
* /lazarus/ide/addtoprojectdlg.pas
 +
* /lazarus/ide/buildlazdialog.pas
 +
* /lazarus/ide/clipboardhistory.pas
 +
* /lazarus/ide/codetemplatedialog.pp
 +
* /lazarus/ide/codetoolsdefines.pas
 +
* /lazarus/ide/codetoolsoptions.pas
 +
* /lazarus/ide/compileroptionsdlg.pp
 +
* '''/lazarus/ide/diffdialog.pas'''
 +
* /lazarus/ide/diskdiffsdialog.pas
 +
* ''/lazarus/ide/editoroptions.pp''
 +
* '''/lazarus/ide/environmentopts.pp'''
 +
* /lazarus/ide/exttooldialog.pas
 +
* /lazarus/ide/exttooleditdlg.pas
 +
* /lazarus/ide/findinfilesdlg.pas
 +
* /lazarus/ide/findreplacedialog.pp
 +
* /lazarus/ide/helpmanager.pas
 +
* /lazarus/ide/inputfiledialog.pas
 +
* /lazarus/ide/keymapping.pp
 +
* /lazarus/ide/macropromptdlg.pas
 +
* /lazarus/ide/mainbar.pas
 +
* /lazarus/ide/makeresstrdlg.pas
 +
* /lazarus/ide/msgview.pp
 +
* /lazarus/ide/newdialog.pas
 +
* /lazarus/ide/newprojectdlg.pp
 +
* /lazarus/ide/patheditordlg.pas
 +
* /lazarus/ide/projectinspector.pas
 +
* /lazarus/ide/projectopts.pp
 +
* /lazarus/ide/runparamsopts.pas
 +
* /lazarus/ide/searchresultview.pp
 +
* /lazarus/ide/sortselectiondlg.pas
 +
* /lazarus/ide/splash.pp
 +
* /lazarus/ide/sysvaruseroverridedlg.pas
 +
* /lazarus/ide/todolist.pp
 +
* /lazarus/ide/unitdependencies.pas
 +
* /lazarus/ide/uniteditor.pp
 +
* /lazarus/ide/unitinfodlg.pp
 +
* /lazarus/ide/viewunit_dlg.pp
 +
* /lazarus/debugger/debuggerdlg.pp
 +
* /lazarus/debugger/watchpropertydlg.pp
 +
* /lazarus/designer/aligncompsdlg.pp
 +
* /lazarus/designer/designermenu.pp
 +
* /lazarus/designer/menueditorform.pas
 +
* /lazarus/designer/menupropedit.pp
 +
* /lazarus/designer/noncontrolforms.pas
 +
* /lazarus/designer/objinspext.pas
 +
* /lazarus/designer/scalecompsdlg.pp
 +
* /lazarus/designer/sizecompsdlg.pp
 +
* /lazarus/doceditor/fmmakeskel.pp
 +
* /lazarus/doceditor/frmabout.pp
 +
* /lazarus/doceditor/frmbuild.pp
 +
* /lazarus/doceditor/frmexample.pp
 +
* /lazarus/doceditor/frmlink.pp
 +
* /lazarus/doceditor/frmmain.pp
 +
* /lazarus/doceditor/frmmakeskel.pp
 +
* /lazarus/doceditor/frmnewnode.pp
 +
* /lazarus/doceditor/frmoptions.pp
 +
* /lazarus/doceditor/frmtable.pp
 +
* /lazarus/ideintf/columndlg.pp
 +
* /lazarus/ideintf/componenteditors.pas
 +
* /lazarus/ideintf/graphpropedits.pas
 +
* /lazarus/ideintf/imagelisteditor.pp
 +
* /lazarus/ideintf/listviewpropedit.pp
 +
* /lazarus/ideintf/propedits.pp
 +
* /lazarus/packager/addtopackagedlg.pas
 +
* /lazarus/packager/brokendependenciesdlg.pas
 +
* /lazarus/packager/packagedefs.pas
 +
* /lazarus/packager/pkggraphexplorer.pas
 +
* /lazarus/packager/pkgoptionsdlg.pas
 +
* /lazarus/debugger/test
 +
* /lazarus/tools/apiwizz/apiwizard.pp

Revision as of 22:38, 22 September 2005

Overview

When working on lazarus, certain design guidelines need to be taken into consideration. To prevent a diversity of styles and ensure the clarity of dialogs. The next article tries to summarize several guidelines to help you designing.

Dialogs

Dialogs are special forms that need the user to make / change some setting before lazarus can continue.


Dialog Settings

Settings that should be applied in general are;

  • BorderStyle : bsSizeable
  • Position : poScreenCenter
  • FormStyle : fsStayOnTop (or show the dialog using ShowModal)

General layout

  • On the bottom all required buttons to close / cancel the dialog, or to recieve help should be placed
  • At least fit a screen of 800x640
  • Close on Escape (if key not used otherwise)
  • Define default button and Return activates it (if key not used)
  • Medium to complex dialogs should be resizable and size is stored

Button panel

The button panel should consist at least of the following elements;

  • OK button
  • Cancel button
  • Next button (optional)
  • Previous button (optional)
  • Help button

An example is shown below:

bottom panel.jpg

Dialogs to be converted to LFM

Bold items are already converted Italic items are being worked on

  • /lazarus/ide/addtoprojectdlg.pas
  • /lazarus/ide/buildlazdialog.pas
  • /lazarus/ide/clipboardhistory.pas
  • /lazarus/ide/codetemplatedialog.pp
  • /lazarus/ide/codetoolsdefines.pas
  • /lazarus/ide/codetoolsoptions.pas
  • /lazarus/ide/compileroptionsdlg.pp
  • /lazarus/ide/diffdialog.pas
  • /lazarus/ide/diskdiffsdialog.pas
  • /lazarus/ide/editoroptions.pp
  • /lazarus/ide/environmentopts.pp
  • /lazarus/ide/exttooldialog.pas
  • /lazarus/ide/exttooleditdlg.pas
  • /lazarus/ide/findinfilesdlg.pas
  • /lazarus/ide/findreplacedialog.pp
  • /lazarus/ide/helpmanager.pas
  • /lazarus/ide/inputfiledialog.pas
  • /lazarus/ide/keymapping.pp
  • /lazarus/ide/macropromptdlg.pas
  • /lazarus/ide/mainbar.pas
  • /lazarus/ide/makeresstrdlg.pas
  • /lazarus/ide/msgview.pp
  • /lazarus/ide/newdialog.pas
  • /lazarus/ide/newprojectdlg.pp
  • /lazarus/ide/patheditordlg.pas
  • /lazarus/ide/projectinspector.pas
  • /lazarus/ide/projectopts.pp
  • /lazarus/ide/runparamsopts.pas
  • /lazarus/ide/searchresultview.pp
  • /lazarus/ide/sortselectiondlg.pas
  • /lazarus/ide/splash.pp
  • /lazarus/ide/sysvaruseroverridedlg.pas
  • /lazarus/ide/todolist.pp
  • /lazarus/ide/unitdependencies.pas
  • /lazarus/ide/uniteditor.pp
  • /lazarus/ide/unitinfodlg.pp
  • /lazarus/ide/viewunit_dlg.pp
  • /lazarus/debugger/debuggerdlg.pp
  • /lazarus/debugger/watchpropertydlg.pp
  • /lazarus/designer/aligncompsdlg.pp
  • /lazarus/designer/designermenu.pp
  • /lazarus/designer/menueditorform.pas
  • /lazarus/designer/menupropedit.pp
  • /lazarus/designer/noncontrolforms.pas
  • /lazarus/designer/objinspext.pas
  • /lazarus/designer/scalecompsdlg.pp
  • /lazarus/designer/sizecompsdlg.pp
  • /lazarus/doceditor/fmmakeskel.pp
  • /lazarus/doceditor/frmabout.pp
  • /lazarus/doceditor/frmbuild.pp
  • /lazarus/doceditor/frmexample.pp
  • /lazarus/doceditor/frmlink.pp
  • /lazarus/doceditor/frmmain.pp
  • /lazarus/doceditor/frmmakeskel.pp
  • /lazarus/doceditor/frmnewnode.pp
  • /lazarus/doceditor/frmoptions.pp
  • /lazarus/doceditor/frmtable.pp
  • /lazarus/ideintf/columndlg.pp
  • /lazarus/ideintf/componenteditors.pas
  • /lazarus/ideintf/graphpropedits.pas
  • /lazarus/ideintf/imagelisteditor.pp
  • /lazarus/ideintf/listviewpropedit.pp
  • /lazarus/ideintf/propedits.pp
  • /lazarus/packager/addtopackagedlg.pas
  • /lazarus/packager/brokendependenciesdlg.pas
  • /lazarus/packager/packagedefs.pas
  • /lazarus/packager/pkggraphexplorer.pas
  • /lazarus/packager/pkgoptionsdlg.pas
  • /lazarus/debugger/test
  • /lazarus/tools/apiwizz/apiwizard.pp