传统使用中的radioButton单选按钮比较简洁,没有太多样式的变化,今天和大家分享一个开关按钮自定义RadioButton,可以在程序中用RadioButton进行开关、启/禁用,不仅样式更美观动态效果也很现代化使程序更加美观。平时我们用的很多软件里面也都有开关按钮使用,比如手机设置中的流量开关、飞行模式开关等。
本文重新自绘了 开关按钮、启/禁用 按钮 大大提高了程序界面开发的可观和视觉效果!
本文作者原创,未经允许禁止转载。
QT 自绘开关按钮 RadioButton QT自定义控件目录
版本 QT5 、编译器 MSVC 2017 、 目前版本V1.0
1 mainwindow.cpp
/******************************************************************************
* Copyright CSDN 双子座断点 Co., Ltd.
* Copyright www.dreambeging.vip Co., Ltd.
* All right reserved. See COPYRIGHT for detailed Information.
*
* @file mainwindow.cpp
* @version V 1.0
*
* @author 断点<dream.2017@qq.com>
* @date 2022/11/22
* @history
*****************************************************************************/
#include "mainwindow.h"
#include "ui_mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
, ui(new Ui::MainWindow)
{
ui->setupUi(this);
setWindowTitle("自绘开关按钮 V1.0 双子座断点 QQ群:1037037294 blog:https://blog.csdn.net/qq_37529913?type=lately/");
ui->switchBtn4->setTextOn("");
ui->switchBtn4->setTextOff("");
ui->switchBtn5->setTextOn("开启");
ui->switchBtn5->setTextOff("关闭");
color.setRgb(148,232,31);
ui->switchBtn2->setSliderColorOn(color);
color.setRgb(111, 122, 126);
ui->switchBtn2->setSliderColorOff(color);
color.setRgb(148,232,31);
ui->switchBtn3->setBgColorOn(color);
color.setRgb(229,97,97);
ui->switchBtn3->setBgColorOff(color);
color.setRgb(38,231,70);
ui->switchBtn6->setBgColorOn(color);
color.setRgb(0,0,0);
ui->switchBtn6->setBgColorOff(color);
}
MainWindow::~MainWindow()
{
delete ui;
}
2 mainwindow.h
/******************************************************************************
* Copyright CSDN 双子座断点 Co., Ltd.
* Copyright www.dreambeging.vip Co., Ltd.
* All right reserved. See COPYRIGHT for detailed Information.
*
* @file mainwindow.cpp
* @version V 1.0
*
* @author 断点<dream.2017@qq.com>
* @date 2022/11/22
* @history
*****************************************************************************/
#include "mainwindow.h"
#include "ui_mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
, ui(new Ui::MainWindow)
{
ui->setupUi(this);
setWindowTitle("自绘开关按钮 V1.0 双子座断点 QQ群:1037037294 blog:https://blog.csdn.net/qq_37529913?type=lately/");
ui->switchBtn4->setTextOn("");
ui->switchBtn4->setTextOff("");
ui->switchBtn5->setTextOn("开启");
ui->switchBtn5->setTextOff("关闭");
color.setRgb(148,232,31);
ui->switchBtn2->setSliderColorOn(color);
color.setRgb(111, 122, 126);
ui->switchBtn2->setSliderColorOff(color);
color.setRgb(148,232,31);
ui->switchBtn3->setBgColorOn(color);
color.setRgb(229,97,97);
ui->switchBtn3->setBgColorOff(color);
color.setRgb(38,231,70);
ui->switchBtn6->setBgColorOn(color);
color.setRgb(0,0,0);
ui->switchBtn6->setBgColorOff(color);
}
MainWindow::~MainWindow()
{
delete ui;
}
3 ui
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow</class>
<widget class="QMainWindow" name="MainWindow">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>350</height>
</rect>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
<widget class="QWidget" name="centralwidget">
<widget class="radioswitch" name="switchBtn" native="true">
<property name="geometry">
<rect>
<x>80</x>
<y>80</y>
<width>100</width>
<height>40</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>100</width>
<height>40</height>
</size>
</property>
</widget>
<widget class="radioswitch" name="switchBtn3" native="true">
<property name="geometry">
<rect>
<x>210</x>
<y>80</y>
<width>100</width>
<height>40</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>100</width>
<height>40</height>
</size>
</property>
</widget>
<widget class="radioswitch" name="switchBtn2" native="true">
<property name="geometry">
<rect>
<x>210</x>
<y>140</y>
<width>100</width>
<height>40</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>100</width>
<height>40</height>
</size>
</property>
</widget>
<widget class="radioswitch" name="switchBtn4" native="true">
<property name="geometry">
<rect>
<x>80</x>
<y>200</y>
<width>100</width>
<height>40</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>100</width>
<height>40</height>
</size>
</property>
</widget>
<widget class="radioswitch" name="switchBtn5" native="true">
<property name="geometry">
<rect>
<x>80</x>
<y>140</y>
<width>100</width>
<height>40</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>100</width>
<height>40</height>
</size>
</property>
</widget>
<widget class="radioswitch" name="switchBtn6" native="true">
<property name="geometry">
<rect>
<x>210</x>
<y>200</y>
<width>100</width>
<height>40</height>
</rect>
</property>
<property name="minimumSize">
<size>
<width>100</width>
<height>40</height>
</size>
</property>
</widget>
</widget>
<widget class="QMenuBar" name="menubar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>22</height>
</rect>
</property>
</widget>
<widget class="QStatusBar" name="statusbar"/>
</widget>
<customwidgets>
<customwidget>
<class>radioswitch</class>
<extends>QWidget</extends>
<header location="global">radioswitch.h</header>
<container>1</container>
</customwidget>
</customwidgets>
<resources/>
<connections/>
</ui>
4 完整版本代码
完整代码下载连接: 双子座断点 / QT 开关按钮 · GitCode