当前位置:首页 » 《休闲阅读》 » 正文

Qt Designer,仿作一个ui界面的练习(一):界面的基本布局

21 人参与  2024年11月16日 08:01  分类 : 《休闲阅读》  评论

点击全文阅读


初学不要太复杂,先做一个结构简单的,大致规划一下功能分区,绘制草图:

 最终的效果:

        

        界面主要由顶边栏、侧边栏、内容区构成。顶边栏左边是logo,右边是时钟显示。侧边栏最上边是切换按钮,用以动画切换功能按钮的缩略显示和全部显示。

一、创建QMainWindow,命名为demo.ui:

二、移除菜单栏和状态栏

三、 将自带的QWidget命名为baseWidget:

        这是所有的部件的基底界面。

四、 在baseWidget上放置一个QFrame,命名为appFrame,这个QFrame就是软件的显示主界面。

五、再放置四个QFrame,分别命名为leftFrame(左边栏)、topFrame(顶边栏)、mainContent(显示内容主区)、contentBox(内容区)。内容区由左边栏和显示内容主区组成,是软件的主要操作和显示区。

六、逐一设计布局和部件结构,从顶边栏开始:

        1、在topFrame(顶边栏)放置三个QFrame,从左至右分别命名为:topLogo、topContent、topTimeShow。

        2、顶边栏的属性设置,将最大和最小高度全部设置为50:

 3、topLogo的属性:最大和最小宽高均设尺寸为30*30

        4、topContent的属性:最大和最小高度全部设置为50:

         5、topTimeShow的属性:最大和最小宽高尺寸全部设置为200*50:

        6、右键点击topFrame(顶边栏),布局--水平布局。并在属性中将边距全部设为0 。

        7、右键点击topLogo,布局对齐--左侧。

        8、同样的方法, 设置topTimeShow布局对齐--右侧。

七、leftFrame(左边栏)的布局:

        1、leftFrame(左边栏)放置三个QFrame,从上到下分别命名为:left_toggleBox、left_buttonsBox、left_bottomBox。

        2、leftFrame(左边栏)的属性设置,将最小宽度设置为50。

        3、left_buttonsBox的属性设置,将最小宽度设置为50。

        4、left_toggleBox、left_bottomBox的属性设置,最小宽度设置为50,最小和最大高度均设为50。

        5、右键点击leftFrame(左边栏),布局--垂直布局。并在属性中将边距全部设为0 。

        6、右键点击left_buttonsBox,布局对齐--顶部。注意,顶部的不是left_toggleBox,虽然它在最上边。将位于中间的left_buttonsBox设为顶部,它就不会自动居中,而是随着尺寸的增长从上向下延伸。

        7、右键点击left_bottomBox,布局对齐--底部。

八、contentBox(内容区)的布局

        1、将leftFrame(左边栏)和mainContent(显示内容主区)拖入contentBox(内容区)。

        2、右键点击contentBox(内容区),布局--水平布局。并在属性中将边距全部设为0 。

        3、 右键点击leftFrame,布局对齐--左侧。

        4、在mainContent(显示内容主区)属性设置里将其水平策略设置为expanding。

九、appFrame(显示主界面)的布局

        1、将topFrame和contentBox拖入appFrame(显示主界面):

         2、右键点击appFrame(显示主界面),布局--垂直布局。并在属性中stretch设为0,其余保持默认 。

        3、 右键点击topFrame,布局对齐--顶部。

        4、在contentBox(内容区)属性设置里将其垂直策略设置为expanding。

十、整体的布局:

        右键点击MainWindow,布局--垂直布局。

        

         至此,完成了布局的基本框架设计,软件的显示主界面(appFrame)已经自动布满了QMainWindow,而且,当拖动改变QMainWindow的尺寸时,appFrame,也就是软件的显示主界面也随之改变。这就是使用布局的好处,它会自动调整相对的尺寸,使软件界面能够适应不同的屏幕分辨率。


点击全文阅读


本文链接:http://zhangshiyu.com/post/186903.html

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

最新文章

  • 祖母寿宴,侯府冒牌嫡女被打脸了(沈屿安秦秀婉)阅读 -
  • 《雕花锦年,昭都旧梦》(裴辞鹤昭都)完结版小说全文免费阅读_最新热门小说《雕花锦年,昭都旧梦》(裴辞鹤昭都) -
  • 郊区41号(许洛竹王云云)完整版免费阅读_最新全本小说郊区41号(许洛竹王云云) -
  • 负我情深几许(白诗茵陆司宴)完结版小说阅读_最热门小说排行榜负我情深几许白诗茵陆司宴 -
  • 九胞胎孕妇赖上我萱萱蓉蓉免费阅读全文_免费小说在线看九胞胎孕妇赖上我萱萱蓉蓉 -
  • 为保白月光,侯爷拿我抵了债(谢景安花田)小说完结版_完结版小说全文免费阅读为保白月光,侯爷拿我抵了债谢景安花田 -
  • 陆望程映川上官硕《我的阿爹是带攻略系统的替身》最新章节阅读_(我的阿爹是带攻略系统的替身)全章节免费在线阅读陆望程映川上官硕
  • 郑雅琴魏旭明免费阅读_郑雅琴魏旭明小说全文阅读笔趣阁
  • 头条热门小说《乔书意贺宴临(乔书意贺宴临)》乔书意贺宴临(全集完整小说大结局)全文阅读笔趣阁
  • 完结好看小说跨年夜,老婆初恋送儿子故意出车祸_沈月柔林瀚枫完结的小说免费阅读推荐
  • 热推《郑雅琴魏旭明》郑雅琴魏旭明~小说全文阅读~完本【已完结】笔趣阁
  • 《你的遗憾与我无关》宋怀川冯洛洛无弹窗小说免费阅读_免费小说大全《你的遗憾与我无关》宋怀川冯洛洛 -

    关于我们 | 我要投稿 | 免责申明

    Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1