QQ登录

只需要一步,快速开始

 注册地址  找回密码
查看: 2356|回复: 0
打印 上一主题 下一主题

Python UI设计学习笔记,在学习的UI框架中嵌入其他ui组件:增加组件到主画面的pages中

[复制链接]
字体大小: 正常 放大
杨利霞        

5273

主题

82

听众

17万

积分

  • TA的每日心情
    开心
    2021-8-11 17:59
  • 签到天数: 17 天

    [LV.4]偶尔看看III

    网络挑战赛参赛者

    网络挑战赛参赛者

    自我介绍
    本人女,毕业于内蒙古科技大学,担任文职专业,毕业专业英语。

    群组2018美赛大象算法课程

    群组2018美赛护航培训课程

    群组2019年 数学中国站长建

    群组2019年数据分析师课程

    群组2018年大象老师国赛优

    跳转到指定楼层
    1#
    发表于 2022-9-15 12:28 |只看该作者 |倒序浏览
    |招呼Ta 关注Ta
    ; V0 j" B7 |$ R! T5 O
    Python UI设计学习笔记,在学习的UI框架中嵌入其他ui组件:增加组件到主画面的pages中
    / x: {- m3 l6 d3 C4 {# R7 M8 s8 u! }

    6 d1 y* z7 i# T$ E& h' L文章目录* K4 s# [& `8 q3 {& d) J; P! s7 s
    在Pyside2中嵌入其他ui组件:增加组件到`pages`中,在`develop`分支中开发
    9 n2 P, w2 i& [; }4 V6 C* M组件1:`jupyter qtconsole`
    ! h# |1 I- R* M组件2:`matplotlib FigureCanvas for qtwidget`
    / p9 R3 c) P0 K6 d/ N2 U: l组件3:`pyqtgraph`2 g1 p4 y9 r) F1 H( n/ t- B* E
    在Pyside2中嵌入其他ui组件:增加组件到pages中,在develop分支中开发
    / V* B6 P: Q& y2 W( s* [6 p7 V以下组件部分测试测试参考:# Q& m3 Y% f2 Z1 g
    9 Z& r4 S# `, L# h* r* [
    参考的B站视频( p+ Y$ Y$ [+ {" ~6 s
    qtconsole 官方文档:The Qt Console for Jupyter
    - H  z! c( R( T" h3 Q+ _# K) Y组件1:jupyter qtconsole2 K" N1 }' E, C: w% F
    1、安装 qtconsole 库, 经测试发现,该库目前不支持 pyside6, 所以更改解释器环境到 pyqt5 or pyside20 w2 X0 D% Z- _; f: A
        pip install qtconsole -i  https://pypi.tuna.tsinghua.edu.cn/simple! i6 n/ p7 K: d* e2 n7 [) e1 ~
    1; X3 F+ {& u) l5 r: \2 a. I
    2、尝试启动
    $ P9 \* O  s  [, h8 x- T   jupyter qtconsole% e1 n  B; A% h
    1) k3 i( S; E; i% N6 L8 E3 h6 U7 H
    / d& S3 N! G& N, c# w5 _) q
    : w1 N' {2 D# l8 \1 Z+ R
    3、尝试嵌入组件到pyside2 ui中
    # j; \8 O: w- c+ X
    + n5 N+ H: O0 T' ]6 T# D3.1、复制参考的py代码 consolewidget.py 到 gui.widgets 文件目录下1 X  S9 H$ f  v) _
    9 [2 _5 z, j; o, v/ E- y
    3.2、在Qt Designer 使用 Widget(基类/父类) promote to ConsoleWidget,并修改对象名称,操作如下图:
    & ^  i( G8 g1 ?5 {9 W9 Q6 g+ X7 \
    , X8 A- t, W$ J' ]5 d6 J3 l8 T& h2 R8 N) _# F* w( F
    3.3、ui显示样式修改1: widget 样式表- L; i, |$ ]6 c) d+ ^; r3 N& U) u

    6 o' e3 T' H# ~2 u5 u, [7 o0 P/*设置父类窗体,背景边框等属性*/
    ( m- Y, A5 ^1 n+ Q, kQWidget {
    7 s7 D3 [7 s+ B3 r: H$ d        background-color: rgb(33, 35, 45);$ ?$ D, y+ w$ c% g1 f
            padding: 8px;
    ; s/ s6 P7 O) R: ]; V        border: 2px solid #c3ccdf;# j2 `7 N1 |& Y; s4 u. p
            color: rgb(255, 255, 255);/ \% s9 Z$ d6 M) ?$ Y: j' @* z
            border-radius: 10px;0 }( x% L8 q+ l0 ^! {
    }
    ) d6 M) ]+ t" }; N6 V1
    * W7 E+ S' s: M* a+ P9 a) T; |2 k; h2# D& x5 c9 |& s) v
    3
    + K0 s% h7 R- s6 `: a+ C4  `; ]7 J) f9 i( O! B, s: k
    5
    : U  I5 x& o: Z9 R2 m62 T7 i2 `# z9 v
    7. f, y0 A* L. c
    83 F: q! y( m/ {: o# B" N
    3.4、ui显示样式修改2:qtconsole启动界面风格指定
    6 q8 G( S9 _, {- u2 ?    self.set_default_style('linux')
    7 K+ R7 v2 n* O/ @  C/ y1
    ) Y& y, j$ a3 P8 M3.5、该窗口的实例化在uic自动生成的代码中
    . C- T; `7 I$ ~    self.ConsoleWidget = ConsoleWidget(self.frame_2)8 d/ n* R8 i) _3 j1 n
        self.ConsoleWidget.setObjectName(u"ConsoleWidget")
    5 |* k3 Q: K' Q) u1! T5 A! P* B9 \3 w
    2- d$ ~  J: Q6 e
    3.6、运行效果. s# k$ u4 t6 t3 G! v* ]2 c
    ! @3 x/ }1 `, ]) r
    组件2:matplotlib FigureCanvas for qtwidget
    * M  A4 O% K+ W. l3 F7 I5 C1、安装相关库, 指定清华源1 h+ R3 A1 r- @7 h( {5 X& O
        pip install numpy -i https://pypi.tuna.tsinghua.edu.cn/simple1 m2 J0 f) x4 ?: m. E" |. ^
        pip install pandas -i https://pypi.tuna.tsinghua.edu.cn/simple
    7 A" E# f2 A) z6 W    pip install matplotlib -i https://pypi.tuna.tsinghua.edu.cn/simple8 S$ c& i! {/ C
    1
    / y! A6 O. K! V) N3 \7 n6 E  g2
    + v# L  Z. v, A3 q3
    " S; `! v5 E$ D6 z8 R5 h0 gyoutube 参考视频0 j1 C, s8 O% N; z2 G
    网站教程
    9 N- V- I( b. [- h& ~, A  Gyoutube 参考视频: 不同主题风格调整方法,导入csv数据显示
    - t% P, Y5 ]4 @, P7 z' I' a2、 复制 MplWidget.py 文件到 gui/widget 目录下  N8 `6 J2 K8 n! i5 @3 P8 Z9 L" n
    3、测试 animation, Plotting Live Data in Real-Time
    + T# v& w/ Q$ v1 d/ }. U" [9 y. \" W1 x/ q' q8 S# S
    测试方法:plot_live_data()
    9 I; f- z3 y" k' J; d- R个人理解,animation 应该就是定义了一个与UI同线程的定时器。. `; Y8 Z3 p& H
    组件3:pyqtgraph
    & N; H% w( e; f参考视频1! u) O) \  d1 k- Z# w4 c
    参考视频2et’s Build an Audio Spectrum Analyzer in Python! (pt. 3) Switching to PyQtGraph
    5 \/ G9 j+ ~8 K9 n! t5 A! G
    1 J& K6 T' S9 ~3 @" X, T$ e1、安装相关库, 指定清华源  K5 |1 ?  T1 ]2 l% A" k
        pip install pyqtgraph -i https://pypi.tuna.tsinghua.edu.cn/simple
    ; q! y8 h2 t( i5 e10 V2 s5 x* F4 T5 Q( n; k
    2、在 gui\widgets 目录中增加 pyqtgraph_test.py文件
    0 u2 s/ d1 L7 R/ G5 f3 E8 B; t2 |+ [增加 2个按钮(draw, clear) 和 1个pygtgraph窗口控件(PlotWidget) 布局
    7 V1 L& F9 |4 Y4 \定义刷新时间,帧率,每隔通道的数据记录最大长度等概念3 |% P1 A$ c0 }) n5 V5 G+ e
    注意,每个点之间的采样时间实时性不是QTimer能保证的。
    8 H' d, x! g% c9 x% _. N7 [还需要想清楚如何保证准确的采样时间,以及与数据刷新时间间隔之间的关系。(参考已有的scope的习惯)
    ! }# W" u* k: V# H/ @使用 QTimer 定时器, 实现动态刷新的功能, 60FPS -> 定时器时间间隔设定为 1000/60ms
    . ^6 O' V7 j+ z0 e# X3 f1 m调用 self.graphicsView.plot(self.y_vals) 绘图,但注意,重复调用相当于创建多个通道的曲线。如果只想显示一个通道的曲线,有2种方式; u. }2 h( ?) @9 T! H
    方式1:在 plot() 方法前,调用 clear() 方法4 N) L2 v6 A, D9 U- u
    方式2:使用 self.graphicsView.plot.setData() 方法刷新数据,对应的数据清除方法也改一下,改成setData([])( v* Y+ `$ \1 m: p6 d
    3、参考 Audio Spectrum Analyzer 代码,优化多通道显示刷新方式2 Q# D8 s- U' m5 m6 V
    源工程运行前,需要安装的库,pyaudio使用pip安装会失败,使用管理员模式启用conda终端安装
    + _  t* z* D4 T2 p- ]: _   pip install opensimplex -i https://pypi.tuna.tsinghua.edu.cn/simple3 u- ~& |: v  a8 f- p4 f) Q) L
       conda install pyaudio -i https://pypi.tuna.tsinghua.edu.cn/simple
    ' _4 A# E6 d8 ~  F2 C7 C" V4 I& Q1
    % z  c, Q. o- `2. A$ x4 B# t+ n* A
    参考 self.traces = {}、set_plotdata() 数据结构和方法,优化多通道显示逻辑
    2 ^0 L& q9 ?: I9 w: U5 _9 T$ D4 u2 t; n+ F& G
    右键RUN pyqtgraph_test.py,效果如下:
    - ?; s5 F! R/ l9 e
    + V0 _3 l4 o1 O' s$ ~. s9 k3 ?8 Q3 `8 d- t/ F
    文章知识点与官方知识档案匹配,可进一步学习相关知识: T4 m, o2 |: g4 @$ p
    ————————————————" P# B$ R4 B. X" E1 z& Y& b% R! L
    版权声明:本文为CSDN博主「HUIJIANG123」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。% w$ h8 [( Y# M( P! b: I
    原文链接:https://blog.csdn.net/u012928587/article/details/124547230
    + i1 b4 D; \4 M  R, Z( c2 Y- {2 E

    6 Z( h# H; d8 w7 {. X1 _/ B
    zan
    转播转播0 分享淘帖0 分享分享0 收藏收藏0 支持支持0 反对反对0 微信微信
    您需要登录后才可以回帖 登录 | 注册地址

    qq
    收缩
    • 电话咨询

    • 04714969085
    fastpost

    关于我们| 联系我们| 诚征英才| 对外合作| 产品服务| QQ

    手机版|Archiver| |繁體中文 手机客户端  

    蒙公网安备 15010502000194号

    Powered by Discuz! X2.5   © 2001-2013 数学建模网-数学中国 ( 蒙ICP备14002410号-3 蒙BBS备-0002号 )     论坛法律顾问:王兆丰

    GMT+8, 2026-8-26 18:23 , Processed in 0.329272 second(s), 51 queries .

    回顶部