C/C++ Qt ToolBar菜单组件的具体使用

ToolBar工具栏在所有窗体应用程序中都广泛被使用,使用ToolBar可以很好的规范菜单功能分类,用户可根据菜单栏来选择不同的功能,Qt中默认自带ToolBar组件,当我们以默认方式创建窗体时,ToolBar就被加入到了窗体中,一般是以QToolBar的方式存在于对象菜单栏,如下所示。

QToolBar组件在开发中我遇到了以下这些功能,基本上可以应对大部分开发需求了,这里就做一个总结。

顶部工具栏ToolBar组件的定义有多种方式,我们可以直接通过代码生成,也可以使用图形界面UI拖拽实现,但使用代码时间则更加灵活一些,ToolBar组件可以表现出多种形态.

首先来看一个简单的生成案例,如下代码中我们通过属性setAllowedAreas()可以实现将ToolBar组件放置到上下左右四个不同的方位上面.

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <iostream>
#include <QMenuBar>
#include <QToolBar>

MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow)
{
    ui->setupUi(this);

// ----------------------------------------------------------
// 创建菜单栏
    QMenuBar *bar = menuBar();
    this->setMenuBar(bar);                      // 将菜单栏放入主窗口
    QMenu * fileMenu = bar->addMenu("文件");     // 创建父节点

    // 添加子菜单
    QAction *newAction = fileMenu->addAction("新建文件");     // 设置名字
    //newAction->setIcon(QIcon("://image/1.ico"));           // 设置可用图标

    fileMenu->addSeparator();                                // 添加分割线
    QAction *openAction = fileMenu->addAction("打开文件");     // 设置名字
    //openAction->setIcon(QIcon("://image/2.ico"));          // 设置可用图标

// ----------------------------------------------------------
//创建工具栏
    QToolBar *toolBar = new QToolBar(this);  // 创建工具栏
    addToolBar(Qt::LeftToolBarArea,toolBar); // 设置默认停靠范围 [默认停靠左侧]

    toolBar->setAllowedAreas(Qt::TopToolBarArea |Qt::BottomToolBarArea);   // 允许上下拖动
    toolBar->setAllowedAreas(Qt::LeftToolBarArea |Qt::RightToolBarArea);   // 允许左右拖动

    toolBar->setFloatable(false);       // 设置是否浮动
    toolBar->setMovable(false);         // 设置工具栏不允许移动

    // 工具栏添加菜单项
    toolBar->addAction(newAction);
    toolBar->addSeparator();
    toolBar->addAction(openAction);

// By : LyShark
// https://www.cnblogs.com/lyshark
// ----------------------------------------------------------
// 绑定槽函数
    connect(newAction,&QAction::triggered,this,[=](){
        std::cout << "new action" << std::endl;
    });

    connect(openAction,&QAction::triggered,this,[=](){
        std::cout << "open action" << std::endl;
    });
}

MainWindow::~MainWindow()
{
    delete ui;
}

接着通过代码的方式实现一个顶部菜单栏,该菜单栏中可以通过SetIcon(QIcon("://image/1.ico"));指定图标,也可以使用setShortcut(Qt::CTRL | Qt::Key_C);为其指定特殊的快捷键。

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <iostream>
#include <QMenuBar>
#include <QToolBar>

MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow)
{
    ui->setupUi(this);

// ----------------------------------------------------------
// 创建菜单栏
    QMenuBar *bar = menuBar();
    this->setMenuBar(bar);  //将菜单栏放入主窗口
    QMenu * fileMenu = bar->addMenu("文件");

// By : LyShark
// https://www.cnblogs.com/lyshark
    // 添加子菜单
    QAction *newAction = fileMenu->addAction("新建文件");      // 添加名字
    newAction->setIcon(QIcon(":/image/1.ico"));              // 设置ICO图标
    newAction->setShortcut(Qt::CTRL | Qt::Key_A);            // 设置快捷键ctrl+a

    fileMenu->addSeparator();                                // 添加分割线

    QAction *openAction = fileMenu->addAction("打开文件");
    openAction->setIcon(QIcon(":/image/2.ico"));
    openAction->setShortcut(Qt::CTRL | Qt::Key_C);          // 设置快捷键ctrl+c

// ----------------------------------------------------------
// 创建工具栏(可屏蔽掉,屏蔽掉后底部将失去控件栏位)

    QToolBar *toolBar = new QToolBar(this);       // 创建工具栏
    addToolBar(Qt::BottomToolBarArea,toolBar);    // 设置默认停靠范围(停靠在底部)
    toolBar->setFloatable(false);                 // 设置是否浮动为假
    toolBar->setMovable(false);                   // 设置工具栏不允许移动

    // 工具栏添加菜单项
    toolBar->addAction(newAction);               // 工具栏添加[新建文件]
    toolBar->addSeparator();                     // 添加分割线
    toolBar->addAction(openAction);              // 添加[打开文件]

// ----------------------------------------------------------
// 绑定信号和槽
   connect(newAction,&QAction::triggered,this,[=](){
       std::cout << "new file slot" << std::endl;
   });

   connect(openAction,&QAction::triggered,this,[=](){
       std::cout << "open file slot" << std::endl;
   });
}

MainWindow::~MainWindow()
{
    delete ui;
}

实现顶部菜单栏二级菜单,二级顶部菜单与一级菜单完全一致,只是在一级菜单的基础上进行了延申,如下代码则是定义了一个二级菜单。

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <iostream>
#include <QMenuBar>
#include <QToolBar>

MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow)
{
    ui->setupUi(this);

// ----------------------------------------------------------
// 多层菜单导航栏
       QMenuBar *MainMenu = new QMenuBar(this);
       this->setMenuBar(MainMenu);

       // 1.定义父级菜单
       QMenu *EditMenu = MainMenu->addMenu("编辑");

       // 1.1 定义 EditMemu 下面的子菜单
       QAction *text = new QAction(EditMenu);
       text->setText("编辑文件");                     // 设置文本内容
       text->setShortcut(Qt::CTRL | Qt::Key_A);      // 设置快捷键ctrl+a
       text->setIcon(QIcon(":/image/1.ico"));        // 增加图标
       EditMenu->addAction(text);

       EditMenu->addSeparator();                      // 在配置模式与编辑文件之间增加虚线

       QAction *option = new QAction(EditMenu);
       option->setText("配置模式");
       option->setIcon(QIcon(":/image/2.ico"));
       EditMenu->addAction(option);

       // 1.1.2 定义Option配置模式下的子菜单
       QMenu *childMenu = new QMenu();
       QAction *set_file = new QAction(childMenu);
       set_file->setText("设置文件内容");
       set_file->setIcon(QIcon(":/image/3.ico"));

       childMenu->addAction(set_file);

       QAction *read_file = new QAction(childMenu);
       read_file->setText("读取文件内容");
       read_file->setIcon(QIcon(":/image/2.ico"));
       childMenu->addAction(read_file);
// ----------------------------------------------------------
// 注册菜单到窗体中
// By : LyShark
// https://www.cnblogs.com/lyshark

       // 首先将childMenu注册到option中
       option->setMenu(childMenu);
       // 然后再将childMenu加入到EditMenu中
       EditMenu->addMenu(childMenu);

// ----------------------------------------------------------
// 绑定信号和槽
       connect(text,&QAction::triggered,this,[=](){
           std::cout << "edit file slot" << std::endl;
       });

       connect(set_file,&QAction::triggered,this,[=](){
           std::cout << "set file slot" << std::endl;
       });

       connect(read_file,&QAction::triggered,this,[=](){
          std::cout << "read file slot" << std::endl;
       });
}

MainWindow::~MainWindow()
{
    delete ui;
}

Qt中的菜单还可以实现任意位置的弹出,例如我们可以将右击customContextMenuRequested()事件,绑定到主窗口中,实现在窗体任意位置右击都可以弹出菜单栏,代码如下。

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <QMenuBar>
#include <iostream>

MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    this->setContextMenuPolicy(Qt::CustomContextMenu);
}

MainWindow::~MainWindow()
{
    delete ui;
}

// 在主界面右击->转到customContextMenuRequested槽
// By : LyShark
// https://www.cnblogs.com/lyshark
void MainWindow::on_MainWindow_customContextMenuRequested(const QPoint &pos)
{
    // 创建菜单对象
    QMenu *pMenu = new QMenu(this);

    QAction *pNewTask = new QAction(tr("新建"), this);
    QAction *pEditTask = new QAction(tr("编辑"), this);
    QAction *pDeleteTask = new QAction(tr("删除"), this);

    // 设置属性值编号: 1=>新建 2=>设置 3=>删除
    pNewTask->setData(1);
    pEditTask->setData(2);
    pDeleteTask ->setData(3);

    // 把QAction对象添加到菜单上
    pMenu->addAction(pNewTask);
    pMenu->addAction(pEditTask);
    pMenu->addAction(pDeleteTask);

    // 增加图标
    pNewTask->setIcon(QIcon(":/image/1.ico"));
    pEditTask->setIcon(QIcon(":/image/2.ico"));
    pDeleteTask->setIcon(QIcon(":/image/3.ico"));

    // 连接鼠标右键点击信号
    connect(pNewTask, SIGNAL(triggered()), this, SLOT(onTaskBoxContextMenuEvent()));
    connect(pEditTask, SIGNAL(triggered()), this, SLOT(onTaskBoxContextMenuEvent()));
    connect(pDeleteTask, SIGNAL(triggered()), SLOT(onTaskBoxContextMenuEvent()));

    // 在鼠标右键点击的地方显示菜单
    pMenu->exec(QCursor::pos());

    //释放内存
    QList<QAction*> list = pMenu->actions();
    foreach (QAction* pAction, list) delete pAction;
    delete pMenu;
}

// 处理发送过来的信号
void MainWindow::onTaskBoxContextMenuEvent()
{
    // this->sender()就是信号发送者 QAction
    QAction *pEven = qobject_cast<QAction *>(this->sender());

    // 获取编号: 1=>新建 2=>设置 3=>删除
    int iType = pEven->data().toInt();

    switch (iType)
    {
    case 1:
        std::cout << "新建任务" << std::endl;
        break;
    case 2:
        std::cout << "设置任务" << std::endl;
        break;
    case 3:
        std::cout << "删除任务" << std::endl;
        break;
    default:
        break;
    }
}

还可以将顶部的菜单通过bar->setVisible(false);属性将其隐藏起来,对外只展示出一个ToolBar控件栏位,ToolBar控件栏中只保留ICO图标与底部文字描述,这样能显得更加清爽一些。

#include "mainwindow.h"
#include "ui_mainwindow.h"

#include <QMenuBar>
#include <QToolBar>
#include <iostream>

MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow)
{
    ui->setupUi(this);

// ----------------------------------------------------------
    // 隐藏菜单栏上的右击菜单
    this->setContextMenuPolicy(Qt::NoContextMenu);

    // 创建基础顶部菜单并让其隐藏
    QMenuBar *bar = menuBar();
    this->setMenuBar(bar);
    QMenu * fileMenu = bar->addMenu("Ptr");
    bar->setVisible(false);                 // 隐藏菜单

    // 添加子菜单
    QAction *NewAction = fileMenu->addAction("新建文件");
    QAction *OpenAction = fileMenu->addAction("打开文件");
    QAction *ReadAction = fileMenu->addAction("读入文件");

    // 分别设置图标
    NewAction->setIcon(QIcon(":/image/1.ico"));
    OpenAction->setIcon(QIcon(":/image/2.ico"));
    ReadAction->setIcon(QIcon(":/image/3.ico"));

    // 创建工具栏
    QToolBar *toolBar = new QToolBar(this);
    addToolBar(Qt::TopToolBarArea,toolBar);

    // 将菜单项依次添加到工具栏
    toolBar->addAction(NewAction);
    toolBar->addAction(OpenAction);
    toolBar->addAction(ReadAction);

    // 设置禁止移动属性,工具栏默认贴在上方
    toolBar->setFloatable(false);
    toolBar->setMovable(false);
    toolBar->setToolButtonStyle(Qt::ToolButtonTextUnderIcon);

// ----------------------------------------------------------
// 绑定槽函数
// By : LyShark
// https://www.cnblogs.com/lyshark
    connect(NewAction,&QAction::triggered,this,[=](){
        std::cout << "new action" << std::endl;
    });

    connect(OpenAction,&QAction::triggered,this,[=](){
        std::cout << "open action" << std::endl;
    });

    connect(ReadAction,&QAction::triggered,this,[=](){
        std::cout << "read action" << std::endl;
    });
}

MainWindow::~MainWindow()
{
    delete ui;
}

到此这篇关于C/C++ Qt ToolBar菜单组件应用的的文章就介绍到这了,更多相关Qt ToolBar内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • python GUI库图形界面开发之PyQt5工具栏控件QToolBar的详细使用方法与实例

    PyQt5工具栏控件QToolBar介绍 QToolBar控件是由文本按钮,图标或其他小控件按钮组成的可移动面板,通常位于菜单栏下方 QToolBar类中的常用方法 方法 描述 addAction() 添加具有文本或图标的工具按钮 addSeperator() 分组显示工具按钮 addWidget() 添加工具栏中按钮以外的控件 addToolBar() 使用QMainWindow类的方法添加一个新的工具栏 setMovable() 工具变得可移动 setOrientation() 工具栏的方向

  • C/C++ Qt ToolBar菜单组件的具体使用

    ToolBar工具栏在所有窗体应用程序中都广泛被使用,使用ToolBar可以很好的规范菜单功能分类,用户可根据菜单栏来选择不同的功能,Qt中默认自带ToolBar组件,当我们以默认方式创建窗体时,ToolBar就被加入到了窗体中,一般是以QToolBar的方式存在于对象菜单栏,如下所示. QToolBar组件在开发中我遇到了以下这些功能,基本上可以应对大部分开发需求了,这里就做一个总结. 顶部工具栏ToolBar组件的定义有多种方式,我们可以直接通过代码生成,也可以使用图形界面UI拖拽实现,但使

  • Bootstrap按钮下拉菜单组件详解

    按钮组也是一个独立的组件,按钮组和下拉菜单组件一样,需要依赖于button.js插件才能正常运作. 把一组<div class="btn-group">组合进一个<div class="btn-toolbar">做成更复杂的组件. <div class="btn-toolbar" role="toolbar"> <div class="btn-group">

  • 基于bootstrap按钮式下拉菜单组件的搜索建议插件

    本文实例为大家分享了Bootstrap Search Suggest搜索建议插件的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <title>Bootstrap 搜索建议插件</title> <meta name="viewport" content

  • Vue.js手风琴菜单组件开发实例

    本文为大家分享了vuejs组件开发之手风琴菜单组件实例,供大家参考,具体内容如下 小图标是引入font-awesome字体图标库绘制的.效果如下图所示: 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>index</title> <link rel="stylesheet"

  • Jquery Easyui菜单组件Menu使用详解(15)

    本文实例为大家分享了Jquery Easyui菜单组件的实现代码,供大家参考,具体内容如下 加载方式 菜单组件通常用于快捷菜单,在加载方式上,通过 class 或 JS 进行设置为菜单组件.然后,再通过 JS 事件部分再响应. <div id="box" class="easyui-menu"> <div>新建</div> <div> <span>打开</span> <!--二次菜单--&

  • vue多级多选菜单组件开发

    本文实例为大家分享了vue多级多选菜单组件的制作方法,供大家参考,具体内容如下 要开发一个这样的多级多选菜单组件,功能是: 点击父标题栏可以打开与折叠子列表 点击父标题栏的勾选图标可以全选或取消子列表 点击子列表的勾选图标达到全选时,父标题栏的勾选图标自动勾选:反之,没达到全选时,父标题栏的勾选图标自动取消勾选 当所有父标题栏的勾选图标达到全选时,最底下那个全选框自动勾选:反之,没达到全选时,最底下那个全选框自动取消勾选 点击最底下那个全选框可以全选或取消全部的勾选图标 所以总结起来我们重点要利

  • vue移动端UI框架实现QQ侧边菜单组件

    最近面试发现很多前端程序员都从来没有写过插件的经验,基本上都是网上百度.所以打算写一系列文章,手把手的教一些没有写过组件的兄弟们如何去写插件.本系列文章都基于VUE,核心内容都一样,会了之后大家可以快速的改写成react.angular或者是小程序等组件.这篇文章是第一篇,写的是一个类似QQ的侧边菜单组件. 效果展示 先让大家看个效果展示,知道咱们要做的东西是个怎么样的样子,图片有点模糊,大家先将就点: 开始制作 DOM结构 整体结构中应该存在两个容器:1. 菜单容器 2. 主页面容器:因此当前

  • Delphi菜单组件TMainMenu使用方法详解

    本文为大家分享了菜单组件TMainMenud的使用方法,供大家参考,具体内容如下 菜单组件TMainMenu 创建菜单双击TmenuMain,单击Caption就可以添加一个菜单项 菜单中添加分割线只需加"-"就可以添加一个分割线 级联菜单的设计 单击鼠标右键弹出菜单中选择Create Submenu菜单项 单选功能设计 要在设计的菜单项目中选择RadioItem属性为True,Checked属性为True 复选功能的设计 在设计菜单项目中选择RadioItem属性为False,Che

  • 易语言卷帘式菜单组件使用教程

    卷帘式菜单,想必新手朋友没有用过吧!这个组件的功能也是很强大的,可扩展性强,容纳信息量大,使用灵活 1.首先,运行易语言,然后选择"Windows窗口程序"并点击"确定"按钮,进入"Windows窗口程序"设计界面.如图: 2.在窗口上绘制卷帘式菜单,选中该组件,单击鼠标右键,查看它的数据类型定义,如图: 3.由于卷帘式菜单组件的方法和属性较多,这里不能一一演示.我们就抽出几个方法来讲解,剩下的方法大家可自行查看帮助学习. 4.重新布局窗口界面,

  • Vue.js下拉菜单组件使用方法详解

    本文实例为大家分享了Vue.js下拉菜单组件的具体实现代码,供大家参考,具体内容如下 效果 #### 入口页面 index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scal

随机推荐