Difference between revisions of "Projects/Usability/HIG/Tabs Pages"

< Projects‎ | Usability‎ | HIG
Jump to: navigation, search
(Paged Dialogs)
(Added Implementation section)
 
(3 intermediate revisions by one user not shown)
Line 1: Line 1:
 
==Tabs and Pages in Dialogs==
 
==Tabs and Pages in Dialogs==
 
'''General Guidelines'''
 
  
 
If a control affects only one tab or page in the dialog, place it on that tab/page. If it affects every tab/page in the dialog, place it outside, for example beside the window's OK and Cancel buttons.
 
If a control affects only one tab or page in the dialog, place it on that tab/page. If it affects every tab/page in the dialog, place it outside, for example beside the window's OK and Cancel buttons.
Line 14: Line 12:
 
If you cannot see all the tabs without scrolling or splitting them into multiple rows, you are probably using too many and should use a paged dialog instead.
 
If you cannot see all the tabs without scrolling or splitting them into multiple rows, you are probably using too many and should use a paged dialog instead.
  
[[File:Tabs_pages.png]]
+
[[File:Tabs_good.png]]
 +
GOOD
 +
 
 +
[[File:Tabs_bad.png]]
 +
BAD
  
 
===Paged Dialogs===
 
===Paged Dialogs===
Line 23: Line 25:
 
For other dialogs, use paged dialogs if there are too many tabs to put them into a tabbed dialog.
 
For other dialogs, use paged dialogs if there are too many tabs to put them into a tabbed dialog.
  
[[File:Tabs_pages2.png]]
+
[[File:Paged_dialog.png]]
  
===Accessibility===
+
== Implementation ==
Do not assign accelerator keys to tab and paged dialog labels. Assign an access key to every other control on each page, however.
+
* [http://api.kde.org/4.10-api/kdelibs-apidocs/kdeui/html/classKPageDialog.html KPageDialog].
 +
*  [http://api.kde.org/4.10-api/kdelibs-apidocs/kdeui/html/classKConfigDialog.html KConfigDialog]
  
=== See Also ===
+
== See Also ==
 
* [[Projects/Usability/HIG/Dialogs|Dialogs]]
 
* [[Projects/Usability/HIG/Dialogs|Dialogs]]

Latest revision as of 16:45, 27 June 2013

Contents

[edit] Tabs and Pages in Dialogs

If a control affects only one tab or page in the dialog, place it on that tab/page. If it affects every tab/page in the dialog, place it outside, for example beside the window's OK and Cancel buttons.

Make sure changes on one tab will not change options on another tab.

[edit] Tabbed Dialogs

When to Use

Use tabbed dialogs when you have a limited number of tabs (max. 6). If you cannot see all the tabs without scrolling or splitting them into multiple rows, you are probably using too many and should use a paged dialog instead.

Tabs good.png GOOD

Tabs bad.png BAD

[edit] Paged Dialogs

When to Use

Always use paged dialogs for configuration dialogs - assuming that there is more than one section of options to be configured. For other dialogs, use paged dialogs if there are too many tabs to put them into a tabbed dialog.

Paged dialog.png

[edit] Implementation

[edit] See Also


This page was last modified on 27 June 2013, at 16:45. This page has been accessed 3,452 times. Content is available under Creative Commons License SA 3.0 as well as the GNU Free Documentation License 1.2.
KDE® and the K Desktop Environment® logo are registered trademarks of KDE e.V.Legal