<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <!-- qtwidgets-index.qdoc --> <title>Qt Widgets 5.9</title> <link rel="stylesheet" type="text/css" href="style/offline-simple.css" /> <script type="text/javascript"> document.getElementsByTagName("link").item(0).setAttribute("href", "style/offline.css"); // loading style sheet breaks anchors that were jumped to before // so force jumping to anchor again setTimeout(function() { var anchor = location.hash; // need to jump to different anchor first (e.g. none) location.hash = "#"; setTimeout(function() { location.hash = anchor; }, 0); }, 0); </script> </head> <body> <div class="header" id="qtdocheader"> <div class="main"> <div class="main-rounded"> <div class="navigationbar"> <table><tr> <td >Qt 5.9</td><td >Qt Widgets</td></tr></table><table class="buildversion"><tr> <td id="buildversion" width="100%" align="right">Qt 5.9.4 Reference Documentation</td> </tr></table> </div> </div> <div class="content"> <div class="line"> <div class="content mainContent"> <div class="sidebar"> <div class="toc"> <h3><a name="toc">Contents</a></h3> <ul> <li class="level1"><a href="#getting-started">Getting Started</a></li> <li class="level1"><a href="#widgets">Widgets</a></li> <li class="level1"><a href="#styles">Styles</a></li> <li class="level1"><a href="#layouts">Layouts</a></li> <li class="level1"><a href="#model-view-classes">Model/View Classes</a></li> <li class="level1"><a href="#graphics-view">Graphics View</a></li> <li class="level1"><a href="#related-information">Related Information</a></li> <li class="level2"><a href="#tutorials">Tutorials</a></li> <li class="level2"><a href="#examples">Examples</a></li> <li class="level1"><a href="#api-reference">API Reference</a></li> </ul> </div> <div class="sidebar-content" id="sidebar-content"></div></div> <h1 class="title">Qt Widgets</h1> <span class="subtitle"></span> <!-- $$$qtwidgets-index.html-description --> <div class="descr"> <a name="details"></a> <p>The <a href="qtwidgets-module.html">Qt Widgets Module</a> provides a set of UI elements to create classic desktop-style user interfaces. See the User Interfaces overview for more information on using widgets.</p> <a name="getting-started"></a> <h2 id="getting-started">Getting Started</h2> <p>To include the definitions of the module's classes, use the following directive:</p> <pre class="cpp"> <span class="preprocessor">#include <QtWidgets></span> </pre> <p>To link against the module, add this line to your <a href="../qmake/qmake-manual.html">qmake</a> <code>.pro</code> file:</p> <pre class="cpp"> QT += widgets </pre> <a name="widgets"></a> <h2 id="widgets">Widgets</h2> <p>Widgets are the primary elements for creating user interfaces in Qt. <a href="widget-classes.html#the-widget-classes">Widgets</a> can display data and status information, receive user input, and provide a container for other widgets that should be grouped together. A widget that is not embedded in a parent widget is called a <a href="application-windows.html">window</a>.</p> <p class="centerAlign"><img src="images/parent-child-widgets.png" alt="A parent widget containing various child widgets." /></p><p>The <a href="qwidget.html">QWidget</a> class provides the basic capability to render to the screen, and to handle user input events. All UI elements that Qt provides are either subclasses of <a href="qwidget.html">QWidget</a>, or are used in connection with a <a href="qwidget.html">QWidget</a> subclass. Creating custom widgets is done by subclassing <a href="qwidget.html">QWidget</a> or a suitable subclass and reimplementing the virtual event handlers.</p> <ul> <li><a href="application-windows.html">Window and Dialog Widgets</a></li> <li><a href="mainwindow.html">Application Main Window</a></li> <li><a href="dialogs.html">Dialog Windows</a></li> <li><a href="focus.html">Keyboard Focus in Widgets</a></li> </ul> <a name="styles"></a> <h2 id="styles">Styles</h2> <p><a href="style-reference.html">Styles</a> draw on behalf of widgets and encapsulate the look and feel of a GUI. Qt's built-in widgets use the <a href="qstyle.html">QStyle</a> class to perform nearly all of their drawing, ensuring that they look exactly like the equivalent native widgets.</p> <div class="table"><table class="generic"> <tr valign="top" class="odd"><td ><p class="centerAlign"><img src="images/windowsxp-tabwidget.png" alt="" /></p></td><td ><p class="centerAlign"><img src="images/fusion-tabwidget.png" alt="" /></p></td><td ><p class="centerAlign"><img src="images/macos-tabwidget.png" alt="" /></p></td></tr> </table></div> <p><a href="stylesheet.html">Qt Style Sheets</a> are a powerful mechanism that allows you to customize the appearance of widgets, in addition to what is already possible by subclassing <a href="qstyle.html">QStyle</a>.</p> <a name="layouts"></a> <h2 id="layouts">Layouts</h2> <p><a href="layout.html">Layouts</a> are an elegant and flexible way to automatically arrange child widgets within their container. Each widget reports its size requirements to the layout through the <a href="qwidget.html#sizeHint-prop">sizeHint</a> and <a href="qwidget.html#sizePolicy-prop">sizePolicy</a> properties, and the layout distributes the available space accordingly.</p> <div class="table"><table class="generic"> <tr valign="top" class="odd"><td ><p class="centerAlign"><img src="images/qgridlayout-with-5-children.png" alt="" /></p></td><td ><p class="centerAlign"><img src="images/qformlayout-with-6-children.png" alt="" /></p></td></tr> </table></div> <p>Qt Designer is a powerful tool for interactively creating and arranging widgets in layouts.</p> <a name="model-view-classes"></a> <h2 id="model-view-classes">Model/View Classes</h2> <p>The <a href="model-view-programming.html">model/view</a> architecture provides classes that manage the way data is presented to the user. Data-driven applications which use lists and tables are structured to separate the data and view using models, views, and delegates.</p> <p class="centerAlign"><img src="images/windowsxp-treeview.png" alt="" /></p><a name="graphics-view"></a> <h2 id="graphics-view">Graphics View</h2> <p>The <a href="graphicsview.html">Graphics View Framework</a> is for managing and interacting with a large number of custom-made 2D graphical items, and a view widget for visualizing the items, with support for zooming and rotation.</p> <p class="centerAlign"><img src="images/graphicsview-items.png" alt="" /></p><a name="related-information"></a> <h2 id="related-information">Related Information</h2> <a name="tutorials"></a> <h3 >Tutorials</h3> <ul> <li><a href="widgets-tutorial.html">Widgets Tutorial</a></li> <li>Getting Started Programming with Qt Widgets</li> <li>Creating a Qt Widget Based Application</li> <li><a href="modelview.html">Model/View Tutorial</a></li> </ul> <a name="examples"></a> <h3 >Examples</h3> <ul> <li><a href="examples-widgets.html">Qt Widgets Examples</a></li> <li><a href="layout.html#layout-examples">Layout Examples</a></li> </ul> <a name="api-reference"></a> <h2 id="api-reference">API Reference</h2> <p>These are links to the API reference materials.</p> <ul> <li><a href="qtwidgets-module.html">Qt Widgets C++ Classes</a><ul> <li><a href="widget-classes.html#basic-widget-classes">Basic Widget Classes</a></li> <li><a href="widget-classes.html#advanced-widget-classes">Advanced Widget Classes</a></li> <li><a href="widget-classes.html#abstract-widget-classes">Abstract Widget Classes</a></li> <li><a href="widget-classes.html#organizer-widget-classes">Organizer Widget Classes</a></li> <li><a href="widget-classes.html#graphics-view-classes">Graphics View Classes</a></li> <li><a href="model-view-programming.html#model-view-classes">Model/View Classes</a></li> <li><a href="widget-classes.html#main-window-and-related-classes">Main Window and Related Classes</a></li> <li><a href="widget-classes.html#widget-appearance-and-style-related-classes">Widget Appearance and Style Related Classes</a></li> <li><a href="widget-classes.html#layout-classes">Layout Classes</a></li> </ul> </li> <li><a href="stylesheet-reference.html">Qt Style Sheets Reference</a></li> </ul> </div> <!-- @@@qtwidgets-index.html --> </div> </div> </div> </div> </div> <div class="footer"> <p> <acronym title="Copyright">©</acronym> 2017 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners.<br> The documentation provided herein is licensed under the terms of the <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation License version 1.3</a> as published by the Free Software Foundation.<br> Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners. </p> </div> </body> </html>