[Qt6][QML][教程]QML动态柱状图

上节我们解决了高分辨鼠标坐标偏移的问题，这次我们来整个动态柱状图来实现实时音频频谱显示

教程被应用在MediaStateT中

MediaStateT Github项目地址: https://github.com/taxue-alfred/MediaStateT

MediaStateT Gitee项目地址: https://gitee.com/MediaState/MediaStateT

效果展示

效果感觉还行？将就吧，到时候抽时间再美化美化。。而且似乎得上个多线程。。

实现讲解

这里一共两个声道，我们就讲一个声道，剩下那个一样的实现。先创建一个基本构架。

ChartView{
    
    
    id:left_bar
    //            title: qsTr("左声道")
    Layout.minimumWidth:320
    Layout.minimumHeight:240
    antialiasing:true
    legend.visible:false

    BarCategoryAxis{
    
    
        id:left_bar_value_X
        labelsVisible:false
        gridVisible:false
        //这里添加下标，到时候隐藏，不然到时候进行数据替换没法替换，数量一定要和想要显示的个数一致
        categories: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10"]
    }

    ValueAxis{
    
    
        id:left_bar_value_Y
        visible:false
        min:0
        max:1000
    }

    BarSeries{
    
    
        axisX:left_bar_value_X
        axisY:left_bar_value_Y

        BarSet {
    
    
            id:bar1
            label: "Bob";
            //这里对应数值，到时候隐藏，不然到时候进行数据替换没法替换，数量一定要和想要显示的个数一致
            values: [2, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
        }
    }
}

具体数据替换：

这里摘取部分代码，相较于项目源代码删除了折线图部分和柱状图右声道部分，避免大量代码影响观感，只是为了大家尽可能好理解，全部代码请看项目

这里解释一些必要的东西：

• 替换数据需要YourBarID.replace(index, value)函数
• freInterFace.data_vector 顾名思义就是我存放数据的地方，替换成自己的数据就可以了。
• 我的柱状图一共十个柱，。所以j<=10，具体情况自行替换
• bar1就是左声道的柱状图id，具体情况自行替换

Timer{
    
    
    id:update_value
    repeat:true
    running:true
    interval:45
    onTriggered: {
    
    
        //检测窗口是否处于活跃状态
        if(root_window.active === true){
    
     
                for(var j = 0;j <= 10;j++){
    
    
                    bar1.replace(j, freInterface.data_vector[3][j+1])
                }
            }
        }
    }
}

其他的上下节的文章看我的这个Qt收录吧，。。实在是懒得写上下节了。

https://blog.csdn.net/qq_38844263/category_11578713.html

唠嗑：这个教程我感觉写到这里就快接近尾声了，往后无非就是一些BUG的修复和一些小功能的添加了（还有MediaStateBoard的那个板子的实现，不过就和Qt无关了）。当然，添加有趣的功能也会再出个文章啥的。这次的文章主要是写项目的过程中遇到的一些坑或者是比较好的经验分享。写这个项目完全就是看着网易云那个MACOS弹窗真心不错，就想模仿一个，另外再添加点新功能。Qt6是个刚出的新玩意，网上的教程也是零星的几篇。很多平台的教程都是直接自动copy来的，相信各位也看得出来。。