說明：

=====

1.1 PySide2 ：這個QT的親兒子最近（2018年7月）才出生，而且持續有團隊在維護。

1.2 PyQt5：是在PySide2之前的，Qt收的義子 （Riverbank Computing這個公司開發的）。

1.3 Qt庫里面有非常強大的圖形界面開發庫，但是Qt庫是C++語言開發的，PySide2、PyQt5可以讓我們通過Python語言使用Qt。推薦使用：PySide2。（終于理順關系了）

1.4 基于Qt 的Python庫

1.4.1 優點是控件比較豐富、跨平臺體驗好、文檔完善、用戶多。

1.4.2 缺點是 庫比較大，發布出來的程序比較大；當然是個好東西，總得介紹介紹。

1.5 大家要開發小工具，界面比較簡單，可以采用appJar，EasyGUI，PySimpleGUI，我都有介紹：

《自稱是Python中GUI的終極工具:appJar》

《EasyGUI是python的一個超級簡單的GUI工具介紹（一）》

《python3的PySimpleGUI庫的介紹、安裝、學習》

2 安裝：

======

2.1 環境：華為筆記本電腦、深度deepin-linux操作系統、python3.8和微軟vscode編輯器。

2.2 安裝：

#安裝 PySide2
pip install pyside2   #官網方法，太慢
#本機安裝
#sudo pip3.8 install pyside2  #太慢
#推薦國內源安裝
#sudo pip3.8 install -i https://mirrors.aliyun.com/pypi/simple pyside2  

2.3 官網：

https://doc.qt.io/qtforpython/index.html
https://wiki.qt.io/Qt_for_Python
https://forum.qt.io/category/58/qt-for-python
https://pypi.org/project/PySide2/   #最新版
https://wiki.qt.io/PySide2

2.4 竟然沒有github地址：

https://github.com/PySide  #PySide (deprecated)，這個地址指已經棄用了

3 helloworld：最簡單的一個GUI窗口開始學習：

====================================

3.1 多種方法的代碼：

#方法一
from PySide2.QtWidgets import QApplication, QLabel                                          
app=QApplication()
label=QLabel("Hello World")
label.show()
app.exec_()

#方法二
from PySide2.QtWidgets import QApplication, QLabel
                                                    
if __name__=="__main__":
    app=QApplication()
    label=QLabel("Hello World")
    label.show()
    app.exec_()

#方法三
from PySide2.QtWidgets import QApplication, QLabel

def main():
    app=QApplication()
    label=QLabel("Hello World")
    label.show()
    app.exec_()
                                                    
if __name__=="__main__":
    main()

#方法四
import sys
from PySide2.QtWidgets import QApplication, QLabel
                                                    
if __name__=="__main__":
    app=QApplication(sys.argv)  #python的sys.argv的知識點
    label=QLabel("Hello World")
    label.show()
    sys.exit(app.exec_())

3.2 python的sys.argv：（引申）

3.2.1 sys.argv[0]表示代碼本身文件路徑。

3.2.2 sys.argv[ ]其實就是一個列表，里邊的項為用戶輸入的參數，關鍵就是要明白這參數是從程序外部輸入的，而非代碼本身的什么地方，要想看到它的效果就應該將程序保存了，從外部來運行程序并給出參數。

3.3 效果圖：

4 美化上述：

=========

4.1 QLabel的文本的字體大小和顏色：

from PySide2.QtWidgets import QApplication, QLabel
app=QApplication()
#文本設置：字體大小和顏色定義
label=QLabel("<font color=red size=40>Hello World!</font>")
label.show()
app.exec_()

4.2 窗口大小、位置和標題名：

#方法一
from PySide2.QtWidgets import QApplication, QWidget
class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("中文顯示窗口")
        #窗口位置和大小
        self.setGeometry(300,300, 500,400)
        self.setIcon()
#myApp=QApplication(sys.argv)
app=QApplication()  #與上面相同
window=Window()
window.show()
app.exec_()

#方法二：窗口大小、位置和標題名，帶有窗口內容顯示文本的
#增加控件：QWidget,QFormLayout,QVBoxLayout
from PySide2.QtWidgets import QApplication, QLabel,QWidget,QFormLayout,QVBoxLayout
app=QApplication()
#自定義Windowti=window title=窗口相關設置：類（python的基礎知識）
class Windowti(QWidget):
    #初始化特性
    def __init__(self):
        QWidget.__init__(self)
        #窗口標題名
        self.setWindowTitle('你好世界！HelloWorld！')  #支持中文
        #self.setMinimumWidth(400) #最小窗口寬度
        #窗口大小和位置
        #x和y是坐標，左上角坐標為0,0
        #w和h是寬和高，即窗口大小
        #setGeometry(x: int, y: int, w: int, h: int)
        self.setGeometry(10,10,500,500)
        # Create the QVBoxLayout that lays out the whole form
        self.layout=QVBoxLayout()
        # Create the form layout that manages the labeled controls
        self.form_layout=QFormLayout()
        self.greeting=QLabel('', self)
        #self.form_layout.addRow('Hello World!', self.greeting)
        self.form_layout.addRow('<font color=red size=40>Hello World!</font>', self.greeting)
        # Add the form layout to the main VBox layout
        self.layout.addLayout(self.form_layout)
        # Set the VBox layout as the window's main layout
        self.setLayout(self.layout)

    def run(self):
        # Show the form
        self.show()
        # Run the qt application
        app.exec_()

myfirstapp=Windowti()
myfirstapp.run()

效果圖：

4.3 qml法：

4.3.1 文件夾：1hw下面有2個文件：main.py和mian.qml

4.3.2 main.py代碼：

from PySide2.QtWidgets import QApplication
from PySide2.QtQml import QQmlApplicationEngine

if __name__=="__main__":
    app=QApplication()
    #注意main.qml文件的目錄和路徑
    engine=QQmlApplicationEngine("/home/xgj/Desktop/pyside2/1hw/main.qml")
    app.exec_()

4.3.3 main.qml代碼：注意：安裝插件：Qt for python，這樣qml代碼才有高亮。

import QtQuick 2.7
import QtQuick.Window 2.3
import QtQuick.Controls 2.3

ApplicationWindow {
    id: _window
    // 窗口標題設置
    title: "qml顯示窗口Helloworld！"
    // 窗口大小和位置的設置
    width: 800
    height: 500
    x:300
    y:300
    // Window默認不可見，需要進行設置為可見
    visible: true
}

4.3.4 運行效果圖：

5 圖片顯示：

========

5.1 靜態圖片顯示：

from PySide2.QtWidgets import QApplication, QLabel
from PySide2.QtGui import QPixmap
#app=QApplication([])
app=QApplication()  #等同于上面
Label=QLabel()
#指定圖片的目錄和路徑，圖片格式：jpeg,jpg,png,ico均可
PixMap=QPixmap("/home/xgj/Desktop/pyside2/20.jpeg")
#PixMap=QPixmap("/home/xgj/Desktop/pyside2/18.jpg")
#PixMap=QPixmap("/home/xgj/Desktop/pyside2/1231.png")
#PixMap=QPixmap("/home/xgj/Desktop/pyside2/1.ico")
#PixMap=QPixmap("/home/xgj/Desktop/pyside2/yytd.gif")  #顯示靜態的，不是gif動態的
Label.setPixmap(PixMap)
Label.show()
app.exec_()

效果圖：

5.2 gif圖顯示：

from PySide2.QtWidgets import QApplication, QLabel
from PySide2.QtGui import QMovie
#app=QApplication([])
app=QApplication()
Label=QLabel()
#注意不要把這行放到實例化app對象的上面，會無效
#gif因為是動態的，屬于movie動畫類
Movie=QMovie("/home/xgj/Desktop/pyside2/yytd.gif")  #可以
#Movie=QMovie("/home/xgj/Desktop/pyside2/test.mp4")  #報錯
Label.setMovie(Movie)
#這句表示播放動畫，不能省略。也不能放到show后面，否則無法自適應大小
Movie.start()                                
Label.show()
app.exec_()

效果圖：

====很仔細，初始pyside2===

整理并分享出來，喜歡的就點贊、關注、評論、轉發和收藏。

、前言

通用移動類，目標就是為了實現放入任意的控件以后，支持鼠標拖動，在容器中或者父類中拖動，這個應用場景非常多，比如在地圖上放置的設備，需要用戶自行按下拖動到指定的合適的位置，然后保存設備的位置坐標到數據庫，下次打開直接加載，在一些安防項目、電力項目、環境監測等上面大量運用，有時候設備對應了多種類型，以前做的辦法是將這個移動的代碼直接封裝在對應設備的自定義控件中，有個巨大缺點就是如果再新增加一個控件，又需要重復的代碼加到控件中才行，可否將這個功能獨立出來，只要傳入控件就行呢，當然可以，比如我寫過很多自定義控件，現在需要控件放到某個容器中能自由拖動，只需要new出通用移動類來就行。
項目開源地址：https://gitee.com/feiyangqingyun/QWidgetDemo

二、實現的功能

• 1:可以指定需要移動的widget
• 2:可設置是否限定鼠標左鍵拖動
• 3:支持任意widget控件

三、效果圖

四、頭文件代碼

#ifndef MOVEWIDGET_H
#define MOVEWIDGET_H

/**
 * 通用控件移動類 作者:feiyangqingyun(QQ:517216493) 2019-9-28
 * 1:可以指定需要移動的widget
 * 2:可設置是否限定鼠標左鍵拖動
 * 3:支持任意widget控件
 */

#include <QWidget>

#ifdef quc
#if (QT_VERSION < QT_VERSION_CHECK(5,7,0))
#include <QtDesigner/QDesignerExportWidget>
#else
#include <QtUiPlugin/QDesignerExportWidget>
#endif

class QDESIGNER_WIDGET_EXPORT MoveWidget : public QObject
#else
class MoveWidget : public QObject
#endif

{
    Q_OBJECT
public:
    explicit MoveWidget(QObject *parent=0);

protected:
    bool eventFilter(QObject *watched, QEvent *event);

private:
    QPoint lastPoint;   //最后按下的坐標
    bool pressed;       //鼠標是否按下
    bool leftButton;    //限定鼠標左鍵
    QWidget *widget;    //移動的控件

public Q_SLOTS:
    //設置是否限定鼠標左鍵
    void setLeftButton(bool leftButton);
    //設置要移動的控件
    void setWidget(QWidget *widget);
};

#endif // MOVEWIDGET_H

【領QT開發教程學習資料，點擊下方鏈接莬費領取↓↓，先碼住不迷路~】

點擊這里：「鏈接」

五、核心代碼

#include "movewidget.h"
#include "qevent.h"
#include "qdebug.h"

MoveWidget::MoveWidget(QObject *parent) : QObject(parent)
{
    lastPoint=QPoint(0, 0);
    pressed=false;
    leftButton=true;
    widget=0;
}

bool MoveWidget::eventFilter(QObject *watched, QEvent *event)
{
    if (widget !=0 && watched==widget) {
        QMouseEvent *mouseEvent=(QMouseEvent *)event;
        if (mouseEvent->type()==QEvent::MouseButtonPress) {
            //如果限定了只能鼠標左鍵拖動則判斷當前是否是鼠標左鍵
            if (leftButton && mouseEvent->button() !=Qt::LeftButton) {
                return false;
            }

            //判斷控件的區域是否包含了當前鼠標的坐標
            if (widget->rect().contains(mouseEvent->pos())) {
                lastPoint=mouseEvent->pos();
                pressed=true;
            }
        } else if (mouseEvent->type()==QEvent::MouseMove && pressed) {
            //計算坐標偏移值,調用move函數移動過去
            int offsetX=mouseEvent->pos().x() - lastPoint.x();
            int offsetY=mouseEvent->pos().y() - lastPoint.y();
            widget->move(widget->x() + offsetX, widget->y() + offsetY);
        } else if (mouseEvent->type()==QEvent::MouseButtonRelease && pressed) {
            pressed=false;
        }
    }

    return QObject::eventFilter(watched, event);
}

void MoveWidget::setWidget(QWidget *widget)
{
    if (this->widget==0) {
        this->widget=widget;
        this->widget->installEventFilter(this);
    }
}

void MoveWidget::setLeftButton(bool leftButton)
{
    this->leftButton=leftButton;
}

六、控件介紹

1. 超過150個精美控件，涵蓋了各種儀表盤、進度條、進度球、指南針、曲線圖、標尺、溫度計、導航條、導航欄，flatui、高亮按鈕、滑動選擇器、農歷等。遠超qwt集成的控件數量。
2. 每個類都可以獨立成一個單獨的控件，零耦合，每個控件一個頭文件和一個實現文件，不依賴其他文件，方便單個控件以源碼形式集成到項目中，較少代碼量。qwt的控件類環環相扣，高度耦合，想要使用其中一個控件，必須包含所有的代碼。
3. 全部純Qt編寫，QWidget+QPainter繪制，支持Qt4.6到Qt5.13的任何Qt版本，支持mingw、msvc、gcc等編譯器，支持任意操作系統比如windows+linux+mac+嵌入式linux等，不亂碼，可直接集成到Qt Creator中，和自帶的控件一樣使用，大部分效果只要設置幾個屬性即可，極為方便。
4. 每個控件都有一個對應的單獨的包含該控件源碼的DEMO，方便參考使用。同時還提供一個所有控件使用的集成的DEMO。
5. 每個控件的源代碼都有詳細中文注釋，都按照統一設計規范編寫，方便學習自定義控件的編寫。
6. 每個控件默認配色和demo對應的配色都非常精美。
7. 超過130個可見控件，6個不可見控件。
8. 部分控件提供多種樣式風格選擇，多種指示器樣式選擇。
9. 所有控件自適應窗體拉伸變化。
10. 集成自定義控件屬性設計器，支持拖曳設計，所見即所得，支持導入導出xml格式。
11. 自帶activex控件demo，所有控件可以直接運行在ie瀏覽器中。
12. 集成fontawesome圖形字體+阿里巴巴iconfont收藏的幾百個圖形字體，享受圖形字體帶來的樂趣。
13. 所有控件最后生成一個動態庫文件(dll或者so等)，可以直接集成到qtcreator中拖曳設計使用。
14. 目前已經有qml版本，后期會考慮出pyqt版本，如果用戶需求量很大的話。
15. 自定義控件插件開放動態庫使用（永久免費），無任何后門和限制，請放心使用。
16. 目前已提供26個版本的dll，其中包括了qt5.12.3 msvc2017 32+64 mingw 32+64 的。
17. 不定期增加控件和完善控件，不定期更新SDK，歡迎各位提出建議，謝謝！
18. Qt入門書籍推薦霍亞飛的《Qt Creator快速入門》《Qt5編程入門》，Qt進階書籍推薦官方的《C++ GUI Qt4編程》。
19. 強烈推薦程序員自我修養和規劃系列書《大話程序員》《程序員的成長課》《解憂程序員》，受益匪淺，受益終生！
20. SDK地址：https://gitee.com/feiyangqingyun/QUCSDK

原文鏈接：https://www.cnblogs.com/feiyangqingyun/p/11608377.html

【領QT開發教程學習資料，點擊下方鏈接莬費領取↓↓，先碼住不迷路~】

點擊這里：Qt資料領取（視頻教程+文檔+代碼+項目實戰）

# 一、前言

百度在線地圖的應用老早就做過，后面經過不斷的完善才到今天的這個程序，除了基本的可以載入地圖并設置一些相關的屬性以外，還增加了各種js函數直接異步加載數據比如動態添加點、矩形、圓形、行政區劃等各種。當然最大的是增加了離線地圖的支持，當年這個離線地圖拖了很久很久才去做，最終還是搞定了。

在線地圖沒有太多的難點，搞一個簡單的在線地圖demo絕對是分分鐘幾行代碼的事情，在使用過程中就是改進了幾個小的地方，比如地圖的邊距，需要設置增加一行css為 html,body{height:100%;width:100%;margin:0px;padding:0px;}，比如左下角有個百度的logo，要去除的話也是增加一行css為 .anchorBL{display:none;}，不然發布出去別人看到了怎么還有百度的logo怪沒有面子的。再比如滾動條的樣式，很多人說我明明設置了Qt的滾動條樣式啊，為什么這里邊的滾動條沒有效果呢？其實這里面的滾動條是網頁的，并不受控制的，你需要設置網頁的滾動條css如下。

::-webkit-scrollbar{width:0.8em;}
::-webkit-scrollbar-track{background:rgb(241,241,241);}
::-webkit-scrollbar-thumb{background:rgb(188,188,188);}

## 二、功能特點

1. 同時支持在線地圖和離線地圖兩種模式。

2. 同時支持webkit內核、webengine內核、IE內核。

3. 支持設置多個標注點，信息包括名稱、地址、經緯度。

4. 可設置地圖是否可單擊、拖動、鼠標滾輪縮放。

5. 可設置協議版本、秘鑰、主題樣式、中心坐標、中心城市、地理編碼位置等。

6. 可設置地圖縮放比例和級別，縮略圖、比例尺、路況信息等控件的可見。

7. 支持地圖交互，比如鼠標按下獲取對應位置的經緯度。

8. 支持查詢路線，可設置起點位置、終點位置、路線模式、路線方式、路線方案（最少時間、最少換乘、最少步行、不乘地鐵、最短距離、避開高速）。

9. 可顯示點線面工具，可直接在地圖上劃線、點、矩形、圓形等。

10. 可設置行政區劃，指定某個城市區域繪制圖層，在線地圖自動輸出行政區劃邊界點集合到js文件給離線地圖使用。

11. 可靜態或者動態添加多個覆蓋物。支持點、折線、多邊形、矩形、圓形、弧線、點聚合等。

12. 函數接口友好和統一，使用簡單方便，就一個類。

13. 支持js動態交互添加點、刪除點、清空點、重置點，不需要刷新頁面。

14. 支持任意Qt版本、任意系統、任意編譯器。

## 三、體驗地址

國內站點：[https://gitee.com/feiyangqingyun](https://gitee.com/feiyangqingyun)

國際站點：[https://github.com/feiyangqingyun](https://github.com/feiyangqingyun)

## 四、效果圖

## 五、相關代碼