Changeset View
Changeset View
Standalone View
Standalone View
source/layout/metrics.rst
| Show All 34 Lines | 31 | - If the control appears in a dialog or utility window, consider making | |||
|---|---|---|---|---|---|
| 35 | user last resized it to. | 35 | user last resized it to. | ||
| 36 | - Size controls with a minimum of | 36 | - Size controls with a minimum of | ||
| 37 | 37 | | |||
| 38 | - Icon: 16x16px | 38 | - Icon: 16x16px | ||
| 39 | - Buttons: 72 x 32px | 39 | - Buttons: 72 x 32px | ||
| 40 | - Line edits, Drop-downs, Combo boxes: ≥80 x 32 px | 40 | - Line edits, Drop-downs, Combo boxes: ≥80 x 32 px | ||
| 41 | - Text edits: ≥80 x ≥36 px (text should not exceed 80 characters per | 41 | - Text edits: ≥80 x ≥36 px (text should not exceed 80 characters per | ||
| 42 | line) | 42 | line) | ||
| 43 | - Check box, Radio button including label: ≥80 x 24 px | 43 | - Checkbox, Radio button including label: ≥80 x 24 px | ||
| 44 | - Group boxes: ≥120 x ≥96 px | 44 | - Group boxes: ≥120 x ≥96 px | ||
| 45 | - Tree view: ≥120 x ≥96 px | 45 | - Tree view: ≥120 x ≥96 px | ||
| 46 | - List view: ≥80 px (per column) x ≥96 | 46 | - List view: ≥80 px (per column) x ≥96 | ||
| 47 | 47 | | |||
| 48 | - KDE seeks to support XGA (1024x768px) or WXGA (1280x768px) at least. | 48 | - KDE seeks to support XGA (1024x768px) or WXGA (1280x768px) at least. | ||
| 49 | 49 | | |||
| 50 | - Keep in mind that not everyone is provided with a high resolution | 50 | - Keep in mind that not everyone is provided with a high resolution | ||
| 51 | display. | 51 | display. | ||
| Show All 39 Lines | |||||
| 91 | ~~~~~~~~~~~~~~~~~~~~~~~~~~~ | 91 | ~~~~~~~~~~~~~~~~~~~~~~~~~~~ | ||
| 92 | 92 | | |||
| 93 | - A units.smallSpacing padding is the minimum recommended padding inside elements (buttons, drop boxes, text fields, etc.) | 93 | - A units.smallSpacing padding is the minimum recommended padding inside elements (buttons, drop boxes, text fields, etc.) | ||
| 94 | - An 2 * units.smallSpacing padding is the minimum recommended padding inside grouping frames (group boxes, tabs, etc.) | 94 | - An 2 * units.smallSpacing padding is the minimum recommended padding inside grouping frames (group boxes, tabs, etc.) | ||
| 95 | - Use default spacing of | 95 | - Use default spacing of | ||
| 96 | 96 | | |||
| 97 | - related items within groups: 2 * units.smallSpacing | 97 | - related items within groups: 2 * units.smallSpacing | ||
| 98 | - label and item: units.smallSpacing | 98 | - label and item: units.smallSpacing | ||
| 99 | - related controls with same type (check boxes / radio buttons): units.smallSpacing | 99 | - related controls with same type (checkboxes / radio buttons): units.smallSpacing | ||
| 100 | - related controls with different type (check box / button): units.smallSpacing | 100 | - related controls with different type (checkbox / button): units.smallSpacing | ||
| 101 | - unrelated controls: ≥ 2 * units.smallSpacing | 101 | - unrelated controls: ≥ 2 * units.smallSpacing | ||
| 102 | 102 | | |||
| 103 | .. figure:: /img/Spacing_Padding.qml.png | 103 | .. figure:: /img/Spacing_Padding.qml.png | ||
| 104 | :alt: Sample spacing | 104 | :alt: Sample spacing | ||
| 105 | 105 | | |||
| 106 | Sample spacing | 106 | Sample spacing | ||
| 107 | 107 | | |||
| 108 | 108 | | |||
| Show All 15 Lines | |||||