QT designer - extendable window

From LiteratePrograms

Jump to: navigation, search

An extendable window is one that changes size on the fly. These can be helpful in many situations, such as putting a simple and comple search in one widget and hide the advanced features.

Trolltech has an example of this, but they do not have an example that uses the designer. This page explains what needs to be done to create an extendable widget and also shows the code and XML that is used.

Contents

Designer Step by Step

  1. Start up designer.
  2. Create a widget.
  3. Pull a button to the widget.
  4. Pull a lable to the widget, below the button.
  5. Select the backbround, and then select 'Lay out Vertical'.
  6. Open the Property Editor.
  7. Change the layoutConstraint Property to SetFixedSize.
  8. Select the pushButton and make if checkable (see QAbstractButton).
  9. Enter the Signals and Slots mode. Select the button and drag down to the Widget holding the textLable. Then check the "Show signals and slots inherited from QWidget check box.
  10. Select pushButton::toggled(bool) then select label::setVisible(bool).
  11. Save the file and build your widget.

The XML

<<dialog.ui>>=
<ui version="4.0" >
 <class>Form</class>
 <widget class="QWidget" name="Form" >
  <property name="geometry" >
   <rect>
    <x>0</x>
    <y>0</y>
    <width>281</width>
    <height>201</height>
   </rect>
  </property>
  <property name="windowTitle" >
   <string>Form</string>
  </property>
  <layout class="QVBoxLayout" name="verticalLayout" >
   <property name="sizeConstraint" >
    <enum>QLayout::SetFixedSize</enum>
   </property>
   <item>
    <widget class="QPushButton" name="pushButton" >
     <property name="text" >
      <string>PushButton</string>
     </property>
     <property name="checkable" >
      <bool>true</bool>
     </property>
     <property name="checked" >
      <bool>true</bool>
     </property>
    </widget>
   </item>
   <item>
    <widget class="QLabel" name="label" >
     <property name="text" >
      <string>TextLabel</string>
     </property>
    </widget>
   </item>
  </layout>
 </widget>
 <resources/>
 <connections>
  <connection>
   <sender>pushButton</sender>
   <signal>toggled(bool)</signal>
   <receiver>label</receiver>
   <slot>setVisible(bool)</slot>
   <hints>
    <hint type="sourcelabel" >
     <x>180</x>
     <y>19</y>
    </hint>
    <hint type="destinationlabel" >
     <x>153</x>
     <y>99</y>
    </hint>
   </hints>
  </connection>
 </connections>
</ui>

Putting it all together

<<dialog.h>>=
#ifndef DIALOG_H
#define DIALOG_H
#include <QDialog>
#include "ui_dialog.h"
class Form : public QDialog, private Ui::Form
{
    Q_OBJECT
public:
    Form(QWidget *parent = 0);
};
#endif
<<dialog.cpp>>=
#include <QtGui>
#include "dialog.h"
Form::Form(QWidget *parent)
    : QDialog(parent)
{
    setupUi(this);
}
<<dialog.pro>>=
TEMPLATE = app
TARGET = 
DEPENDPATH += .
INCLUDEPATH += .
HEADERS += dialog.h
FORMS += dialog.ui
SOURCES += dialog.cpp main.cpp

The main function

<<main.cpp>>=
#include <QApplication>
#include "dialog.h"
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    Form xdialog;
    return xdialog.exec();
}
Download code
Views