Qt侧边栏简易版

最新推荐文章于 2024-05-13 20:34:33 发布
最新推荐文章于 2024-05-13 20:34:33 发布
阅读量564 收藏 4
点赞数
分类专栏： Qt 文章标签： qt
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/linvisf/article/details/132254496
版权

1 实现思路

经常看到PC端或移动端软件有侧边栏，就想着也试着实现下。实现起来还是蛮简单的。思路：侧边栏隐藏和显示，按钮随之变化。见效果图：

侧边栏简易效果

2 实现代码

点击按钮控制侧边栏隐藏和显示

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui
最低0.47元/天 解锁文章
linvisf
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
5.自定义侧边导航菜单组件（基于menubar,menu,menuitem）
adsd1233123的博客
04-12 227
qml中实现可折叠的侧边导航栏方法 使用menubar 与menubaritem ，menu，menuitem是做不到的。为此将以上组件重写，实现侧边可折叠。
QSideBar Qt侧边栏.zip
10-23
QSideBar Qt侧边栏.zip
Qt界面篇：Qt界面之侧边栏隐藏和滑出
欧特GO
08-23 9981
在实际的Qt界面布局设计中，特别是主界面中，经常会用到侧边栏的方式，然后在其中加入其他控件来复合使用，下面简单来实现一下Qt侧边栏的隐藏和显示
QML自定义侧边栏的设计与实现
IT鸠摩智的博客
05-13 136
在现代用户界面设计中，侧边栏作为一种常用的导航和信息展示手段，扮演着至关重要的角色。使用Qt Quick和QML在应用程序中实现一个既美观又实用的自定义侧边栏，可以极大地提升用户体验。本文将探讨如何在不涉及具体代码的前提下，设计和实现一个功能丰富的QML自定义侧边栏。
Qt、使用QToolButton和QStackedWidget的侧边栏（SideBar）的实现与实现原理解析
^_^
01-03 1万+
侧边栏是一个很常用的导航控件，如Qt Creator软件本身也使用到了侧边栏：目前使用Qt做出这种侧边导航栏，常见的做法是使用QListWidget加QStackedWidget，但是使用QListWidget做侧边的这个导航很不灵活，想要复刻出和Qt Creator这个侧边栏同样的效果很费劲，所以本篇博客采用QToolButton加QStackedWidget形式，在用QSS进行美化以达到效果。
QT之导航栏实现
热门推荐
小风code
04-22 2万+
有道词典大家一定用过，今天要分享的就是类似与有道词典侧边导航栏的做法（PS:有道词典 用的不是QT技术实现的   而是 Hex技术  点击查看详情） 开始正题，如何用QT来实现类似的导航栏的效果 一步步详细教你！ 涉及的技术主要是QListWidget（列表窗口）和qstaqsta（堆叠窗口）的应用 （PS:在设计时先不用考虑好不好看，逻辑搞定了然后再用QSS代码美化）
【C++/QT】QT实现侧边导航栏（附代码）
第四维度的博客
03-21 9545
在qt界面实现侧边导航栏的设计 主页主要实现： a、添加 `sideBar` 到左侧 b、拖动四个 `QToolButton` c、放置 `verticalSpacer` d、右侧放置主窗口 `stackedWidget` ，删掉两个page e、修饰按键 建立连接 connect(&btnGroup, static_cast(&QButtonGroup::buttonClicked), ui->stackedWidget, &QStacked
Qt 侧边栏
GreenArrowMan-CSDN博客
10-23 7728
通过QToolButton来实现侧边栏，或者说侧边工具栏，可以通过接口直接自由添加按钮，可以设置工具按钮对应的QWidget，进而点击不同的按钮可以显示不同的QWidget。 实现代码： #ifndef QSIDEBAR_H #define QSIDEBAR_H #include #include #include #include #include class QSid
Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动
最新发布
05-30
Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动Qt侧边栏滑动
Qt 侧边栏+自定义气泡提示对话框；Qt5.15.2+vs2019编译器
10-21
2、按钮控制侧边栏的显示隐藏；3、按钮可以控制侧边栏内容的切换；4、实现自定义气泡提示框，提示框形状依据需求自绘；5、鼠标悬停到按钮控件时候可以弹出自定义气泡提示框，移开时提示框消失。
Qt 项目 简易版桌面萌宠
01-28
开发环境使用Qt6+VS2019, 制作的一个简易版萌宠,有背景音乐播放,可以更换壁纸,使用qss对按钮的美化
QT标签栏TabBar实现侧边工具栏的功能
11-20
该功能由QT插件实现的一个带界面的DLL，该dll实现了如下功能： 1、在主界面侧边添加工具栏框架 2、可以收缩和展开工具栏 3、可以在工具栏中插入各种小工具界面 4、可以在工具栏中删除界面 5、可以在工具栏中把子界面...
Qt实现跟随侧边栏的按钮控制侧边栏的展开与折叠
qq_44896246的博客
11-29 4894
Qt实现跟随侧边栏的按钮控制侧边栏的展开与折叠
Qt--实现侧边栏
贝勒里恩的博客
12-09 7505
一、效果展示 二、原理详解 实现这个隐藏侧边栏的主要思想是侧边栏的显示和隐藏，显示和隐藏只需要移动Widget到可看见的区域（窗口区域）和不可看见的区域（窗口区域之外）即可。可以使用QPropertyAnimation属性动画，绑定Widget的geometry属性，实现显示和隐藏的动画效果，关键代码如下： MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent) , ui(new Ui::MainWindow) {
Qt界面设计——侧边栏弹出效果
guaiwenshang889的博客
03-02 873
在日常项目中，界面布局上经常使用到侧边栏的方式，在侧边栏放置控件进行复合使用，可以实现子功能界面的弹出，效果展示如下：界面控件很简单，主界面QWidget，侧边栏也用一个QWidget和一个按钮QPushbutton来进行组合。通过点击按钮来显示和隐藏侧边栏。主要用到的是控件的move()函数，配合QPropertyAnimation实现动画效果滑动显示隐藏。
《QT从基础到进阶·三十七》QWidget实现左侧导航栏效果
cs1395293598的博客
11-22 1493
（3）通过addMenuWidget设置第一个界面为"MTF"，第二个参数0表示把该界面放在第一个标签上显示，第三个参数拿到mtf的界面传入放置到导航栏的m_centerQVBoxLayout布局中。NavigationBarPlugin插件类实现了对左侧导航栏的管理，我们可以在导航栏插件中添加界面，并用鼠标点击导航栏能够切换对应的界面。我们先把导航栏框架添加添加到主界面的左边，然后在主界面右边设置一个布局用于后面显示界面。（4）同理下面依次添加第二个标签和放置第二个界面，添加第三个标签放置第三个界面。
Qt——实现仿侧边栏
m0_49474265的博客
02-05 439
基于VS2019、Qt5.15.5，纯代码实现Qt相关功能。
Qt实现可伸缩的侧边工具栏(鼠标悬浮控制伸缩栏)
qq_37366618的博客
08-03 2082
一直在网上找，发现大多的实现方案都是用一个按钮，按下控制侧边栏的伸缩，但是我想要实现在侧边栏的时候就伸出，移开就收缩的功能，也没找到好的参考，所以决定自己实现一个，只在C++代码里面就可以实现了，不需要用到qss。
ldaptemplate 分页_设计语言 侧边导航栏/分页
weixin_39608559的博客
10-23 440
作者：罗耀_UI不管是做设计(感性)还是设计规范(理性)，都是仁者见仁智者见智的，都很主观。我是想阐述出自己的想法供大家参考，文章中的数值也不是固定标准，还是希望大家根据不同的项目需求，去解决不同的实际问题。目录1.下拉菜单 1.1 了解侧边导航栏 1.2 绘制矩形框 1.3 文本行高 1.4 层级划分 1.5 确定距离2.分页 2.1 了解分页 2.2 绘...
qml好看的侧边栏
05-24
QML 中可以使用 Qt Quick Controls 中的侧边栏组件 `Sidebar` 来创建一个美观的侧边栏。 以下是一个简单的示例代码： ```qml import QtQuick 2.15 import QtQuick.Controls 2.15 ApplicationWindow { visible: true width: 640 height: 480 title: qsTr("Sidebar") Sidebar { id: sidebar width: 200 height: parent.height anchors.left: parent.left anchors.top: parent.top ListView { model: ["Home", "Settings", "Help"] delegate: Rectangle { width: parent.width height: 40 color: ListView.isCurrentItem ? "lightgray" : "white" Text { text: modelData anchors.centerIn: parent } } highlight: Rectangle { color: "lightblue" height: 40 } focus: true Keys.onPressed: { if (event.key === Qt.Key_Escape) sidebar.close() } onCurrentIndexChanged: { var index = currentIndex console.log("Current index: ", index, " model data: ", model.get(index)) } } } Rectangle { anchors.fill: parent color: "lightblue" Text { text: "Content" anchors.centerIn: parent } } Button { text: "Open sidebar" onClicked: sidebar.open() anchors.bottom: parent.bottom anchors.right: parent.right margin: 20 } } ``` 该代码创建了一个包含侧边栏和主内容的窗口。侧边栏由 `Sidebar` 组件创建，其中包含一个 `ListView` 作为菜单项。主内容由一个蓝色的矩形和一个位于底部的按钮组成。在按钮被点击时，侧边栏可以打开或关闭。 你可以根据自己的需求和设计，在此基础上进行修改和美化。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值