QtQuick 全局变量解决ListView嵌套子ListView中访问子model难题

来源:互联网 发布:python接口测试脚本 编辑:程序博客网 时间:2024/05/16 15:22
import QtQuick 2.7import QtQuick.Controls 2.0import QtQuick.Controls 1.2  as Oldimport QtQuick.Controls.Material 2.0import QtQuick.Layouts 1.0import QtQuick.Window 2.0import QtQuick.Controls 1.4import  QtQml.Models 2.2import  "Help.js"  as  Help ApplicationWindow{     width: 1024    height: 768    visible: true    //遍历    ListView{        id:mainview        clip: true        width: parent.width        height: parent.height-btnt.height        model: mainlistmodel        delegate: delegatefenzu        Component.onCompleted: {            Help.clearSubmodels()        }    }    Button{        id:btnt        anchors.top: mainview.bottom        anchors.left: parent.left        width: 100        height: 40        text:"枚举"        onClicked: {            Help.遍历(mainlistmodel)            var curmodel=null;            curmodel=Help.取指定分组子列表Model_列表名称(mainlistmodel,"坑货");            for(var x =0;x<curmodel.count;x++)            {                console.log("遍历指定列表:"+curmodel.get(x).name)            }        }    }    ListModel{        id:mainlistmodel        ListElement{ fenzuname:"我的好友"}        ListElement{ fenzuname:"亲人" }        ListElement{ fenzuname:"死党" }        ListElement{ fenzuname:"坑货" }    }    Component{        id:delegatefenzu        Item{            id:mainroot            clip: true            width: parent.width            height: btn.height+mlist.height            Rectangle{                id:btn                width: parent.width                height:36                color: "#ffffff"                border.color: "#cccccc"                border.width: 1                BorderImage {                    id:img                    source: setsrc()                    width: height; height:24                    border.left: 1; border.top: 1                    border.right: 1; border.bottom: 1                    function  setsrc()                    {                        if(mlist.visible==true){                            return "qrc:/-.png"                        }else{                            return "qrc:/+.png"                        }                    }                }                Text {                    text:model.fenzuname                    anchors.centerIn: parent                }                MouseArea{                    anchors.fill: parent                    onClicked: {                        mlist.visible = !mlist.visible                        mlist.height = mlist.visible==true?mlist.contentHeight:0                    }                }            }            ListView{                clip: true                anchors.top: btn.bottom                width: parent.width                height: contentHeight                id:mlist                model:submodel                delegate:subdelegete                Component.onCompleted: {                    //为了外部能访问 让他加入全局的数组中                    Help.subModelList[index] = submodel                }            }            ListModel{                id:submodel                ListElement{name:"土鳖"}                ListElement{name:"野猫"}            }            Component{                id:subdelegete                Rectangle{                    color: "#ffffff"                    width: parent.width;height: 40;                    Text {                        text:model.name                        anchors.centerIn: parent                    }                    border.color: "#cccccc"                    border.width: index%2==0||index==model.count-1?1:0                }            }        }    }}

Help.js

var  subModelList=[];function  clearSubmodels(){    subModelList.count =0;}function  遍历(mainlistmodel){    for(var x =0;x< mainlistmodel.count;x++)    {        console.log("+"+mainlistmodel.get(x).fenzuname)        for(var y =0;y<  subModelList[x].count;y++)        {            console.log( subModelList[x].get(y).name)        }        subModelList[x].append({name:"测试"})    }}function 取指定分组子列表Model_列表名称(mainlistmodel,name){    for(var xxxx =0;xxxx< mainlistmodel.count;xxxx++)    {        if(mainlistmodel.get(xxxx).fenzuname==name)        {            console.log("ok")            return subModelList[xxxx];        }    }    console.log("erro")        return null;}

实现方式2 ,子model在父model中声明

import QtQuick 2.7import QtQuick.Controls 2.0import QtQuick.Controls 1.2  as Oldimport QtQuick.Controls.Material 2.0import QtQuick.Layouts 1.0import QtQuick.Window 2.0import QtQuick.Controls 1.4import  QtQml.Models 2.2import  "Help.js"  as  Help//Window作为最顶层元素 此时 他是我们所有子元素的父亲。ApplicationWindow{    //宽度 高度 为480*320 但是不用管它 因为在windows下 可以通过鼠标调整宽度大小    width: 1024    height: 768    visible: true    id:root    //Model    ListModel {        id: objModel        Component.onCompleted: {        }    }    // 添加一个新分组 如果存在则刷新子列表的内容 不存在则新建 addFenzu("坑货",[{name:"1"},{name:"2"}])    function  addFenzu(fenzuname,sub)    {        for(var x=0;x<objModel.count;x++)        {            if(objModel.get(x).fenzuname==fenzuname)            {                console.log("分组名字已经存在")                //如果存在此分组 只刷新subNode                 objModel.get(x).subNode = sub                return            }        }        objModel.append({"fenzuname":fenzuname,"subNode":sub})    }    //删除指定的分组 传入分组名 removeFenzu("A3")    function removeFenzu(fenzuname)    {        for(var x=0;x<objModel.count;x++)        {            if(objModel.get(x).fenzuname==fenzuname)            {                objModel.remove(x,1)                return            }        }    }//删除指定index的分组    function removeFenzuByIndex(__index)    {          objModel.remove(__index,1)    }//添加单个好友 到指定列表    addSubNode("坑货",{name:"阿央",zaixian:"yes"})    function  addSubNode(fenzuname,sub)    {        for(var x=0;x<objModel.count;x++)        {            if(objModel.get(x).fenzuname==fenzuname)            {                var subnode = objModel.get(x).subNode;                for(var y=0;y<subnode.count;y++)                {                    if(subnode.get(y).name==sub.name)                    {                        console.log("防止重复添加")                        subnode.get(y).name=sub.name;                        subnode.get(y).zaixian=sub.zaixian                        return                    }                }                subnode.append(sub)            }        }    }    //Delegate    Component {        id: objRecursiveDelegate        Rectangle{            width: parent.width            height: subview.height+titiles.height            Rectangle{                id:titiles                width: parent.width                height: 60                border.color: "#cccccc"                Text {                    id: febzu                    text:"分组:"+ model.fenzuname                    anchors.centerIn: parent                }                BorderImage {                    id: bg                    source: "qrc:/+.png"                    width: 24; height: 24                    border.left: 5; border.top: 5                    border.right: 5; border.bottom: 5                    anchors.left: parent.left                }                MouseArea{                    anchors.fill: parent                    onClicked: {                        subview.visible = !subview.visible                        if(subview.visible==true)                        {                            bg.source="qrc:/-.png"                        }else{                            bg.source="qrc:/+.png"                        }                    }                }            }            ListView{                id:subview                anchors.top: titiles.bottom                width: parent.width                visible: false                height: visible==true?contentHeight:0                model:subNode                delegate:Rectangle{                    width: parent.width                    height: 60                     border.color: "#cccccc"                    Text {                        text: model.name                        anchors.centerIn: parent                    }                }            }        }    }    //View    ListView{        id:mainlist        width: parent.width        height: parent.height - 60        model:objModel        delegate: objRecursiveDelegate    }    Button{        anchors.top: mainlist.bottom        height: 60        width: 100        text: "添加分组"        onClicked: {            removeFenzu("A3")            addFenzu("坑货",[{name:"1"},{name:"2"}])            addSubNode("坑货",{name:"阿央",zaixian:"no"})            addSubNode("坑货",{name:"阿央",zaixian:"yes"})            addSubNode("坑货",{name:"阿央2"})        }    }}
0 0