1 | /****************************************************************************
|
---|
2 | **
|
---|
3 | ** Copyright (C) 2011 Nokia Corporation and/or its subsidiary(-ies).
|
---|
4 | ** All rights reserved.
|
---|
5 | ** Contact: Nokia Corporation ([email protected])
|
---|
6 | **
|
---|
7 | ** This file is part of the documentation of the Qt Toolkit.
|
---|
8 | **
|
---|
9 | ** $QT_BEGIN_LICENSE:FDL$
|
---|
10 | ** Commercial Usage
|
---|
11 | ** Licensees holding valid Qt Commercial licenses may use this file in
|
---|
12 | ** accordance with the Qt Commercial License Agreement provided with the
|
---|
13 | ** Software or, alternatively, in accordance with the terms contained in a
|
---|
14 | ** written agreement between you and Nokia.
|
---|
15 | **
|
---|
16 | ** GNU Free Documentation License
|
---|
17 | ** Alternatively, this file may be used under the terms of the GNU Free
|
---|
18 | ** Documentation License version 1.3 as published by the Free Software
|
---|
19 | ** Foundation and appearing in the file included in the packaging of this
|
---|
20 | ** file.
|
---|
21 | **
|
---|
22 | ** If you have questions regarding the use of this file, please contact
|
---|
23 | ** Nokia at [email protected].
|
---|
24 | ** $QT_END_LICENSE$
|
---|
25 | **
|
---|
26 | ****************************************************************************/
|
---|
27 |
|
---|
28 | /*!
|
---|
29 | \example itemviews/stardelegate
|
---|
30 | \title Star Delegate Example
|
---|
31 |
|
---|
32 | The Star Delegate example shows how to create a delegate that
|
---|
33 | can paint itself and that supports editing.
|
---|
34 |
|
---|
35 | \image stardelegate.png The Star Delegate Example
|
---|
36 |
|
---|
37 | When displaying data in a QListView, QTableView, or QTreeView,
|
---|
38 | the individual items are drawn by a
|
---|
39 | \l{Delegate Classes}{delegate}. Also, when the user starts
|
---|
40 | editing an item (e.g., by double-clicking the item), the delegate
|
---|
41 | provides an editor widget that is placed on top of the item while
|
---|
42 | editing takes place.
|
---|
43 |
|
---|
44 | Delegates are subclasses of QAbstractItemDelegate. Qt provides
|
---|
45 | QItemDelegate, which inherits QAbstractItemDelegate and handles
|
---|
46 | the most common data types (notably \c int and QString). If we
|
---|
47 | need to support custom data types, or want to customize the
|
---|
48 | rendering or the editing for existing data types, we can subclass
|
---|
49 | QAbstractItemDelegate or QItemDelegate. See \l{Delegate Classes}
|
---|
50 | for more information about delegates, and \l{Model/View
|
---|
51 | Programming} if you need a high-level introduction to Qt's
|
---|
52 | model/view architecture (including delegates).
|
---|
53 |
|
---|
54 | In this example, we will see how to implement a custom delegate
|
---|
55 | to render and edit a "star rating" data type, which can store
|
---|
56 | values such as "1 out of 5 stars".
|
---|
57 |
|
---|
58 | The example consists of the following classes:
|
---|
59 |
|
---|
60 | \list
|
---|
61 | \o \c StarRating is the custom data type. It stores a rating
|
---|
62 | expressed as stars, such as "2 out of 5 stars" or "5 out of
|
---|
63 | 6 stars".
|
---|
64 |
|
---|
65 | \o \c StarDelegate inherits QItemDelegate and provides support
|
---|
66 | for \c StarRating (in addition to the data types already
|
---|
67 | handled by QItemDelegate).
|
---|
68 |
|
---|
69 | \o \c StarEditor inherits QWidget and is used by \c StarDelegate
|
---|
70 | to let the user edit a star rating using the mouse.
|
---|
71 | \endlist
|
---|
72 |
|
---|
73 | To show the \c StarDelegate in action, we will fill a
|
---|
74 | QTableWidget with some data and install the delegate on it.
|
---|
75 |
|
---|
76 | \section1 StarDelegate Class Definition
|
---|
77 |
|
---|
78 | Here's the definition of the \c StarDelegate class:
|
---|
79 |
|
---|
80 | \snippet examples/itemviews/stardelegate/stardelegate.h 0
|
---|
81 |
|
---|
82 | All public functions are reimplemented virtual functions from
|
---|
83 | QItemDelegate to provide custom rendering and editing.
|
---|
84 |
|
---|
85 | \section1 StarDelegate Class Implementation
|
---|
86 |
|
---|
87 | The \l{QAbstractItemDelegate::}{paint()} function is
|
---|
88 | reimplemented from QItemDelegate and is called whenever the view
|
---|
89 | needs to repaint an item:
|
---|
90 |
|
---|
91 | \snippet examples/itemviews/stardelegate/stardelegate.cpp 0
|
---|
92 |
|
---|
93 | The function is invoked once for each item, represented by a
|
---|
94 | QModelIndex object from the model. If the data stored in the item
|
---|
95 | is a \c StarRating, we paint it ourselves; otherwise, we let
|
---|
96 | QItemDelegate paint it for us. This ensures that the \c
|
---|
97 | StarDelegate can handle the most common data types.
|
---|
98 |
|
---|
99 | In the case where the item is a \c StarRating, we draw the
|
---|
100 | background if the item is selected, and we draw the item using \c
|
---|
101 | StarRating::paint(), which we will review later.
|
---|
102 |
|
---|
103 | \c{StartRating}s can be stored in a QVariant thanks to the
|
---|
104 | Q_DECLARE_METATYPE() macro appearing in \c starrating.h. More on
|
---|
105 | this later.
|
---|
106 |
|
---|
107 | The \l{QAbstractItemDelegate::}{createEditor()} function is
|
---|
108 | called when the user starts editing an item:
|
---|
109 |
|
---|
110 | \snippet examples/itemviews/stardelegate/stardelegate.cpp 2
|
---|
111 |
|
---|
112 | If the item is a \c StarRating, we create a \c StarEditor and
|
---|
113 | connect its \c editingFinished() signal to our \c
|
---|
114 | commitAndCloseEditor() slot, so we can update the model when the
|
---|
115 | editor closes.
|
---|
116 |
|
---|
117 | Here's the implementation of \c commitAndCloseEditor():
|
---|
118 |
|
---|
119 | \snippet examples/itemviews/stardelegate/stardelegate.cpp 5
|
---|
120 |
|
---|
121 | When the user is done editing, we emit
|
---|
122 | \l{QAbstractItemDelegate::}{commitData()} and
|
---|
123 | \l{QAbstractItemDelegate::}{closeEditor()} (both declared in
|
---|
124 | QAbstractItemDelegate), to tell the model that there is edited
|
---|
125 | data and to inform the view that the editor is no longer needed.
|
---|
126 |
|
---|
127 | The \l{QAbstractItemDelegate::}{setEditorData()} function is
|
---|
128 | called when an editor is created to initialize it with data
|
---|
129 | from the model:
|
---|
130 |
|
---|
131 | \snippet examples/itemviews/stardelegate/stardelegate.cpp 3
|
---|
132 |
|
---|
133 | We simply call \c setStarRating() on the editor.
|
---|
134 |
|
---|
135 | The \l{QAbstractItemDelegate::}{setModelData()} function is
|
---|
136 | called when editing is finished, to commit data from the editor
|
---|
137 | to the model:
|
---|
138 |
|
---|
139 | \snippet examples/itemviews/stardelegate/stardelegate.cpp 4
|
---|
140 |
|
---|
141 | The \c sizeHint() function returns an item's preferred size:
|
---|
142 |
|
---|
143 | \snippet examples/itemviews/stardelegate/stardelegate.cpp 1
|
---|
144 |
|
---|
145 | We simply forward the call to \c StarRating.
|
---|
146 |
|
---|
147 | \section1 StarEditor Class Definition
|
---|
148 |
|
---|
149 | The \c StarEditor class was used when implementing \c
|
---|
150 | StarDelegate. Here's the class definition:
|
---|
151 |
|
---|
152 | \snippet examples/itemviews/stardelegate/stareditor.h 0
|
---|
153 |
|
---|
154 | The class lets the user edit a \c StarRating by moving the mouse
|
---|
155 | over the editor. It emits the \c editingFinished() signal when
|
---|
156 | the user clicks on the editor.
|
---|
157 |
|
---|
158 | The protected functions are reimplemented from QWidget to handle
|
---|
159 | mouse and paint events. The private function \c starAtPosition()
|
---|
160 | is a helper function that returns the number of the star under
|
---|
161 | the mouse pointer.
|
---|
162 |
|
---|
163 | \section1 StarEditor Class Implementation
|
---|
164 |
|
---|
165 | Let's start with the constructor:
|
---|
166 |
|
---|
167 | \snippet examples/itemviews/stardelegate/stareditor.cpp 0
|
---|
168 |
|
---|
169 | We enable \l{QWidget::setMouseTracking()}{mouse tracking} on the
|
---|
170 | widget so we can follow the cursor even when the user doesn't
|
---|
171 | hold down any mouse button. We also turn on QWidget's
|
---|
172 | \l{QWidget::autoFillBackground}{auto-fill background} feature to
|
---|
173 | obtain an opaque background. (Without the call, the view's
|
---|
174 | background would shine through the editor.)
|
---|
175 |
|
---|
176 | The \l{QWidget::}{paintEvent()} function is reimplemented from
|
---|
177 | QWidget:
|
---|
178 |
|
---|
179 | \snippet examples/itemviews/stardelegate/stareditor.cpp 1
|
---|
180 |
|
---|
181 | We simply call \c StarRating::paint() to draw the stars, just
|
---|
182 | like we did when implementing \c StarDelegate.
|
---|
183 |
|
---|
184 | \snippet examples/itemviews/stardelegate/stareditor.cpp 2
|
---|
185 |
|
---|
186 | In the mouse event handler, we call \c setStarCount() on the
|
---|
187 | private data member \c myStarRating to reflect the current cursor
|
---|
188 | position, and we call QWidget::update() to force a repaint.
|
---|
189 |
|
---|
190 | \snippet examples/itemviews/stardelegate/stareditor.cpp 3
|
---|
191 |
|
---|
192 | When the user releases a mouse button, we simply emit the \c
|
---|
193 | editingFinished() signal.
|
---|
194 |
|
---|
195 | \snippet examples/itemviews/stardelegate/stareditor.cpp 4
|
---|
196 |
|
---|
197 | The \c starAtPosition() function uses basic linear algebra to
|
---|
198 | find out which star is under the cursor.
|
---|
199 |
|
---|
200 | \section1 StarRating Class Definition
|
---|
201 |
|
---|
202 | \snippet examples/itemviews/stardelegate/starrating.h 0
|
---|
203 | \codeline
|
---|
204 | \snippet examples/itemviews/stardelegate/starrating.h 1
|
---|
205 |
|
---|
206 | The \c StarRating class represents a rating as a number of stars.
|
---|
207 | In addition to holding the data, it is also capable of painting
|
---|
208 | the stars on a QPaintDevice, which in this example is either a
|
---|
209 | view or an editor. The \c myStarCount member variable stores the
|
---|
210 | current rating, and \c myMaxStarCount stores the highest possible
|
---|
211 | rating (typically 5).
|
---|
212 |
|
---|
213 | The Q_DECLARE_METATYPE() macro makes the type \c StarRating known
|
---|
214 | to QVariant, making it possible to store \c StarRating values in
|
---|
215 | QVariant.
|
---|
216 |
|
---|
217 | \section1 StarRating Class Implementation
|
---|
218 |
|
---|
219 | The constructor initializes \c myStarCount and \c myMaxStarCount,
|
---|
220 | and sets up the polygons used to draw stars and diamonds:
|
---|
221 |
|
---|
222 | \snippet examples/itemviews/stardelegate/starrating.cpp 0
|
---|
223 |
|
---|
224 | The \c paint() function paints the stars in this \c StarRating
|
---|
225 | object on a paint device:
|
---|
226 |
|
---|
227 | \snippet examples/itemviews/stardelegate/starrating.cpp 2
|
---|
228 |
|
---|
229 | We first set the pen and brush we will use for painting. The \c
|
---|
230 | mode parameter can be either \c Editable or \c ReadOnly. If \c
|
---|
231 | mode is editable, we use the \l{QPalette::}{Highlight} color
|
---|
232 | instead of the \l{QPalette::}{Foreground} color to draw the
|
---|
233 | stars.
|
---|
234 |
|
---|
235 | Then we draw the stars. If we are in \c Edit mode, we paint
|
---|
236 | diamonds in place of stars if the rating is less than the highest
|
---|
237 | rating.
|
---|
238 |
|
---|
239 | The \c sizeHint() function returns the preferred size for an area
|
---|
240 | to paint the stars on:
|
---|
241 |
|
---|
242 | \snippet examples/itemviews/stardelegate/starrating.cpp 1
|
---|
243 |
|
---|
244 | The preferred size is just enough to paint the maximum number of
|
---|
245 | stars. The function is called by both \c StarDelegate::sizeHint()
|
---|
246 | and \c StarEditor::sizeHint().
|
---|
247 |
|
---|
248 | \section1 The \c main() Function
|
---|
249 |
|
---|
250 | Here's the program's \c main() function:
|
---|
251 |
|
---|
252 | \snippet examples/itemviews/stardelegate/main.cpp 5
|
---|
253 |
|
---|
254 | The \c main() function creates a QTableWidget and sets a \c
|
---|
255 | StarDelegate on it. \l{QAbstractItemView::}{DoubleClicked} and
|
---|
256 | \l{QAbstractItemView::}{SelectedClicked} are set as
|
---|
257 | \l{QAbstractItemView::editTriggers()}{edit triggers}, so that the
|
---|
258 | editor is opened with a single click when the star rating item is
|
---|
259 | selected.
|
---|
260 |
|
---|
261 | The \c populateTableWidget() function fills the QTableWidget with
|
---|
262 | data:
|
---|
263 |
|
---|
264 | \snippet examples/itemviews/stardelegate/main.cpp 0
|
---|
265 | \snippet examples/itemviews/stardelegate/main.cpp 1
|
---|
266 | \dots
|
---|
267 | \snippet examples/itemviews/stardelegate/main.cpp 2
|
---|
268 | \snippet examples/itemviews/stardelegate/main.cpp 3
|
---|
269 | \codeline
|
---|
270 | \snippet examples/itemviews/stardelegate/main.cpp 4
|
---|
271 |
|
---|
272 | Notice the call to qVariantFromValue to convert a \c
|
---|
273 | StarRating to a QVariant.
|
---|
274 |
|
---|
275 | \section1 Possible Extensions and Suggestions
|
---|
276 |
|
---|
277 | There are many ways to customize Qt's \l{Model/View
|
---|
278 | Programming}{model/view framework}. The approach used in this
|
---|
279 | example is appropriate for most custom delegates and editors.
|
---|
280 | Examples of possibilities not used by the star delegate and star
|
---|
281 | editor are:
|
---|
282 |
|
---|
283 | \list
|
---|
284 | \o It is possible to open editors programmatically by calling
|
---|
285 | QAbstractItemView::edit(), instead of relying on edit
|
---|
286 | triggers. This could be use to support other edit triggers
|
---|
287 | than those offered by the QAbstractItemView::EditTrigger enum.
|
---|
288 | For example, in the Star Delegate example, hovering over an
|
---|
289 | item with the mouse might make sense as a way to pop up an
|
---|
290 | editor.
|
---|
291 |
|
---|
292 | \o By reimplementing QAbstractItemDelegate::editorEvent(), it is
|
---|
293 | possible to implement the editor directly in the delegate,
|
---|
294 | instead of creating a separate QWidget subclass.
|
---|
295 | \endlist
|
---|
296 | */
|
---|