diff --git a/ui/button_parallelogram/bk.png b/ui/button_parallelogram/bk.png
new file mode 100644
index 00000000..aa3d6f3f
Binary files /dev/null and b/ui/button_parallelogram/bk.png differ
diff --git a/ui/button_parallelogram/button_parallelogram.pro b/ui/button_parallelogram/button_parallelogram.pro
new file mode 100644
index 00000000..37aaabe9
--- /dev/null
+++ b/ui/button_parallelogram/button_parallelogram.pro
@@ -0,0 +1,43 @@
+#-------------------------------------------------
+#
+# Project created by QtCreator 2024-07-18T14:25:58
+#
+#-------------------------------------------------
+
+QT += core gui
+
+greaterThan(QT_MAJOR_VERSION, 4): QT += widgets
+
+TARGET = button_parallelogram
+TEMPLATE = app
+
+# The following define makes your compiler emit warnings if you use
+# any feature of Qt which has been marked as deprecated (the exact warnings
+# depend on your compiler). Please consult the documentation of the
+# deprecated API in order to know how to port your code away from it.
+DEFINES += QT_DEPRECATED_WARNINGS
+
+# You can also make your code fail to compile if you use deprecated APIs.
+# In order to do so, uncomment the following line.
+# You can also select to disable deprecated APIs only up to a certain version of Qt.
+#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0
+
+CONFIG += c++11
+
+SOURCES += \
+ main.cpp \
+ widget.cpp
+
+HEADERS += \
+ widget.h
+
+FORMS += \
+ widget.ui
+
+# Default rules for deployment.
+qnx: target.path = /tmp/$${TARGET}/bin
+else: unix:!android: target.path = /opt/$${TARGET}/bin
+!isEmpty(target.path): INSTALLS += target
+
+RESOURCES += \
+ image.qrc
diff --git a/ui/button_parallelogram/button_parallelogram.pro.user b/ui/button_parallelogram/button_parallelogram.pro.user
new file mode 100644
index 00000000..2654064b
--- /dev/null
+++ b/ui/button_parallelogram/button_parallelogram.pro.user
@@ -0,0 +1,323 @@
+
+
+
+
+
+ EnvironmentId
+ {b4287fa0-916a-42ac-8d9f-001e755b9a50}
+
+
+ ProjectExplorer.Project.ActiveTarget
+ 0
+
+
+ ProjectExplorer.Project.EditorSettings
+
+ true
+ false
+ true
+
+ Cpp
+
+ CppGlobal
+
+
+
+ QmlJS
+
+ QmlJSGlobal
+
+
+ 2
+ UTF-8
+ false
+ 4
+ false
+ 80
+ true
+ true
+ 1
+ true
+ false
+ 0
+ true
+ true
+ 0
+ 8
+ true
+ 2
+ true
+ true
+ true
+ false
+
+
+
+ ProjectExplorer.Project.PluginSettings
+
+
+
+ ProjectExplorer.Project.Target.0
+
+ Desktop Qt 5.9.8 MinGW 32bit
+ Desktop Qt 5.9.8 MinGW 32bit
+ qt.qt5.598.win32_mingw53_kit
+ 0
+ 0
+ 0
+
+ D:/WorkSpace/learn/button_parallelogram
+
+
+ true
+ qmake
+
+ QtProjectManager.QMakeBuildStep
+ true
+
+ false
+ false
+ false
+
+
+ true
+ Make
+
+ Qt4ProjectManager.MakeStep
+
+ false
+
+
+ false
+
+ 2
+ Build
+
+ ProjectExplorer.BuildSteps.Build
+
+
+
+ true
+ Make
+
+ Qt4ProjectManager.MakeStep
+
+ true
+ clean
+
+ false
+
+ 1
+ Clean
+
+ ProjectExplorer.BuildSteps.Clean
+
+ 2
+ false
+
+ Debug
+ Debug
+ Qt4ProjectManager.Qt4BuildConfiguration
+ 2
+ true
+
+
+ D:/WorkSpace/learn/build-button_parallelogram-Desktop_Qt_5_9_8_MinGW_32bit-Release
+
+
+ true
+ qmake
+
+ QtProjectManager.QMakeBuildStep
+ false
+
+ false
+ false
+ false
+
+
+ true
+ Make
+
+ Qt4ProjectManager.MakeStep
+
+ false
+
+
+ false
+
+ 2
+ Build
+
+ ProjectExplorer.BuildSteps.Build
+
+
+
+ true
+ Make
+
+ Qt4ProjectManager.MakeStep
+
+ true
+ clean
+
+ false
+
+ 1
+ Clean
+
+ ProjectExplorer.BuildSteps.Clean
+
+ 2
+ false
+
+ Release
+ Release
+ Qt4ProjectManager.Qt4BuildConfiguration
+ 0
+ true
+
+
+ D:/WorkSpace/learn/build-button_parallelogram-Desktop_Qt_5_9_8_MinGW_32bit-Profile
+
+
+ true
+ qmake
+
+ QtProjectManager.QMakeBuildStep
+ true
+
+ false
+ true
+ false
+
+
+ true
+ Make
+
+ Qt4ProjectManager.MakeStep
+
+ false
+
+
+ false
+
+ 2
+ Build
+
+ ProjectExplorer.BuildSteps.Build
+
+
+
+ true
+ Make
+
+ Qt4ProjectManager.MakeStep
+
+ true
+ clean
+
+ false
+
+ 1
+ Clean
+
+ ProjectExplorer.BuildSteps.Clean
+
+ 2
+ false
+
+ Profile
+ Profile
+ Qt4ProjectManager.Qt4BuildConfiguration
+ 0
+ true
+
+ 3
+
+
+ 0
+ 部署
+
+ ProjectExplorer.BuildSteps.Deploy
+
+ 1
+ Deploy Configuration
+
+ ProjectExplorer.DefaultDeployConfiguration
+
+ 1
+
+
+ false
+ false
+ 1000
+
+ true
+
+ false
+ false
+ false
+ false
+ true
+ 0.01
+ 10
+ true
+ 1
+ 25
+
+ 1
+ true
+ false
+ true
+ valgrind
+
+ 0
+ 1
+ 2
+ 3
+ 4
+ 5
+ 6
+ 7
+ 8
+ 9
+ 10
+ 11
+ 12
+ 13
+ 14
+
+ 2
+
+ button_parallelogram
+
+ Qt4ProjectManager.Qt4RunConfiguration:D:/WorkSpace/learn/button_parallelogram/button_parallelogram.pro
+ button_parallelogram.pro
+
+ 3768
+ false
+ true
+ true
+ false
+ false
+ true
+
+ D:/WorkSpace/learn/button_parallelogram
+
+ 1
+
+
+
+ ProjectExplorer.Project.TargetCount
+ 1
+
+
+ ProjectExplorer.Project.Updater.FileVersion
+ 20
+
+
+ Version
+ 20
+
+
diff --git a/ui/button_parallelogram/image.qrc b/ui/button_parallelogram/image.qrc
new file mode 100644
index 00000000..c372525b
--- /dev/null
+++ b/ui/button_parallelogram/image.qrc
@@ -0,0 +1,5 @@
+
+
+ bk.png
+
+
diff --git a/ui/button_parallelogram/main.cpp b/ui/button_parallelogram/main.cpp
new file mode 100644
index 00000000..90b6d53f
--- /dev/null
+++ b/ui/button_parallelogram/main.cpp
@@ -0,0 +1,11 @@
+#include "widget.h"
+#include
+
+int main(int argc, char *argv[])
+{
+ QApplication a(argc, argv);
+ Widget w;
+ w.show();
+
+ return a.exec();
+}
diff --git a/ui/button_parallelogram/ui_widget.h b/ui/button_parallelogram/ui_widget.h
new file mode 100644
index 00000000..bea0ee30
--- /dev/null
+++ b/ui/button_parallelogram/ui_widget.h
@@ -0,0 +1,75 @@
+/********************************************************************************
+** Form generated from reading UI file 'widget.ui'
+**
+** Created by: Qt User Interface Compiler version 5.9.8
+**
+** WARNING! All changes made in this file will be lost when recompiling UI file!
+********************************************************************************/
+
+#ifndef UI_WIDGET_H
+#define UI_WIDGET_H
+
+#include
+#include
+#include
+#include
+#include
+#include
+#include
+
+QT_BEGIN_NAMESPACE
+
+class Ui_Widget
+{
+public:
+ QPushButton *pushButton;
+ QPushButton *pushButton2;
+ QPushButton *pushButton3;
+
+ void setupUi(QWidget *Widget)
+ {
+ if (Widget->objectName().isEmpty())
+ Widget->setObjectName(QStringLiteral("Widget"));
+ Widget->resize(1015, 612);
+ pushButton = new QPushButton(Widget);
+ pushButton->setObjectName(QStringLiteral("pushButton"));
+ pushButton->setGeometry(QRect(70, 70, 200, 80));
+ QSizePolicy sizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
+ sizePolicy.setHorizontalStretch(0);
+ sizePolicy.setVerticalStretch(0);
+ sizePolicy.setHeightForWidth(pushButton->sizePolicy().hasHeightForWidth());
+ pushButton->setSizePolicy(sizePolicy);
+ pushButton->setStyleSheet(QStringLiteral("transform:skewX(-30deg);"));
+ pushButton2 = new QPushButton(Widget);
+ pushButton2->setObjectName(QStringLiteral("pushButton2"));
+ pushButton2->setGeometry(QRect(270, 70, 200, 80));
+ sizePolicy.setHeightForWidth(pushButton2->sizePolicy().hasHeightForWidth());
+ pushButton2->setSizePolicy(sizePolicy);
+ pushButton3 = new QPushButton(Widget);
+ pushButton3->setObjectName(QStringLiteral("pushButton3"));
+ pushButton3->setGeometry(QRect(470, 70, 200, 80));
+ sizePolicy.setHeightForWidth(pushButton3->sizePolicy().hasHeightForWidth());
+ pushButton3->setSizePolicy(sizePolicy);
+
+ retranslateUi(Widget);
+
+ QMetaObject::connectSlotsByName(Widget);
+ } // setupUi
+
+ void retranslateUi(QWidget *Widget)
+ {
+ Widget->setWindowTitle(QApplication::translate("Widget", "Widget", Q_NULLPTR));
+ pushButton->setText(QApplication::translate("Widget", "PushButton", Q_NULLPTR));
+ pushButton2->setText(QApplication::translate("Widget", "PushButton", Q_NULLPTR));
+ pushButton3->setText(QApplication::translate("Widget", "PushButton", Q_NULLPTR));
+ } // retranslateUi
+
+};
+
+namespace Ui {
+ class Widget: public Ui_Widget {};
+} // namespace Ui
+
+QT_END_NAMESPACE
+
+#endif // UI_WIDGET_H
diff --git a/ui/button_parallelogram/widget.cpp b/ui/button_parallelogram/widget.cpp
new file mode 100644
index 00000000..36239d36
--- /dev/null
+++ b/ui/button_parallelogram/widget.cpp
@@ -0,0 +1,46 @@
+#include "widget.h"
+#include "ui_widget.h"
+#include
+#include
+#include
+
+Widget::Widget(QWidget *parent) :
+ QWidget(parent),
+ ui(new Ui::Widget)
+{
+ ui->setupUi(this);
+}
+
+Widget::~Widget()
+{
+ delete ui;
+}
+
+void Widget::showEvent(QShowEvent *event)
+{
+ ui->pushButton->setStyleSheet("background-color: red;");
+ ui->pushButton2->setStyleSheet("background-color: green;");
+ ui->pushButton3->setStyleSheet("background-color: blue;");
+
+ ui->pushButton->setText("button1");
+ ui->pushButton2->setText("button2");
+ ui->pushButton3->setText("button3");
+
+ QPixmap maskUp(":/bk.png");
+ // 获取按钮的大小
+ QRect buttonSize = ui->pushButton->geometry();
+
+ // 计算倾斜角度来获取偏移量
+ int buttonHeight = buttonSize.height();
+ double angleInRadians = qDegreesToRadians(8.0); // 假设倾斜角度为8度
+ int horizontalOffset = buttonHeight * qTan(angleInRadians);
+
+ // 将图片缩放到按钮大小
+ QPixmap scaledMask = maskUp.scaledToWidth(buttonSize.width());
+ ui->pushButton->setMask(scaledMask.mask());
+ ui->pushButton2->setMask(scaledMask.mask());
+ ui->pushButton3->setMask(scaledMask.mask());
+ // 主动布局，不使用固有布局
+ ui->pushButton2->move( ui->pushButton->pos().x() + buttonSize.width() - horizontalOffset,ui->pushButton->pos().y());
+ ui->pushButton3->move( ui->pushButton2->pos().x() + buttonSize.width() - horizontalOffset,ui->pushButton2->pos().y());
+}
diff --git a/ui/button_parallelogram/widget.h b/ui/button_parallelogram/widget.h
new file mode 100644
index 00000000..06acd30c
--- /dev/null
+++ b/ui/button_parallelogram/widget.h
@@ -0,0 +1,24 @@
+#ifndef WIDGET_H
+#define WIDGET_H
+
+#include
+
+namespace Ui {
+class Widget;
+}
+
+class Widget : public QWidget
+{
+ Q_OBJECT
+
+public:
+ explicit Widget(QWidget *parent = nullptr);
+ ~Widget();
+protected:
+ void showEvent(QShowEvent *event) override; // 声明 showEvent 函数
+
+private:
+ Ui::Widget *ui;
+};
+
+#endif // WIDGET_H
diff --git a/ui/button_parallelogram/widget.ui b/ui/button_parallelogram/widget.ui
new file mode 100644
index 00000000..25addb7c
--- /dev/null
+++ b/ui/button_parallelogram/widget.ui
@@ -0,0 +1,80 @@
+
+
+ Widget
+
+
+
+ 0
+ 0
+ 1015
+ 612
+
+
+
+ Widget
+
+
+
+
+ 70
+ 70
+ 200
+ 80
+
+
+
+
+ 0
+ 0
+
+
+
+ transform:skewX(-30deg);
+
+
+ PushButton
+
+
+
+
+
+ 270
+ 70
+ 200
+ 80
+
+
+
+
+ 0
+ 0
+
+
+
+ PushButton
+
+
+
+
+
+ 470
+ 70
+ 200
+ 80
+
+
+
+
+ 0
+ 0
+
+
+
+ PushButton
+
+
+
+
+
+
+