简介:这是一套面向C++开发者与Qt初学者的PC端通用界面框架资源,解决桌面软件开发中UI统一性差、样式定制难、基础交互功能重复造轮子等痛点。框架基于Qt实现,内置标题栏、导航栏、主界面与状态栏四大模块,支持窗口拖动/缩放(含锁定开关)、动态效果菜单、多皮肤切换(含自定义扩展)、导航栏九宫格式位置调整(空格键快捷切换)等实用功能,开箱即用且便于二次开发。压缩包共2170个文件,以1947张PNG图标资源、48个头文件(h)、44个源码文件(cpp)及7个QSS样式表为核心,辅以SVG矢量图、WAV音效、VCXPROJ工程配置等,总大小23.17MB,结构完整、模块解耦清晰。目前已有7819人学习下载,提供全部源码与详细注释,是深入理解Qt事件机制、样式系统与界面架构设计的优质实践范例。
1. 为什么一个“能直接编译运行”的QT界面框架,比手写十个QWidget还难找?
你是不是也经历过:导师一句“用QT做个PC端界面”,你兴冲冲下载了Qt Creator,新建项目,拖了几个按钮、加了几个Label,结果运行出来——灰扑扑的Windows 98风,边框像没对齐的打印稿,按钮点击没反馈,字体发虚,高分屏上文字糊成一片?更崩溃的是,换台电脑、换个系统版本,样式又崩了。不是代码报错,是“看起来就不专业”,答辩时老师扫一眼就皱眉:“这不像工程化交付物,像课设草稿。”
这不是你技术不行,是缺一套开箱即用、跨平台稳定、视觉可维护、结构可扩展的QT界面基础框架。它不解决算法逻辑,但决定用户(尤其是老师/评审)对你整个项目的第一印象可信度。这份《QT软件界面框架及精美样式(PC端)》不是一堆零散qss文件或截图,而是一个完整可编译的C++工程:包含主窗口骨架、多级导航容器、统一主题管理器、响应式布局基类、高分屏适配钩子、以及6套实测可用的工业级UI样式(含深色模式切换)。它面向的是需要交毕设、课设、或快速交付内部工具的开发者——你要的不是“学会QT”,而是“今天下午三点前,让界面看起来像样”。
2. 总体架构设计:三层结构与四个核心模块的职责划分
这套框架不是把所有代码塞进main.cpp,而是用清晰的分层隔离关注点。我把它拆成表现层(UI)、控制层(Controller)、数据层(Model)+ 全局服务层(Service)四个模块,全部基于Qt标准机制实现,不依赖第三方UI库,确保纯C++可维护性。
2.1 表现层:基于QMainWindow的可插拔视图体系
主窗口继承自QMainWindow,但关键改造在CentralWidget的封装。我们不直接setCentralWidget,而是通过ViewManager统一调度:
// view_manager.h class ViewManager : public QObject { Q_OBJECT public: explicit ViewManager(QMainWindow* parent); void switchToView(const QString& viewName); // 如 "dashboard", "settings" QWidget* currentView() const; private: QMap<QString, QWidget*> m_views; // 视图缓存,避免重复创建 QStackedWidget* m_stackedWidget; // 真正的中央容器 };提示:
QStackedWidget是核心。它比QTabWidget更灵活(无标签栏干扰),比手动show/hide更安全(自动管理z-order和事件分发)。所有业务视图(DashboardView、ConfigView等)都继承自BaseView,强制实现onEnter()和onLeave()生命周期钩子,用于资源预加载/释放。
2.2 控制层:信号驱动的状态机与命令总线
避免在UI类里写大量业务逻辑。我们定义CommandBus作为中央消息总线:
// command_bus.h class CommandBus : public QObject { Q_OBJECT public: static CommandBus* instance(); template<typename T> void publish(const T& cmd) { emit commandReceived(QVariant::fromValue(cmd)); } signals: void commandReceived(const QVariant& cmd); private: CommandBus(); // 单例 }; // usage in button click handler void DashboardView::onExportBtnClicked() { ExportDataCommand cmd; cmd.filePath = m_savePath; CommandBus::instance()->publish(cmd); // 发布命令,不关心谁处理 }设计说明:
QVariant::fromValue<T>()要求T有QMetaType注册(框架已内置qRegisterMetaType<ExportDataCommand>())。接收方(如DataExporter服务)用connect()监听commandReceived信号,解包执行。这种松耦合让测试变得简单——你可以mockCommandBus验证UI是否发出正确命令,而不必启动整个GUI。
2.3 数据层:轻量级Model与配置中心
不引入复杂ORM,用QSettings+ 自定义ConfigModel管理持久化:
// config_model.h class ConfigModel : public QObject { Q_OBJECT Q_PROPERTY(QString theme READ theme WRITE setTheme NOTIFY themeChanged) Q_PROPERTY(bool autoSave READ autoSave WRITE setAutoSave NOTIFY autoSaveChanged) public: static ConfigModel* instance(); QString theme() const { return m_settings.value("ui/theme", "light").toString(); } void setTheme(const QString& t) { m_settings.setValue("ui/theme", t); emit themeChanged(); // 主动通知样式管理器刷新 StyleManager::instance()->applyTheme(t); } private: QSettings m_settings; // 默认保存到QApplication::applicationName() };参数说明:
QSettings自动选择平台原生存储(Windows注册表、macOS plist、Linux ini),无需手动处理路径。Q_PROPERTY支持QML绑定(为未来可能的混合开发留接口),NOTIFY信号驱动UI响应式更新。
2.4 全局服务层:StyleManager与DpiScaleHelper
这是框架“精美”的技术底座。StyleManager不只加载qss,它做三件事:
- 解析qss中的变量(如
@primary-color),支持主题色动态替换; - 监听系统DPI变化,触发
QApplication::setAttribute(Qt::AA_EnableHighDpiScaling)重置; - 提供
applyTheme("dark")接口,内部调用qApp->setStyleSheet(...)并广播themeChanged信号。
DpiScaleHelper则解决高分屏字体模糊问题:
// dpi_scale_helper.cpp void DpiScaleHelper::setupDpiScaling() { // 强制启用高DPI缩放(Qt5.14+) qputenv("QT_SCALE_FACTOR", "1"); // 禁用全局缩放,改用逻辑DPI QApplication::setAttribute(Qt::AA_EnableHighDpiScaling); QApplication::setAttribute(Qt::AA_UseHighDpiPixmaps); // 为每个屏幕设置独立缩放因子 for (QScreen* screen : QGuiApplication::screens()) { connect(screen, &QScreen::logicalDotsPerInchChanged, [=](qreal dpi) { qreal scale = dpi / 96.0; // 基准DPI=96 // 将scale应用到字体、间距等 StyleManager::instance()->setDpiScale(scale); }); } }关键点:
qputenv("QT_SCALE_FACTOR", "1")是血泪经验。很多教程只设AA_EnableHighDpiScaling,但在某些Windows显卡驱动下仍模糊。强制清空环境变量,让Qt完全接管DPI计算,效果立竿见影。
3. 样式系统实现:6套工业级主题与动态切换机制
“精美样式”不是指花哨动画,而是一致性、可读性、操作反馈、无障碍支持。框架提供6套主题,全部基于同一套qss变量体系,确保切换时无视觉跳变。
3.1 主题变量体系:从CSS变量到QSS宏
所有qss文件(themes/light.qss,themes/dark.qss等)不写死颜色值,而是引用宏:
/* themes/_variables.qss */ @primary-color: #2563eb; @primary-hover: #1d4ed8; @background-main: #f9fafb; @text-primary: #1f2937; @border-radius: 8px; @spacing-sm: 4px; @spacing-md: 8px; @spacing-lg: 16px;编译时,StyleManager用正则替换这些宏为实际值,并注入到最终qss中。这样,修改_variables.qss就能一键更新所有主题。
3.2 深色模式实现:不只是反转颜色
深色模式常犯的错误是简单invert(),导致对比度不足、眼睛疲劳。本框架采用WCAG 2.1标准:
- 文本与背景对比度 ≥ 4.5:1(正文)或 ≥ 3:1(大号文本);
- 交互元素(按钮、输入框)提供明确焦点状态(
outline: 2px solid @primary-color); - 使用
QPalette同步设置非qss控件(如QMenuBar、QStatusBar)的颜色。
// style_manager.cpp void StyleManager::applyDarkTheme() { QPalette darkPalette; darkPalette.setColor(QPalette::Window, QColor(30, 30, 30)); darkPalette.setColor(QPalette::WindowText, QColor(220, 220, 220)); darkPalette.setColor(QPalette::Base, QColor(40, 40, 40)); darkPalette.setColor(QPalette::AlternateBase, QColor(60, 60, 60)); darkPalette.setColor(QPalette::ToolTipBase, QColor(220, 220, 220)); darkPalette.setColor(QPalette::ToolTipText, QColor(30, 30, 30)); darkPalette.setColor(QPalette::Text, QColor(220, 220, 220)); darkPalette.setColor(QPalette::Button, QColor(60, 60, 60)); darkPalette.setColor(QPalette::ButtonText, QColor(220, 220, 220)); darkPalette.setColor(QPalette::BrightText, Qt::red); darkPalette.setColor(QPalette::Link, QColor(42, 130, 218)); darkPalette.setColor(QPalette::Highlight, QColor(42, 130, 218)); darkPalette.setColor(QPalette::HighlightedText, QColor(0, 0, 0)); qApp->setPalette(darkPalette); }注意:
QPalette必须在qApp->setStyleSheet()之后调用,否则会被qss覆盖。框架中StyleManager::applyTheme()严格按此顺序执行。
3.3 动态切换与平滑过渡
切换主题时,直接setStyleSheet会导致界面闪烁。我们采用两步法:
- 预加载:新主题qss解析后,先用
QTimer::singleShot(0, ...)延迟应用,让事件循环处理完当前帧; - 渐变过渡:对
QMainWindow背景使用QPropertyAnimation淡出淡入(仅影响背景,不影响控件)。
// style_manager.cpp void StyleManager::switchTheme(const QString& themeName) { // 1. 预加载新样式字符串 QString newQss = loadAndProcessQss(themeName); // 2. 动画淡出当前背景 QPropertyAnimation* fadeOut = new QPropertyAnimation(m_mainWindow, "windowOpacity"); fadeOut->setDuration(150); fadeOut->setStartValue(1.0); fadeOut->setEndValue(0.0); fadeOut->start(QAbstractAnimation::DeleteWhenStopped); // 3. 动画结束后应用新样式并淡入 connect(fadeOut, &QPropertyAnimation::finished, [=]() { qApp->setStyleSheet(newQss); applyPaletteForTheme(themeName); // 同步QPalette QPropertyAnimation* fadeIn = new QPropertyAnimation(m_mainWindow, "windowOpacity"); fadeIn->setDuration(150); fadeIn->setStartValue(0.0); fadeIn->setEndValue(1.0); fadeIn->start(QAbstractAnimation::DeleteWhenStopped); }); }玄学细节:
windowOpacity动画比QGraphicsOpacityEffect更轻量,且不会影响子控件事件。150ms是经过实测的临界值——短于100ms人眼感知为闪,长于200ms显得拖沓。
3.4 工业级主题清单与适用场景
| 主题名称 | 色彩特征 | 适用场景 | 特殊优化 |
|---|---|---|---|
light | 白底+蓝主色 | 通用办公软件、数据录入系统 | 高对比度文本,减少视觉疲劳 |
dark | 深灰底+青蓝主色 | 开发工具、监控面板、夜间使用 | 降低蓝光输出,符合护眼标准 |
industrial | 灰黑+橙红警示色 | 工控HMI、设备控制界面 | 大按钮、高亮报警区域、强触觉反馈 |
medical | 浅蓝+白+绿 | 医疗信息终端、预约系统 | 符合医疗UI规范,禁用红色误操作 |
education | 明黄+天蓝+圆角 | 教育软件、儿童应用 | 字体放大20%,图标简化,禁用复杂动画 |
minimal | 极简黑白+微阴影 | 展示型应用、Kiosk模式 | 隐藏所有装饰性元素,最大化内容区 |
避坑 / 常见问题 / 排查 / 注意
现象1:切换主题后,QComboBox下拉菜单仍是旧主题色
原因:QComboBox的弹出菜单(QFrame)是独立窗口,未继承主窗口palette。
解决:在StyleManager::applyTheme()中,额外调用qApp->setStyle(QStyleFactory::create("Fusion")),并为QComboBox单独设置QPalette:QComboBox* combo = new QComboBox(); combo->setPalette(darkPalette); // 必须显式设置现象2:高分屏下QPushButton文字模糊,但QLabel清晰
原因:QPushButton默认使用QPainter绘制文字,未启用抗锯齿;QLabel使用QTextDocument渲染。
解决:在qss中强制开启:QPushButton { font-smooth: always; -qt-font-smooth: true; }现象3:
QTableWidget行高在不同主题下不一致
原因:qss中line-height不被Qt识别,需用QHeaderView::section控制。
解决:在BaseView构造函数中统一设置:tableWidget->verticalHeader()->setDefaultSectionSize(32); // 统一行高 tableWidget->horizontalHeader()->setSectionResizeMode(QHeaderView::Stretch);现象4:
QFileDialog弹出窗口不跟随主题
原因:原生系统对话框(Windows/macOS)无法被qss控制。
解决:强制使用Qt风格对话框:QFileDialog::Options options; options |= QFileDialog::DontUseNativeDialog; // 关键! QString fileName = QFileDialog::getOpenFileName(this, "Open", "", "All Files (*)", nullptr, options);现象5:
QProgressBar在深色主题下进度条不可见
原因:qss中QProgressBar::chunk背景色与QProgressBar背景色相同。
解决:在深色主题qss中显式定义:QProgressBar::chunk { background-color: @primary-color; width: 1px; /* 防止块状感 */ }
4. 工程化构建与跨平台兼容性保障
能跑不等于能交付。毕业答辩或客户验收时,最怕“在我机器上好好的”。这套框架从构建开始就锁定兼容性。
4.1 CMakeLists.txt标准化配置
摒弃Qt Creator自动生成的杂乱脚本,采用模块化CMake:
# CMakeLists.txt cmake_minimum_required(VERSION 3.16) project(QT_UI_Framework VERSION 1.0 LANGUAGES CXX) set(CMAKE_CXX_STANDARD 17) set(CMAKE_CXX_STANDARD_REQUIRED ON) # 查找Qt组件(严格指定版本) find_package(Qt5 5.15 REQUIRED COMPONENTS Core Widgets Gui Svg) # 添加可执行文件 add_executable(${PROJECT_NAME} main.cpp main_window.cpp view_manager.cpp style_manager.cpp # ... 其他源文件 ) # 链接Qt库 target_link_libraries(${PROJECT_NAME} PRIVATE Qt5::Core Qt5::Widgets Qt5::Gui Qt5::Svg ) # 编译选项(关键!) target_compile_options(${PROJECT_NAME} PRIVATE $<$<CXX_COMPILER_ID:GNU>:-Wall -Wextra -Wpedantic> $<$<CXX_COMPILER_ID:Clang>:-Wall -Wextra -Wpedantic> $<$<CXX_COMPILER_ID:MSVC>:/W4> ) # 资源文件嵌入(qrc) set(UI_RESOURCES resources.qrc ) qt5_add_resources(RESOURCE_FILES ${UI_RESOURCES}) target_sources(${PROJECT_NAME} PRIVATE ${RESOURCE_FILES}) # 安装规则(为打包准备) install(TARGETS ${PROJECT_NAME} DESTINATION bin) install(DIRECTORY themes/ DESTINATION share/${PROJECT_NAME}/themes)设计说明:
find_package(Qt5 5.15 REQUIRED)强制最低版本,避免学生用Qt6编译后在老师Qt5.12环境崩溃。qt5_add_resources确保qss、图片等资源编译进二进制,无需外部文件依赖。
4.2 Windows平台特殊处理:Manifest与DPI声明
Windows 10/11对高DPI支持依赖app.manifest。框架自带qt_ui_framework.exe.manifest:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?> <assembly xmlns="urn:schemas-microsoft-com:asm.v1" manifestVersion="1.0"> <application xmlns="urn:schemas-microsoft-com:asm.v3"> <windowsSettings> <dpiAwareness xmlns="http://schemas.microsoft.com/SMI/2016/WindowsSettings">PerMonitorV2</dpiAwareness> <dpiAware xmlns="http://schemas.microsoft.com/SMI/2005/WindowsSettings">true</dpiAware> </windowsSettings> </application> </assembly>参数说明:
PerMonitorV2是Windows 10 1703+支持的最高级DPI感知模式,允许应用在不同DPI屏幕间无缝切换。编译时需用windeployqt工具自动注入manifest(框架文档已写明命令)。
4.3 macOS平台适配:Dock图标与菜单栏
macOS用户期望原生体验。框架在main.cpp中初始化时添加:
#include <QApplication> #ifdef Q_OS_MACOS #include <QMenuBar> #include <QAction> #endif int main(int argc, char *argv[]) { QApplication app(argc, argv); #ifdef Q_OS_MACOS // 设置Dock图标 app.setWindowIcon(QIcon(":/icons/app_icon.icns")); // 必须是icns格式 // 创建原生菜单栏 QMenuBar* menuBar = app.menuBar(); QMenu* appMenu = menuBar->addMenu("QT_UI_Framework"); QAction* aboutAction = appMenu->addAction("About"); connect(aboutAction, &QAction::triggered, [](){ QMessageBox::about(nullptr, "About", "QT UI Framework v1.0"); }); // 隐藏Qt默认菜单(如“编辑”、“帮助”) app.setAttribute(Qt::AA_DontShowIconsInMenus, false); #endif MainWindow w; w.show(); return app.exec(); }注意:
QMenuBar必须在QApplication创建后、任何窗口显示前创建,否则macOS会忽略。icns图标需用iconutil工具从png生成,框架已提供build_macos_icons.sh脚本。
4.4 Linux平台:字体渲染与GTK主题兼容
Linux发行版繁多,框架采用保守策略:
- 字体:强制使用
Noto Sans(Google开源字体,覆盖中日韩),避免系统缺失字体导致乱码; - 主题:禁用GTK样式集成(
export QT_QPA_PLATFORMTHEME=""),防止Ubuntu/GNOME主题污染qss; - 打包:提供
AppImage构建脚本,将Qt库、资源、二进制打包为单文件,解决依赖问题。
# build_appimage.sh (框架内提供) #!/bin/bash APP_DIR="AppDir" rm -rf $APP_DIR mkdir -p $APP_DIR/usr/bin mkdir -p $APP_DIR/usr/lib mkdir -p $APP_DIR/usr/share/icons/hicolor/256x256/apps # 复制二进制和依赖库 cp qt_ui_framework $APP_DIR/usr/bin/ linuxdeployqt $APP_DIR/usr/bin/qt_ui_framework -appimage # 生成AppImage ./linuxdeployqt $APP_DIR/AppRun -appimage血泪经验:
linuxdeployqt必须用与编译Qt版本匹配的工具。框架tools/目录已预置linuxdeployqt-x86_64.AppImage(v7),避免学生自行下载版本不匹配。
5. 可交付性验证:从编译到验收的五步检查清单
答辩前最后一小时,别再手忙脚乱。我给自己定了一套硬性检查流程,每次交付前必走一遍。这套清单不是教你怎么写代码,而是帮你堵住所有能让老师当场质疑的漏洞。
5.1 编译验证:三平台最小可行构建
在目标环境中,不打开IDE,只用终端验证:
| 平台 | 命令 | 预期结果 | 不通过意味着 |
|---|---|---|---|
| Windows | mkdir build && cd build && cmake .. -G "Visual Studio 17 2022" && cmake --build . --config Release | 生成Release\qt_ui_framework.exe,大小≥5MB | Qt路径未配置,或CMakeLists.txt语法错误 |
| macOS | mkdir build && cd build && cmake .. -DCMAKE_BUILD_TYPE=Release && make -j4 | 生成qt_ui_framework.app,双击可启动 | @rpath未正确设置,或icns图标路径错误 |
| Linux | mkdir build && cd build && cmake .. -DCMAKE_BUILD_TYPE=Release && make -j$(nproc) | 生成qt_ui_framework,ldd ./qt_ui_framework | grep "not found"返回空 | Qt库未链接,或-fPIC缺失 |
关键点:必须用
Release模式构建。Debug模式体积大、启动慢,答辩演示时极易卡顿,给老师留下“性能差”印象。
5.2 运行时验证:高分屏与多显示器压力测试
在真实硬件上验证,而非虚拟机:
| 测试项 | 操作步骤 | 合格标准 | 翻车后果 |
|---|---|---|---|
| DPI切换 | 将笔记本连接4K显示器 → 在Windows设置中将外接屏DPI设为150% → 拖动窗口至外接屏 | 窗口自动缩放,文字清晰无模糊,按钮尺寸一致 | 老师用高分屏演示时界面炸裂,直接扣分 |
| 多屏拖拽 | 主屏100% DPI,副屏125% DPI → 将窗口从主屏拖至副屏 | 窗口内容实时重绘,无残影、无错位 | 证明框架真正支持PerMonitorV2,非伪高DPI |
| 主题切换 | 运行中点击“设置→主题→Dark” | 切换过程≤300ms,无闪烁,所有控件(包括QDialog、QMessageBox)同步变暗 | 证明StyleManager全局生效,非局部hack |
提示:测试必须用物理键盘快捷键(如
Ctrl+Shift+D触发主题切换),而非鼠标点击——答辩时手抖点不准,快捷键是保命符。
5.3 资源验证:零外部依赖打包检查
交付给老师前,确认程序不依赖任何外部文件:
| 检查项 | 方法 | 合格标准 | 工具 |
|---|---|---|---|
| qss嵌入 | strings qt_ui_framework | grep -i "\.qss" | 返回空(qss已编译进二进制) | strings命令 |
| 图标嵌入 | objdump -s -j .rsrc qt_ui_framework | grep "icons" | 显示图标资源段存在 | objdump(Windows)或otool(macOS) |
| 字体嵌入 | 运行程序 → 截图 → 用Photoshop检查字体信息 | 显示Noto Sans,非Microsoft YaHei或Helvetica | Photoshop或在线字体检测工具 |
设计说明:框架
resources.qrc已将themes/、icons/、fonts/全部声明为<file>,qt5_add_resources确保编译进二进制。若检查失败,99%是CMakeLists.txt中qt5_add_resources未正确调用。
5.4 无障碍验证:基础可访问性检查
即使不做专业无障碍认证,也要满足最低要求:
| 项目 | 检查方法 | 合格标准 | 为什么重要 |
|---|---|---|---|
| 键盘导航 | Tab键遍历所有控件 | 焦点按逻辑顺序移动(左→右→下),无跳过 | 老师可能用键盘演示,跳过按钮=功能缺失 |
| 焦点可见性 | 按Tab后观察按钮/输入框 | 有明显高亮边框(如2px蓝色虚线) | Qt默认焦点框极细,易被忽略 |
| 文字对比度 | 用浏览器插件axe DevTools扫描窗口截图 | 无color-contrast错误 | 部分高校评审表明确要求WCAG AA级 |
技巧:在qss中强制设置焦点样式:
*:focus { outline: 2px solid @primary-color; outline-offset: 2px; }
5.5 答辩演示脚本:3分钟精准呈现价值
答辩不是代码讲解,是价值传递。我固定用以下脚本,严格计时:
| 时间 | 动作 | 话术要点 | 设计目的 |
|---|---|---|---|
| 0:00-0:30 | 启动程序,展示初始界面 | “这是框架默认Light主题,采用WCAG标准对比度,所有文本可读性≥4.5:1” | 建立专业信任感 |
| 0:30-1:15 | 拖动窗口至4K显示器,切换DPI | “在150% DPI下,界面自动缩放,文字边缘锐利,无模糊——这得益于PerMonitorV2 Manifest声明” | 证明工程化能力 |
| 1:15-2:00 | 点击设置→切换Dark主题 | “一键切换深色模式,所有控件同步更新,包括QTableWidget和QDialog——由StyleManager统一驱动” | 展示架构设计深度 |
| 2:00-2:45 | Tab键遍历,展示焦点框 | “全键盘操作支持,焦点高亮清晰,符合无障碍基础要求” | 覆盖评审隐性指标 |
| 2:45-3:00 | 打开任务管理器,展示内存占用 | “内存占用<80MB,启动时间<800ms,满足PC端工具软件性能基准” | 用数据终结质疑 |
从那以后我每次交付前,都强制走一遍这五步检查清单,哪怕只剩半小时。它让我避开过三次答辩翻车:一次是Linux字体缺失(第5.3步发现),一次是macOS菜单栏空白(第4.3步补了
QMenuBar初始化),还有一次是老师用Surface Pro演示时DPI闪烁(第5.2步提前修复了QPropertyAnimation时长)。这些不是bug,是交付鸿沟。希望帮到你。
本文还有配套的精品资源,点击获取