diff options
Diffstat (limited to 'doc/html/customstyles.html')
| -rw-r--r-- | doc/html/customstyles.html | 213 |
1 files changed, 213 insertions, 0 deletions
diff --git a/doc/html/customstyles.html b/doc/html/customstyles.html new file mode 100644 index 0000000..ac76e89 --- /dev/null +++ b/doc/html/customstyles.html @@ -0,0 +1,213 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> +<!-- /home/espenr/tmp/qt-3.3.8-espenr-2499/qt-x11-free-3.3.8/doc/customstyles.doc:36 --> +<html> +<head> +<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> +<title>Style overview</title> +<style type="text/css"><!-- +fn { margin-left: 1cm; text-indent: -1cm; } +a:link { color: #004faf; text-decoration: none } +a:visited { color: #672967; text-decoration: none } +body { background: #ffffff; color: black; } +--></style> +</head> +<body> + +<table border="0" cellpadding="0" cellspacing="0" width="100%"> +<tr bgcolor="#E5E5E5"> +<td valign=center> + <a href="index.html"> +<font color="#004faf">Home</font></a> + | <a href="classes.html"> +<font color="#004faf">All Classes</font></a> + | <a href="mainclasses.html"> +<font color="#004faf">Main Classes</font></a> + | <a href="annotated.html"> +<font color="#004faf">Annotated</font></a> + | <a href="groups.html"> +<font color="#004faf">Grouped Classes</font></a> + | <a href="functions.html"> +<font color="#004faf">Functions</font></a> +</td> +<td align="right" valign="center"><img src="logo32.png" align="right" width="64" height="32" border="0"></td></tr></table><h1 align=center>Style overview</h1> + + + +<p> A style in Qt implements the look and feel found in a GUI for a +particular platform. For example, Windows platforms may use the +Windows or Windows-XP style, Unix platforms may use the <a href="motif-extension.html#Motif">Motif</a> style, +and so on. +<p> This is a short guide that describes the steps that are necessary to +get started creating and using custom styles with the Qt 3.x style +API. First, we go through the steps necessary to create a style: +<ol type=1> +<li> Pick a base style to inherit from. +<li> Re-implement the necessary functions in the derived class. +</ol> +Then we explain how to use the new style from within your own +applications, or as a plugin that can be used by existing Qt +applications. +<p> <h2> Creating a custom style +</h2> +<a name="1"></a><p> <h3> 1. Pick a base style to inherit from. +</h3> +<a name="1-1"></a><p> The first step is to pick one of the base styles provided with Qt to +build your custom style from. The choice will depend on what look and +feel you are trying to achieve. We recommend that you choose from the +<a href="qwindowsstyle.html">QWindowsStyle</a> derived classes or the <a href="qmotifstyle.html">QMotifStyle</a> derived classes. +These are the two base look and feel classes in the Qt style engine. +Inheriting directly from <a href="qcommonstyle.html">QCommonStyle</a> is also an option if you want to +start almost from scratch when implementing your style. In this simple +example we will inherit from QWindowsStyle. +<p> <h3> 2. Re-implement the necessary functions in your derived class. +</h3> +<a name="1-2"></a><p> Depending on which parts of the base style you want to change, you +must re-implement the functions that are used to draw those parts +of the interface. If you take a look at the <a href="qstyle.html">QStyle</a> documentation, +you will find a list of the different primitives, controls and complex +controls. In this example we will first change the look of the +standard arrows that are used in the QWindowsStyle. The arrows are +PrimitiveElements that are drawn by the drawPrimitive() function, +so we need to re-implement that function. We need the following class +declaration: +<p> <pre> +#include <<a href="qwindowsstyle-h.html">qwindowsstyle.h</a>> + +class CustomStyle : public <a href="qwindowsstyle.html">QWindowsStyle</a> { + <a href="metaobjects.html#Q_OBJECT">Q_OBJECT</a> +public: + CustomStyle(); + ~CustomStyle(); + + void drawPrimitive( PrimitiveElement pe, + <a href="qpainter.html">QPainter</a> *p, + const <a href="qrect.html">QRect</a> & r, + const <a href="qcolorgroup.html">QColorGroup</a> & cg, + SFlags flags = Style_Default, + const <a href="qstyleoption.html">QStyleOption</a> & = QStyleOption::Default ) const; + +private: + // Disabled copy constructor and operator= + CustomStyle( const CustomStyle & ); + CustomStyle& operator=( const CustomStyle & ); +}; +</pre> + +<p> Note that we disable the copy constructor and the '=' operator for our +style. <a href="qobject.html">QObject</a> is the base class for all style classes in Qt, and a +QObject inherently cannot be copied since there are some aspects of it +that are not copyable. +<p> From the <a href="qstyle.html">QStyle</a> docs we see that <tt>PE_ArrowUp</tt>, <tt>PE_ArrowDown</tt>, <tt>PE_ArrowLeft</tt> and <tt>PE_ArrowRight</tt> are the primitives we need to do +something with. We get the following in our drawPrimitive() function: +<p> <pre> +CustomStyle::CustomStyle() +{ +} + +CustomStyle::~CustomStyle() +{ +} + +void CustomStyle::drawPrimitive( PrimitiveElement pe, + <a href="qpainter.html">QPainter</a> * p, + const <a href="qrect.html">QRect</a> & r, + const <a href="qcolorgroup.html">QColorGroup</a> & cg, + SFlags flags, + const <a href="qstyleoption.html">QStyleOption</a> & opt ) const +{ + // we are only interested in the arrows + if (pe >= PE_ArrowUp && pe <= PE_ArrowLeft) { + <a href="qpointarray.html">QPointArray</a> pa( 3 ); + // make the arrow cover half the area it is supposed to be + // painted on + int x = r.<a href="qrect.html#x">x</a>(); + int y = r.<a href="qrect.html#y">y</a>(); + int w = r.<a href="qrect.html#width">width</a>() / 2; + int h = r.<a href="qrect.html#height">height</a>() / 2; + x += (r.<a href="qrect.html#width">width</a>() - w) / 2; + y += (r.<a href="qrect.html#height">height</a>() - h) /2; + + switch( pe ) { + case PE_ArrowDown: + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 0, x, y ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 1, x + w, y ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 2, x + w / 2, y + h ); + break; + case PE_ArrowUp: + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 0, x, y + h ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 1, x + w, y + h ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 2, x + w / 2, y ); + break; + case PE_ArrowLeft: + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 0, x + w, y ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 1, x + w, y + h ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 2, x, y + h / 2 ); + break; + case PE_ArrowRight: + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 0, x, y ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 1, x, y + h ); + pa.<a href="qpointarray.html#setPoint">setPoint</a>( 2, x + w, y + h / 2 ); + break; + default: break; + + } + + // use different colors to indicate that the arrow is + // enabled/disabled + if ( flags & Style_Enabled ) { + p-><a href="qpainter.html#setPen">setPen</a>( cg.<a href="qcolorgroup.html#mid">mid</a>() ); + p-><a href="qpainter.html#setBrush">setBrush</a>( cg.<a href="qcolorgroup.html#brush">brush</a>( QColorGroup::ButtonText ) ); + } else { + p-><a href="qpainter.html#setPen">setPen</a>( cg.<a href="qcolorgroup.html#buttonText">buttonText</a>() ); + p-><a href="qpainter.html#setBrush">setBrush</a>( cg.<a href="qcolorgroup.html#brush">brush</a>( QColorGroup::Mid ) ); + } + p-><a href="qpainter.html#drawPolygon">drawPolygon</a>( pa ); + } else { + // let the base style handle the other primitives + QWindowsStyle::<a href="qstyle.html#drawPrimitive">drawPrimitive</a>( pe, p, r, cg, flags, data ); + } +} +</pre> + +<p> <h3> Using a custom style +</h3> +<a name="1-3"></a><p> There are several ways of using a custom style in a Qt application. +The simplest way is to include the following lines of code in the +application's main() function: +<p> <pre> +#include "customstyle.h" + +int main( int argc, char ** argv ) +{ + QApplication::<a href="qapplication.html#setStyle">setStyle</a>( new CustomStyle() ); + // do the usual routine on creating your QApplication object etc. +} +</pre> + +<p> Note that you must also include the <tt>customstyle.h</tt> and <tt>customstyle.cpp</tt> files in your project. +<p> 2. Creating and using a pluggable style +<p> You may want to make your style available for use in other +applications, some of which may not be yours and are not available for +you to recompile. The Qt Plugin system makes it possible to create +styles as plugins. Styles created as plugins are loaded as shared +objects at runtime by Qt itself. Please refer to the <a href="plugins-howto.html">Qt Plugin</a> documentation for more +information on how to go about creating a style plugin. +<p> Compile your plugin and put it into $QTDIR/plugins/styles. We now have +a pluggable style that Qt can load automatically. To use your new +style with existing applications, simply start the application with +the following argument: +<p> <pre> +./application -style custom +</pre> + +<p> The application will use the look and feel from the custom style you +implemented. +<p> +<!-- eof --> +<p><address><hr><div align=center> +<table width=100% cellspacing=0 border=0><tr> +<td>Copyright © 2007 +<a href="troll.html">Trolltech</a><td align=center><a href="trademarks.html">Trademarks</a> +<td align=right><div align=right>Qt 3.3.8</div> +</table></div></address></body> +</html> |