QML 三种状态父checkbox自定义

兼容适配 软件兼容
1

经过反复的修改与调试，终于实现了父checkbox的三种状态控制。三种状态分别为，当父checkbox状态变为true时，子checkbox全部状态变成true，当父checkbox状态变为false时，子checkbox全部变成false，当子checkbox有单独改变状态且不全为true或全为false时，父checkbox显示中间态mid。最后还有细节处理，当将子checkbox一个个变成false时，最后父checkbox自动变成false，当将子checkbox一个个变成true时，最后父checkbox自动变成true。下面将maincheckbox代码贴出来供需要的人参考，要完成上述功能还需要在特定的环境进行相应的状态判断。

import QtQuick 1.1
import StyleItemType 0.1
Item {
   id: maincheckbox
   property string checked: "true"
   property bool checkedbool: true
   property int minimumWidth: 13//32
   property int minimumHeight: 13//32
   width: minimumWidth
   height: minimumHeight
   Rectangle {
   anchors.fill: parent
   anchors.margins: 1
   radius: 5
   smooth:true
   Image {
   id:mainimage
   anchors.fill:parent
   source: "../../img/icons/checkbox-0.png"
   }
   Image{
   id:simage
   anchors.centerIn: mainimage
   source: "../../img/icons/checkbox.png"
   }
   }
   MouseArea {
   id: mouseArea
   anchors.fill: parent

   onClicked: {
   if(checked=="true")
   checked="false";
   else if(checked=="mid")
   {
   if(checkedbool==false)
   checked="true"
   else if(checkedbool==true)
   checked="false"
   }
   else if(checked=="false")
   checked="true"
   }
   }
   onCheckedChanged:{
   if(checked=="true")
   {
   simage.source="../../img/icons/checkbox.png";
   checkedbool=true;

   }
   else if(checked=="mid")
   simage.source="../../img/icons/checkbox-2.png"
   else if(checked=="false")
   {
   simage.source=""
   checkedbool=false;
   }
   }
}