格式化表格(Formatting the Table)

城市数据的内容应该被现实在一个表格中。我们使用TableView
控制并定义4列:城市,国家,面积,人口。每一列都是典型的TableViewColumn。然后我们添加列的标识并移除要求自定义列代理的操作。

  1. TableView {
  2. id: view
  3. anchors.fill: parent
  4. TableViewColumn {
  5. role: 'city'
  6. title: "City"
  7. width: 120
  8. }
  9. TableViewColumn {
  10. role: 'country'
  11. title: "Country"
  12. width: 120
  13. }
  14. TableViewColumn {
  15. role: 'area'
  16. title: "Area"
  17. width: 80
  18. }
  19. TableViewColumn {
  20. role: 'population'
  21. title: "Population"
  22. width: 80
  23. }
  24. }

现在应用程序能够显示一个包含文件菜单的菜单栏和一个包含4个表头的空表格。下一步是我们的FileIO扩展将有用的数据填充到表格中。

格式化表格(Formatting the Table) - 图1

文档cities.json是一组城市条目。这里是一个例子。

  1. [
  2. {
  3. "area": "1928",
  4. "city": "Shanghai",
  5. "country": "China",
  6. "flag": "22px-Flag_of_the_People's_Republic_of_China.svg.png",
  7. "population": "13831900"
  8. },
  9. ...
  10. ]

我们任务是允许用户选择文件,读取它,转换它,并将它设置到表格视图中。