QQuickWidget里放置QML

1、效果

2、QML

在资源里新建Mybattery.qml：

import QtQuick 2.0
import QtQuick 2.12
Item {
    id: root
    property color color1: "#18FD18"//绿色,健康
    property color color2: "#FFFF1A"//黄色,注意
    property color color3: "#7F45AA"//紫色,恶化
    property color color4: "#FF1A1A"//红色,故障
    property color colorBase: color1
    property bool colorChangeFlag: true
    property int bat_value: 80
    signal setBat(double batValue)//对外接口,batValue是已经使用了多少电量,比如已经使用了80%则=80
    onSetBat: {
        console.log("in bat")
        if(batValue<0)//不能小于0
        {
            text_bat_text.text="err param";
            return;
        }
        else if(batValue>100)
        {
            bat_value=0;
            rect_bat_body.border.color=color4;
        }
        else
        {
            bat_value=100-batValue;
            rect_bat_body.border.color="gray"
        }
        if(batValue<=80)
        {
            text_bat_text.text="已使用"+batValue+"%"