QML GridView 모델을 자바 스크립트로 변경하십시오.

Question

하나의 ListView와 하나의 GridView가 있습니다. 첫 번째 뷰는 카테고리를 표시하고 두 번째 뷰는 각 카테고리의 기사를 표시합니다. ListView의 현재 인덱스가 javascript로 변경 될 때 GridView의 데이터 모델을 동적으로 변경하려고합니다. 어떻게해야합니까?

Answer 1

새 모델을 지정하기 만하면됩니다. 다음은 ListModel 문서를 기반으로하는 한 가지 예입니다. 이 모델은 왼쪽의 ListView에서 모델의 과일을 보여줍니다. 델리게이트를 클릭하면 오른쪽의 GridView 모델이 attributes 롤에 정의 된 목록으로 설정됩니다.

import QtQuick 1.0 

Item { 
    width: 600; height: 400 

    ListView { 
     width: 300; height: 400 
     model: fruitModel 
     delegate: Text { 
      font.pixelSize: 20 
      text: name 
      width: 300 
      MouseArea { 
       anchors.fill: parent 
       onClicked: grid.model = attributes 
      } 
     } 
    } 

    GridView { 
     id: grid 
     x: 300; width: 300; height: 400 
     delegate: Text { 
      text: description 
      font.pixelSize: 20 
     } 
    } 

    ListModel { 
    id: fruitModel 

    ListElement { 
     name: "Apple" 
     cost: 2.45 
     attributes: [ 
      ListElement { description: "Core" }, 
      ListElement { description: "Deciduous" } 
     ] 
    } 
    ListElement { 
     name: "Orange" 
     cost: 3.25 
     attributes: [ 
      ListElement { description: "Citrus" } 
     ] 
    } 
    ListElement { 
     name: "Banana" 
     cost: 1.95 
     attributes: [ 
      ListElement { description: "Tropical" }, 
      ListElement { description: "Seedless" } 
     ] 
    } 
    } 
} 

이것은 중첩 모델의 예이지만 다른 가능성도 있습니다. 예를 들어 데이터베이스에서 데이터를 소싱하는 경우 다른 모델을 설정하는 대신 GridView의 모델에서 사용하는 쿼리 만 변경하면됩니다.

Answer 2

모델에 따라 다릅니다. CategoriesModel 가정 category 역할을하고, ArticlesModel는 setCategory 방법이 있습니다

ListView { 
    model: CategoriesModel {} 
    delegate: Item { 
     MouseArea { 
      anchors.fill: parent 
      onClicked: { 
       grid_view.model.setCategory(model.category) 
      } 
     } 
     // ... 
    } 
} 

GridView { 
    id: grid_view 
    model: ArticlesModel {} 
    // ... 
} 

을