当前位置:首页 > 芯闻号 > 充电吧
[导读]Qt Quick中的ListView初学 ListView 3要素: model : 负责每一个行的 数据 delegate:负责每一个行的 外观 3.与外界如何交互,删除和添加数据(通过m

Qt Quick中的ListView初学

ListView 3要素:

model : 负责每一个行的 数据 delegate:负责每一个行的 外观
3.与外界如何交互,删除和添加数据(通过model和js)

通过JavaScript控制边线,0,2,4,6…..才显示边框,用来显示每一行的界限,界限颜色用Qt自带的函数就可以了
JavaScript代码:
Myhelp.js


.pragma library

function 求余数(date) {


    var ret =date%2;
      console.log("余数:"+ret);
    if(ret==0)
    {
        return 1;
    }



    return 0;

}
Window {
    visible: true
    width: 240;
    height: 320;
    //导出listview的model 供按钮使用 由于在一个文件中,不需要了
    ListView{
            id:list_view;
            anchors.left: parent.left;
            anchors.top: parent.top;
            width: parent.width;
            height: 180;
            model:m_listmodel;
            delegate:delegete1;
    }

    //ListView的model
    ListModel{
        id:m_listmodel;//model对象中 有数组ListElement 存储所有的列表数据对象
        ListElement{name:"hello"}
    }

      //listview的代理
    Component{
           id:delegete1;
           Rectangle{
                width: parent.width;
                height: 40;
                color: "#4b3b3b"
                border.color: Qt.lighter(color) //颜色暗淡些 不然显得有点粗
                //当序号为2的倍数才有边框用来分割
                border.width: MyHELP.求余数(index);
                Text {
                    anchors.fill: parent;
                    id: m_txt;
                    color: "#f3e3e3"
                    text:name+"序号"+index;
                    font.family: "Consolas"
                    font.pointSize: 14
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                }

           }
    }

    //新建按钮用来测试
    Button{
        id:m_btn;
        anchors.top: list_view.bottom;
        anchors.left:parent.left;
        width: parent.width;
        height: 40;
        text: qsTr("添加");
        onClicked: {
            m_listmodel.append({name:qsTr(m_input.text)});
        }

    }


    Button{
        id:m_delete;
        anchors.top: m_btn.bottom;
        anchors.left:parent.left;
        width: parent.width;
        height: 40;
        text: qsTr("删除");
        onClicked: {
            m_listmodel.remove(m_input.text,1);//删除指定的项 第二个参数:删除个数 1就行了不然乱
        }

    }


    TextInput{

        id:m_input;
        horizontalAlignment: Text.AlignHCenter
        font.pointSize: 14
        anchors.left:m_delete.left;
        anchors.top: m_delete.bottom;
        height: 40;
        width: parent.width;
        color: "#c69191"
        autoScroll: true;
        text: qsTr("请输入")

    }

}

本站声明: 本文章由作者或相关机构授权发布,目的在于传递更多信息,并不代表本站赞同其观点,本站亦不保证或承诺内容真实性等。需要转载请联系该专栏作者,如若文章内容侵犯您的权益,请及时联系本站删除。
换一批
延伸阅读

摘 要 :为解决制鞋行业中喷胶精度不高、灵活性差、生产效率低的问题,设计一种基于机器视觉的鞋模喷胶系统。该系统硬件由工业摄像头、工控机及路由器构成,软件则采用图像识别库 OpenCV 与图形界面应用程序开发框架 Qt 编...

关键字: 机器视觉 图像处理 鞋模 喷胶 OpenCV QT

嵌入式系统是指以应用为中心、以计算机技术为基础,软件硬件可裁剪、适应应用系统对功能、可靠性、成本、体积、功耗严格要求的专用计算机系统。

关键字: QT 嵌入式 C++

摘 要:仓储作为物流与供应链的核心环节,对食品安全的控制起着至关重要的作用。温湿度是影响粮食仓储过程安全与品质的重要因素。文中使用无线传感网络进行数据采集,通过Qt平台设计软件系统,并借助数据库进行数据存储与分析处理,实...

关键字: 成品粮 仓储 温湿度监测 无线传感网络 QT

在此部件上绘制行号,并将其放置在CodeEditor的viewport()的左边距区域上,QWidget类也可以帮助我们对其内容进行滚动。

关键字: QT 代码编辑器

不管是Qt新手还是开发过qt的群体来说,对Qt Designer、Qt Quick Designer、Qt Creator这几个应用程序肯定是熟悉的。

关键字: QT IDE C

在当今社会,人们的生活水平普遍提高,工作强度越来越大,营养的过剩和运动量的减少,导致心脑血管疾病的发病率是越来越高。

关键字: Linux QT GPRS 远程集群式 心脏病人实时诊断系

qt值得学习吗? 嵌入式要学的东西真的很多,我们可能会说不写界面的话就不用学qt了?我不赞同。

关键字: 嵌入式 QT UI

什么是qt?简单点说,Qt 就是一个跨平台的 C++ 图形用户界面库,可以同时支持桌面应用程序开发、嵌入式开发和移动开发,覆盖了现有的所有主流平台。

关键字: QT 程序 开发

qt值得学习吗? 嵌入式要学的东西真的很多,我们可能会说不写界面的话就不用学qt了?我不赞同,原因是……

关键字: 嵌入式 QT

摘要Qt是欧洲人创始的一个优秀的C++开发框架,API简单易用,社区庞大,资源丰富;但Qt太重量级了(需要很多的RAM和ROM,非常复杂)。为了解决这个问题,我开发了GOSP这个框架。GOSP在不依赖

关键字: QT 开发
关闭
关闭