Skip to content

a cool QtQuick component library (一套酷炫的QtQuick基础库)

License

Notifications You must be signed in to change notification settings

jaredtao/TaoQuick

Repository files navigation

简体中文


Contents

TaoQuick

This is a QtQuick/Qml Component library, integrated some commonly used QtQuick components, and

makes the appropriate function expansion to facilitate development of Qml applications.

Badge preview

Project

Best Practices plan License
CII-badge license-badge

Qt marketplace

https://marketplace.qt.io/collections/newest/products/taoquick

Build

Windows Ubuntu MacOS Android IOS
win-badge ubuntu-badge macos-badge android-badge ios-badge

Release

Released Download Download count
release-badge download-badge download-latest

Repository status

Tag Languages Top Language code size repo size
tag-latest languanges taolanguage code-size repo-size

Issue

Issues pull request
issuse-badge pull-request

Other status

commit freq last commit date forks stars
commit-active commit-latest release-date forks-badge stars-badge

Some Demo Preview

Main Page

Change Skin

Multi-Language

Some Button Controls

Data entry Controls

Table Controls

ListView with tab

Rect Drag Controls

Wizard

Mouse Click Effect

Atom Joggle

ShaderToy-Snail

ShaderToy-SuperMario

Environment

  • Qt 5.9

  • Qt 5.12

  • Qt 5.15

  • Qt6.2 (at branch qt6)

Project Struct

Project Struct as follows:

Echo contents as the table below:

Content Reference Remark
src TaoQuick Core Library Some qml codes, pictures and scripts for support designer, not including c++ code
examples Some demos Show how to use TaoQuick Core Library
3rdparty A third party library
mkspecs Qmake externs
.github Github-actions CI CD

TaoQuick Core Library

Core Library source code path:

src/TaoQuick/Qml

Content:

To avoid confusion with Qt default components, TaoQuick components' names all begin with Cus (The abbreviation of Custom)

CusConfig is the global configuration, which mainly contains font, theme and so on, and all components are displayed in this configuration.

Other Contents reference to the table below:

Content Reference Remark
Basic Basic Controls Such as Text, ToolTip, they are used to unify basic components in the whole project and facilitate the global replacement when the project becomes huge
CusBackground A simple background box it is usually placed at the beginning of the program to absorb the mouse focus from the white space
CusButton button Some commonly used buttons have been encapsulated, and various effects can be customized again
CusCheckBox CheckBox
CusComboBox ComboBox
CusImage Basic Image
CusInput Input
CusLabel Label
CusListView List Simple custom scrollbars
CusPopup Popup
CusScroll ScrollBar
CusSlider Slider
CusSpinBox SpinBox
CusTable Table It needs to be used with a specific C++ model to support functions like selection, check, draw rect selection, anti-selection, continuous selection and all selection
Effect Effect Animation, PageSwitch and ShaderToy
Misc Others

Use TaoQuick

get code

git clone https://github.com/jaredtao/TaoQuick.git
cd TaoQuick 

qmake

You just need import '.pri' file to your project and add import Path to QmlEngine, TaoQuick will be used as local files or qrc resources.

Compared with 'Qml module' and 'Qml C++ plugin', this usage has advantages below:

  • After you import '.pri', no additional compilation, generation of dlls or plugins would be required

  • No additional copy resource is required to deploy the program

  • After you import '.pri', Qt Creator can support TaoQuick Qml code highlighting and double-clicking the following symbol

  • After importing the module 'import TaoQuick 1.0' in Qml, you can use the TaoQuick component on Designer mode of Qt Creator by dragging or in visual property editor (Principle: Generating metainfos is required by Designer via some scripts)

Detailed steps:

  1. Copy 'TaoQuick' directory and 'TaoQuick.pri' file from TaoQuick/src to your project

  2. Import 'TaoQuick.pri' files in your project 'pro' file

For example:

include(TaoQuick.pri)

TaoQuick.pri defines a MACRO: TaoQuickImportPath.

On Debug mode you use TaoQuick as local files, and Release mode is for qrc resource.

  1. Add import path in cpp

Before you load source qmls, TaoQuick need add import path to QmlEngine and set imagePath to context.

If you use QQuickView, TaoQuick can be used as follows:

    view.engine()->addImportPath(TaoQuickImportPath);
    view.rootContext()->setContextProperty("taoQuickImportPath", TaoQuickImportPath);

if you use QmlEngine, TaoQuick can be use as follows:

    engine.addImportPath(TaoQuickImportPath);
    engine.rootContext()->setContextProperty("taoQuickImportPath", TaoQuickImportPath);

cmake

TaoQuick starts support cmake after version 0.5.0 , which is the same as qmake.

Detailed steps:

  1. Copy 'TaoQuick' directory and 'taoQuick.cmake' file from TaoQuick/src to your project

  2. Import 'taoQuick.cmake' files in your project's 'CMakeLists.txt' file

include(taoQuick.cmake)

taoQuick.cmake will define a MACRO: TaoQuickImportPath.

On Debug mode you use TaoQuick as local files, and Release mode is for the qrc resource.

On Release mode taoQuick.cmake also defines a MACRO: TaoQuickRes, which locates qrc file.

your project should add TaoQuickRes to executable, like this:

if (CMAKE_BUILD_TYPE MATCHES "Release")
    add_executable(MyApp ${someSource} ${TaoQuickRes})
else()
    add_executable(MyApp ${someSource})
endif()
  1. Add an import path in cpp

Before loading source qmls, you need add an import path to QmlEngine and set imagePath to contexts.

if you use QQuickView, TaoQuick can be used as follows:

    view.engine()->addImportPath(TaoQuickImportPath);
    view.rootContext()->setContextProperty("taoQuickImportPath", TaoQuickImportPath);

if you use QmlEngine, TaoQuick can be used as follows:

    engine.addImportPath(TaoQuickImportPath);
    engine.rootContext()->setContextProperty("taoQuickImportPath", TaoQuickImportPath);

Sponsorship

If you feel this shared content is good, treat the author a drink.

You could pay by WeChat Pay or Alipay.