1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
<?xml version="1.0" encoding="utf-8"?>
<page xmlns="http://projectmallard.org/1.0/" xmlns:uix="http://projectmallard.org/experimental/ui/" type="topic" id="text-fields" xml:lang="gl">
<info>
<credit type="author">
<name>Allan Day</name>
<email>aday@gnome.org</email>
</credit>
<credit>
<name>Calum Benson</name>
</credit>
<credit>
<name>Adam Elman</name>
</credit>
<credit>
<name>Seth Nickell</name>
</credit>
<credit>
<name>Colin Robertson</name>
</credit>
<link type="guide" xref="ui-elements"/>
<uix:thumb mime="image/svg" src="figures/ui-elements/text-fields.svg"/>
<include xmlns="http://www.w3.org/2001/XInclude" href="legal.xml"/>
<mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
<mal:name>Fran Dieguez</mal:name>
<mal:email>frandieguez@gnome.org</mal:email>
<mal:years>2019.</mal:years>
</mal:credit>
</info>
<title>Text fields</title>
<p>A text entry field is an interface element for entering or editing text. It is a basic element with a variety of uses, including search entry, settings and preferences, or account configuration and setup. A text entry field can be prefilled with text, and can include additional buttons or icons.</p>
<media type="image" mime="image/svg" src="figures/ui-elements/text-fields.svg"/>
<section id="general-guidelines">
<title>Liñas de guía xerais</title>
<list>
<item><p>Size text fields according to the likely size of the content they will contain. This gives a useful visual cue to the amount of input expected and prevents overflow.</p></item>
<item><p>In an <link xref="dialogs#instant-and-explicit-apply">instant-apply dialog</link>, validate the contents of the entry field when it loses focus or when the window is closed, not after each keypress. Exception: if the field accepts only a fixed number of characters, such as a hexadecimal color code, validate and apply the change as soon as that number of characters have been entered.</p></item>
<item><p>If you implement an entry field that only accepts certain characters, such as digits, play the system warning beep when the user tries to type an invalid character.</p></item>
<item><p>Normally, pressing <key>Tab</key> in a single-line entry field should move focus to the next control, and in a multi-line entry field it should insert a tab character. Pressing <keyseq><key>Ctrl</key><key>Tab</key></keyseq> in a multi-line entry field should move focus to the next control.</p></item>
<item><p>If you need to provide a keyboard shortcut that inserts a tab character into a single line entry field, use <keyseq><key>Ctrl</key><key>Tab</key></keyseq>. You are unlikely to find many situations where this is useful, however.</p></item>
</list>
</section>
<section id="embedding-info-and-controls">
<title>Embedding information and controls</title>
<p>A variety of additional information or controls can be inserted within a text entry field.</p>
<p>Icons or icon buttons can be placed inside a text field to provide status information or additional controls.</p>
<list>
<item><p>An icon at the beginning of the entry can be used to indicate its purpose — replacing the need for the entry to be labelled. Search entry fields are the classic example of this, where a search icon is placed on the left side of the entry field.</p></item>
<item><p>If the text to be entered is case sensitive, a warning icon can be shown inside the text field if caps lock is on. This is typically shown on the right side of the entry.</p></item>
<item><p>If it is common for the text field to be cleared, a clear icon button can be placed inside the field, at the right side.</p></item>
<item><p>If you place an icon in a text entry field (either as an indicator or a button), use its symbolic variant from the GNOME Symbolic Icon Theme.</p></item>
</list>
<p>When a user would benefit from additional information in order to use a text entry field, it can be prefilled with a hint text. As with any decision to display additional information, this should only be done when it is necessary.</p>
</section>
<section id="api-reference">
<title>Referencia da API</title>
<list>
<item><p><link href="https://developer.gnome.org/gtk3/stable/GtkEntry.html">GtkEntry</link></p></item>
<item><p><link href="https://developer.gnome.org/gtk3/stable/GtkSearchEntry.html">GtkSearchEntry</link></p></item>
</list>
</section>
</page>
|
