2013-04-07 93 views
2

我是QT新手,我學會了通過連接列表模型來使用網格視圖。我想限制有效觀看圖像只是4而不是在列表模型中的所有項目Qt QML Gridview如何限制顯示的項目?

Rectangle { 
    id: Rect1; 
    width: 1280; height: 720; 

    ListModel { 

    id: listAssetModel 
     ListElement { Movie: "Arrow"; PosterURL: "posters/Arrow.jpg" } 
     ListElement { Movie: "Avatar"; PosterURL: "posters/Avatar.jpg" } 
     ListElement { Movie: "Avenge"; PosterURL: "posters/Avenge.jpg" } 
     ListElement { Movie: "Arrow"; PosterURL: "posters/Arrow.jpg" } 
     ListElement { Movie: "Avatar"; PosterURL: "posters/Avatar.jpg" } 
     ListElement { Movie: "Avenge"; PosterURL: "posters/Avenge.jpg" } 
     ListElement { Movie: "Arrow"; PosterURL: "posters/Arrow.jpg" } 
     ListElement { Movie: "Avatar"; PosterURL: "posters/Avatar.jpg" } 
     ListElement { Movie: "Avenge"; PosterURL: "posters/Avenge.jpg" }  
    } 

    GridView { 
    id: gridAssetPreview; 
    currentIndex: -1 // default - no focus on poster 
    x: 56; y: 189 
    width: 1140; height: 300 
    focus: true 
    cellWidth: 275; cellHeight: 300 // keeps the poster preview images aligned 
    highlight: appHighlight 
    model: listAssetModel 
    delegate: appDelegate 
    } 

    Component { 
    id: appDelegate 

    Item { 
     width: 250; height: 350 // controls the appHighlight size 

     Image { 
     id: imgPosterPreview 
     width: 225; height: 325 
     source: PosterURL 
     smooth: true 
     } 
     Text { 
     id: textAssetName 
     anchors { // draw this below and centre to the image 
      top: imgPosterPreview.bottom; 
      horizontalCenter: imgPosterPreview.horizontalCenter 
     } 
     text: AssetName 
     font.pointSize: 16 
     color:"white" 
     smooth: true 
     } 
    } 
    } 
} 

網格視圖區域被定義爲以下的,但似乎上運行它顯示圖像的多個行這是不我期望的東西。我只想在整個1280 x 720屏幕上只看到4個圖像。 寬度:1140;身高:300

請幫幫忙,即時通訊堅持這個我星期天:-(

+3

固定夾:真正的下一行是可見的,因爲他們是正確的邊界和QtQuick元素在默認情況下不會被剪輯。 – MartinJ 2013-04-08 09:17:14

+0

@MartinJ謝謝你的回答。是的,我最終只在一行中看到了只有幾個項目,但麻煩的是,如果我滾動,我看到圖像來自下一排,而不是來自右側,我的意思是說,第一行顯示第一行,然後是下一行,而不是將所有內容保存在一行,並管理項目的可見性4自動。 – rajeshk 2013-04-17 11:24:33

回答

0

添加到你的GridView:

flow: GridView.TopToBottom