QML JSON 展示

1 import QtQuick 1.0
2
3 Rectangle {
4 width: 600
5 height: 400
6
7 Rectangle {
8 id: topInput
9 height: 20 ; width: parent.width;
10 anchors.top: parent.top;z: 2 ;
11
12 Rectangle {
13 id: jsonTxt
14 border.color: " black " ; border.width: 1
15 width: parent.width - 50 ; height: 20 ;
16
17 TextInput {
18 id: textContent;
19 width: parent.width;
20 anchors.left: parent.left;
21 anchors.verticalCenter: parent.verticalCenter;
22 text: " {\"name\":\"gibbon\",\"age\":18,\"work\":{\"locate\":\"Beijing\",\"content\":\"progammer\"}} "
23 }
24 }
25
26 Rectangle {
27 border.color: " black " ; border.width: 1
28 width: 40 ; height: 20 ; color: " red "
29 anchors.left: jsonTxt.right; anchors.leftMargin: 5 ;
30
31 Text {
32 text: " Click " ;
33 anchors.centerIn: parent;
34 }
35
36 MouseArea {
37 anchors.fill: parent;
38 onClicked: {
39 console.log( " do the work```` " );
40 doTheWork(textContent.text)
41 }
42 }
43 }
44 }
45
46 Rectangle {
47 id: bottomOutput
48 width: parent.width; height: parent.height - topInput.height - 5 ;
49 color: " white " ; anchors.bottom: parent.bottom;
50
51 ListView {
52 id: dataShow;
53 width: parent.width; height: parent.height;
54 model: dataSource;
55 delegate: Component {
56 id: theDelegate;
57 Item {
58 width: 200 ; height: 30
59 Row {
60 spacing: 10
61 width: 200 ; height: 30
62 Text { text: path; color: " red " }
63 Text { text: type; color: " blue " }
64 Text { text: value; color: " black " }
65 }
66 }
67 }
68
69 ListModel {
70 id: dataSource
71 }
72
73 }
74 }
75
76
77
78 function getJsonContent(path, obj) {
79 for ( var p in obj) {
80 if ( typeof (obj[p]) === " object " ) {
81 dataSource.append({path:path + " . " + p,type: typeof (obj[p]),value: " OBJECT " });
82 getJsonContent(path + " . " + p,obj[p]);
83 } else {
84 dataSource.append({path:path + " . " + p,type: typeof (obj[p]),value:obj[p]});
85 }
86 }
87 }
88
89 function doTheWork(str) {
90 console.log(str);
91 var jsonObj = eval( " ( " + str + " ) " );
92
93 if (jsonObj) {
94 dataSource.clear();
95 getJsonContent( " obj " ,jsonObj);
96 }
97
98 }
99 }

转载于:https://www.cnblogs.com/gibbon/archive/2011/05/06/2038742.html