README.md · 无言/CatLearnQt

## 目录

[English description](./README_English.md)

- [目录](#目录)
- [CatLearnQt](#catlearnqt)
- [项目地址](#项目地址)
- [徽章预览](#徽章预览)
  - [项目](#项目)
  - [编译](#编译)
- [开发环境](#开发环境)
  - [项目根目录说明](#项目根目录说明)
  - [核心库](#核心库)
    - [使用核心库](#使用核心库)
      - [GrayCatQt](#graycatqt)
        - [qmake](#qmake)
        - [cmake](#cmake)
      - [GrayCatQtQuick](#graycatqtquick)
        - [qmake](#qmake-1)
        - [cmake](#cmake-1)
      - [GrayCatQtCore](#graycatqtcore)
        - [qmake](#qmake-2)
        - [cmake](#cmake-2)
      - [GrayFramelesshelper](#grayframelesshelper)
        - [qmake](#qmake-3)
        - [cmake](#cmake-3)
  - [Examples 项目](#examples-项目)
    - [CatQuickExamples效果预览](#catquickexamples效果预览)
      - [控件列表](#控件列表)
      - [效果演示](#效果演示)
      - [Figma原型](#figma原型)
    - [CatWidgetExamples效果预览](#catwidgetexamples效果预览)
    - [MetroDemo惠州地铁案例效果预览](#metrodemo惠州地铁案例效果预览)

## CatLearnQt

CatLearnQt 记录自己学习Qt过程.

CatLearnQt是根据GPL v3许可发行，如果您使用CatLearnQt或其组成库，则必须遵守相关许可条款。

## 项目地址

[GitHub]: ./doc/Images/github.svg
[Gitee]: ./doc/Images/gitee-fill-round.svg
[CodeChina]: ./doc/Images/codechina.png

## 徽章预览

### 项目

[CII-badge]: https://bestpractices.coreinfrastructure.org/projects/4578/badge
[CII-link]: https://bestpractices.coreinfrastructure.org/zh-CN/projects/4578

[license-link]: https://github.com/graycatya/CatLearnQt/blob/main/Licence.md "LICENSE"
[license-badge]: https://img.shields.io/github/license/graycatya/CatLearnQt?style=plastic

[Gitter-link]: https://gitter.im/CatLearnQt/community
[Gitter]: https://badges.gitter.im/CatLearnQt/community.svg "community"

### 编译

| [Windows][win-link]| [Ubuntu][ubuntu-link]|[MacOS][macos-link]|[Android][android-link]|[IOS][ios-link]|
|---------------|---------------|-----------------|-----------------|----------------|
| ![win-badge]  | ![ubuntu-badge]      | ![macos-badge] |![android-badge]   |![ios-badge]   |

[win-link]: https://github.com/graycatya/CatLearnQt/actions?query=workflow%3AWindows "WindowsAction"
[win-badge]: https://github.com/graycatya/CatLearnQt/workflows/Windows/badge.svg  "Windows"

[ubuntu-link]: https://github.com/graycatya/CatLearnQt/actions?query=workflow%3AUbuntu "UbuntuAction"
[ubuntu-badge]: https://github.com/graycatya/CatLearnQt/workflows/Ubuntu/badge.svg "Ubuntu"

[macos-link]: https://github.com/graycatya/CatLearnQt/actions?query=workflow%3AMacOS "MacOSAction"
[macos-badge]: https://github.com/graycatya/CatLearnQt/workflows/MacOS/badge.svg "MacOS"

[android-link]: https://github.com/graycatya/CatLearnQt/actions?query=workflow%3AAndroid "AndroidAction"
[android-badge]: https://github.com/graycatya/CatLearnQt/workflows/Android/badge.svg "Android"

[ios-link]: https://github.com/graycatya/CatLearnQt/actions?query=workflow%3AIOS "IOSAction"
[ios-badge]: https://github.com/graycatya/CatLearnQt/workflows/IOS/badge.svg "IOS"

## 开发环境

* Qt5.12以上

* 支持qt5.15

### 项目根目录说明

### 核心库

#### 使用核心库

##### GrayCatQt

###### qmake

* pri文件用法

使用该核心库只需要导入，模块文件夹下的'.pri'文件

GrayCatYa需要使用的资源将以qrc资源方式被引用，注意资源的路径名，不要跟新的qrc资源文件重路径。

导入pri后不需要额外的编译，生成dll或插件

>步骤

```
include(GrayCatQt/GrayCatQt.pri)
```

* pro文件用法

如果需要编译成库,打开GrayCatQt目录下的pro文件编译即可。

```
cd GrayCatQt
qmake GrayCatQt.pro
```

###### cmake

1. 先拷贝module文件夹到你项目目录下，这里面有cmake要用到的模块

```
# 在你的CMakeLists.txt中使用该模块
list(APPEND CMAKE_MODULE_PATH "${CMAKE_CURRENT_SOURCE_DIR}/module/cmake")
include(GrayCatQt)
```

2. 拷贝GrayCatQt到你项目目录下，注意它跟module文件在同级目录

```
# 在你的CMakeLists.txt中使用该模块
add_subdirectory(${CMAKE_CURRENT_SOURCE_DIR}/GrayCatQt GrayCatQt.out)
```

##### GrayCatQtQuick

###### qmake

* pri文件用法

使用该核心库只需要导入，模块文件夹下的'.pri'文件

GrayCatQtQuick需要使用的资源将以qrc资源方式被引用，注意资源的路径名，不要跟新的qrc资源文件重路径。

导入pri后不需要额外的编译，生成dll或插件

>步骤

```
include(GrayCatQtQuick/GrayCatQtQuick.pri)
```

* pro文件用法

如果需要编译成库,打开GrayCatQtQuick目录下的pro文件编译即可。

```
cd GrayCatQtQuick
qmake GrayCatQtQuick.pro
```

###### cmake

1. 先拷贝module文件夹到你项目目录下，这里面有cmake要用到的模块

```
# 在你的CMakeLists.txt中使用该模块
list(APPEND CMAKE_MODULE_PATH "${CMAKE_CURRENT_SOURCE_DIR}/module/cmake")
include(GrayCatQt)
```

2. 拷贝GrayCatQtQuick到你项目目录下，注意它跟module文件在同级目录

```
# 在你的CMakeLists.txt中使用该模块
add_subdirectory(${CMAKE_CURRENT_SOURCE_DIR}/GrayCatQtQuick GrayCatQtQuick.out)
```

##### GrayCatQtCore

###### qmake

* pri文件用法

使用该核心库只需要导入，模块文件夹下的'.pri'文件

导入pri后不需要额外的编译，生成dll或插件

>步骤

```
include(GrayCatQtCore/GrayCatQtCore.pri)
```

* pro文件用法

如果需要编译成库,打开GrayCatQtCore目录下的pro文件编译即可。

```
cd GrayCatQtCore
qmake GrayCatQtCore.pro
```

###### cmake

1. 先拷贝module文件夹到你项目目录下，这里面有cmake要用到的模块

```
# 在你的CMakeLists.txt中使用该模块
list(APPEND CMAKE_MODULE_PATH "${CMAKE_CURRENT_SOURCE_DIR}/module/cmake")
include(GrayCatQt)
```

2. 拷贝GrayCatQtCore到你项目目录下，注意它跟module文件在同级目录

```
# 在你的CMakeLists.txt中使用该模块
add_subdirectory(${CMAKE_CURRENT_SOURCE_DIR}/GrayCatQtCore GrayCatQtCore.out)
```

##### GrayFramelesshelper

###### qmake

* pri文件用法

使用该核心库只需要导入，模块文件夹下的'.pri'文件

>步骤

```
include(GrayFramelesshelper/GrayFramelesshelper.pri)
```

###### cmake

1. 拷贝GrayFramelesshelper到你项目目录下

```
# 在你的CMakeLists.txt中使用该模块
add_subdirectory(${CMAKE_CURRENT_SOURCE_DIR}/GrayFramelesshelper GrayFramelesshelper.out)
```

### Examples 项目

#### CatQuickExamples效果预览

##### 控件列表

##### 效果演示

![QuickExamples_0](./doc/PubImages/QuickExamples_0.png)

![QuickExamples_1](./doc/PubImages/QuickExamples_1.png)

![QuickExamples_2](./doc/PubImages/QuickExamples_2.png)

##### Figma原型

[CatQuickExamples_Figma](https://www.figma.com/community/file/1002381105559834769/CatQuickExamples)

#### CatWidgetExamples效果预览

* 基于Widget设计的控件

![widgetdemo](./doc/PubImages/widgetdemo.png)

* 基于QGraphicsView画板控件演示

![boarddemo](./doc/PubImages/boarddemo.png)

* 基于QQuickWidget控件演示

![quickwidgetdemo](./doc/PubImages/quickwidgetdemo.png)

* 设置相关

![settingdemo](./doc/PubImages/settingdemo.png)

#### MetroDemo惠州地铁案例效果预览

[在线演示(https://graycatya.gitee.io/webassemblyExample/MetroDemo/MetroDemo.html)](https://graycatya.gitee.io/webassemblyExample/MetroDemo/MetroDemo.html)

![metrodemo](./doc/PubImages/metrodemo.gif)

无言/CatLearnQt

简介

发行版

贡献者

近期动态

无言/CatLearnQt .gitee-modal { width: 500px !important; }

简介

发行版

贡献者

近期动态

搜索帮助

无言/CatLearnQt