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

最新推荐文章于 2022-06-17 20:44:43 发布

A289672082

最新推荐文章于 2022-06-17 20:44:43 发布

阅读量3.1k

点赞数

分类专栏： Qt Quick 文章标签： listview QtQuick

本文链接：https://blog.csdn.net/A289672082/article/details/51747772

版权

Qt Quick 专栏收录该内容

47 篇文章 0 订阅

订阅专栏

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Controls 1.2  as Old
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.0
import QtQuick.Window 2.0
import QtQuick.Controls 1.4
import  QtQml.Models 2.2
import  "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.7
import QtQuick.Controls 2.0
import QtQuick.Controls 1.2  as Old
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.0
import QtQuick.Window 2.0
import QtQuick.Controls 1.4
import  QtQml.Models 2.2
import  "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"})
        }

    }


}

A289672082

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
QtQuick 全局变量解决ListView嵌套子ListView中访问子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.4
复制链接

扫一扫