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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
|
// Copyright (C) 2020 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GFDL-1.3-no-invariants-only
/*!
\page topics-ui.html
\title User Interfaces
\brief Qt's technologies for Creating User Interfaces
\ingroup explanations-ui
The Qt framework's main user interface technologies are \b{Qt Quick}
and \b{Qt Widgets}. Qt Quick interfaces are fluid, dynamic, and are best
on touch interfaces. Qt Widgets are for creating complex desktop applications.
You can create Qt Quick and Qt Widgets interfaces with the target
platform's native look and feel.
\section1 Building UIs with Qt Quick
Qt Quick is for creating dynamic and fluid user interfaces. The
\l{Qt Quick Controls} module supplies QML types such as buttons, dialogs, and
menus. You can use \l{The QML Reference}{QML}, a declarative language,
to build the UI and JavaScript to implement the logic.
The following list contains related overviews:
\list
\li \l{Qt Quick Controls}
\li \l{QML Applications} - introduction to QML
\li \l{qtquick-usecase-visual.html}{Visual types in QML}
\li \l{qtquick-usecase-userinput.html}{Responding to User Input in QML}
\li \l{qtquick-usecase-animations.html}{Animations in QML}
\li \l{qtquick-usecase-text.html}{Displaying Text in QML}
\li \l{qtquick-usecase-layouts.html}{Layouts in QML}
\li \l{qtquick-usecase-styling.html}{Style and Theme Support}
\li \l{qtquick-usecase-integratingjs.html}{Integrating JavaScript in QML}
\li \l{Qt Quick 3D} - add-on for 3D graphics
\li \l{Qt Shader Tools} - add-on shader effects
\endlist
\section1 Qt Widgets User Interfaces
\l {Qt Widgets} are the user interface elements that are typical in desktop
environments. The widgets integrate well to the underlying platform providing
native look and feel on Windows, Linux and \macos. The widgets are
mature and feature rich user interface elements suitable for mostly traditional
user interfaces. In contrast to \l {Qt Quick}, the widgets are for creating
large desktop applications and less suited for creating touch-centric
applications with fluid interfaces.
The following list contains related overviews for Qt Widgets:
\list
\li \l{Widgets Classes}
\li \l{Animation Framework}
\li \l{Application Main Window}
\li \l{Dialog Windows}
\li \l{Drag and Drop}
\li \l{Gestures in Widgets and Graphics View}
\li \l{Layout Management}
\li \l{Window and Dialog Widgets}
\li \l{Styles and Style Aware Widgets}
\endlist
\section2 Comparison of UI Interfaces
The following table compares Qt Widgets and Qt Quick interfaces.
\table
\header
\li
\li Qt Quick / Qt Quick Controls
\li Qt Widgets
\li Comments
\row
\li Used language(s)
\li \l{QML Applications}{QML/JS}
\li C++
\li
\row
\li Native look and feel
\li \inlineimage ok.png
\li \inlineimage ok.png
\li Qt Widgets and Qt Quick Controls support native look and feel on
their target platforms.
\row
\li Custom styling
\li \inlineimage ok.png
\li \inlineimage ok.png
\li Qt Widgets provide customization with
\l{Qt Style Sheets}{style sheets} and Qt Quick Controls has a
selection of \l{Styling Qt Quick Controls}{customizable styles}.
\row
\li Fluid animated UIs
\li \inlineimage ok.png
\li
\li Qt Widgets do not scale well for animations. Qt Quick
offers a convenient and natural way to implement animations in a
declarative manner.
\row
\li Touch screen
\li \inlineimage ok.png
\li
\li Qt Widgets often require a mouse cursor for good interaction, whereas
Qt Quick provides QML types for touch interaction.
\row
\li Standard industry widgets
\li
\li \inlineimage ok.png
\li Qt Widgets provide all the bells and whistles, developed over two
decades, needed for building standard industry type applications.
\row
\li Model/View programming
\li \inlineimage ok.png
\li \inlineimage ok.png
\li Qt Quick provides convenient views, but Qt Widgets provide more
convenient and complete framework. In addition to Qt Quick views,
Qt Quick Controls provide a TableView.
\row
\li Rapid UI development
\li \inlineimage ok.png
\li \inlineimage ok.png
\li Qt Quick is an excellent choice for rapid UI prototyping and development.
\row
\li HW accelerated graphics
\li \inlineimage ok.png
\li \inlineimage ok.png
\li Qt provides full hardware acceleration for Qt Quick interfaces and
Qt Widgets interfaces are rendered in software. The \l{Graphics}
overview has more information.
\row
\li Graphical effects
\li \inlineimage ok.png
\li
\li Several Qt Quick modules provide graphical effects and Qt Widgets
interfaces can use \l{Qt GUI} for effects.
\row
\li Rich text processing
\li \inlineimage ok.png
\li \inlineimage ok.png
\li Qt Widgets currently provide the most comprehensive base for implementing
text editors. Qt's rich text document classes can also be utilized in
Qt Quick and Qt Quick Controls' TextArea, but may require some C++
implementation.
\row
\endtable
\section1 Related Topics
The following pages contain more information about designing and developing user
interfaces:
\list
\li \l{Design Tools} - overview of user interface tools for designers and
developers
\li \l{Graphics} - graphics overview
\li \l{Model/View Programming}
\li \l{High DPI}
\endlist
*/
|
