Qt自定義控件開發與使用,自定義控件實現容器與控件內佈局

1.開發環境

Qt版本:Qt 4.8.7
編譯器:MinGw
系統:Windows

2.創建Qt4自定義控件

創建一個Qt自定義控件工程。

這裏寫圖片描述

工程名爲Custom。

這裏寫圖片描述

控件類取名Custom。

這裏寫圖片描述

然後完成創建。

3.包含頭文件與宏

此時編譯出來Release版本的自定義控件放進Designer目錄下僅能在Designer中拖動,在使用該控件的工程中編譯將會報錯,所以需要在該控件編譯前在該控件類的頭文件中包含指定的頭文件與宏。

在custom.h中包含頭文件QtDesigner/QDesignerExportWidget。

#include <QtDesigner/QDesignerExportWidget>

在class與類名Custom之間添加宏。

QDESIGNER_WIDGET_EXPORT

這裏寫圖片描述

4.編寫自定義控件

這裏測試用的Custom爲了與Qt控件在外觀上區別開,加上一段qss就好。

這裏寫圖片描述

當然Custom繼承自QWidget類,爲了使qss有效,會重寫一下paintEvent事件函數。

void Custom::paintEvent(QPaintEvent *)
{
    QStyleOption styleOpt;
    styleOpt.init(this);
    QPainter painter(this);
    style()->drawPrimitive(QStyle::PE_Widget, &styleOpt, &painter, this);
}

5.編譯

編寫好自定義控件類後,就需要編譯Release版本了。

編譯好Release版本後,在目標目錄中找到customplugin.dll和libcustomplugin.a(vs編譯爲.lib)並將其拷貝到Qt安裝目錄下的plugins\designer中。

這裏寫圖片描述

6.Designer

打開Designer,就可以在“自定義窗口部件”一欄下看到剛纔編寫的自定義控件Custom。

這裏寫圖片描述

拖動Custom到Designer的窗口中,就可以看到效果。

這裏寫圖片描述

7.使用自定義控件

在Qt Creator中新建一個應用工程CustomWidget。

在CustomWidget工程目錄下新建include和lib兩個目錄。

這裏寫圖片描述

講自定義控件Custom的頭文件custom.h拷貝到include目錄下,講庫libcustomplugin.a拷貝到lib目錄下。

注意:此時因爲使用的自定義控件是Release版本的,所以當前應用工程也編譯Release版本,如果當前應用工程需要Run的是Debug版本,則鏈接的自定義控件類庫也需要時Debug版本。

在CustomWidget.pro工程文件中包含頭文件與庫。

INCLUDEPATH += $$PWD/include
LIBS += $$PWD/lib/libcustomplugin.a

執行一次qmake,在生成的目標目錄下,將customplugin.dll拷貝到程序運行目錄下。

使用Designer編輯.ui文件。(是加載有自定義控件Custom的Qt Designer)

在Designer中使用自定義控件Custom。

這裏寫圖片描述

編譯應用工程CustomWidget成功後,然後運行就OK了。

這裏寫圖片描述

8.Designer中實現容器與控件內佈局

在Qt Designer中,QWidget以及QGroupBox等預定義控件都可以當做容器來存放其他控件並實現快速佈局,但是在自定義控件繼承了其基類後發現無法當做容器來存放其他控件並實現快速佈局,這個時候就需要修改重寫QDesignerCustomWidgetInterface類中的一個函數的實現。

找到Qt自定義控件中xxxplugin.h,其中有一個重寫QDesignerCustomWidgetInterface類的函數isContainer,即是否爲一個容器。

bool isContainer() const;

跳轉到xxxplugin.cpp中isContainer函數的實現。

bool XXXPlugin::isContainer() const
{
    return false;
}

將返回值修改爲true。

bool XXXPlugin::isContainer() const
{
    return true;
}

然後重新編譯並在Qt Designer中使用,即可發現該自定義控件可以作爲一個容器存放其他控件並實現控件內佈局。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章