← Back to branch summary

~aacid/unity-2d/DoNotHideLauncherImmediatellyOnIconRemoval_884410

« back to all changes in this revision

Viewing changes to places/RendererGrid.qml

  • Committer: Tarmac
  • Author(s): Renato Araujo Oliveira Filho, Florian Boucault
  • Date: 2011-11-22 18:20:16 UTC
  • mfrom: (768.5.42 places-rewrite)
  • Revision ID: tarmac-20111122182016-zyuclvankjf11dfo
[places] Rewrite RenderGrid to use only one Flickable element

* Created FocusPath element to help in the keyboard navigation;
* The code used to manually scroll the grid was removed, now everything is done by the QML Flickable element;
* This new implementation of RenderGrid allows every component be inside of this scroller, which makes the grid more flexible for moving elements around, helping in the implementation of Preview screen;

Show diffs side-by-side

added added

removed removed

Lines of Context:
places/RendererGrid.qml
29
29
    id: renderer
30
30
 
31
31
    needHeader: true
32
 
    property alias cellsPerRow: results.cellsPerRow
33
 
    property alias contentY: results.contentY
34
 
    property alias currentItem: results.currentItem
 
32
    currentItem: focusPath.currentItem
35
33
 
 
34
    property int contentHeight: grid.height + grid.anchors.topMargin + grid.anchors.bottomMargin
 
35
    property alias cellsPerRow: grid.columns
36
36
    property variant cellRenderer
37
37
    property bool folded: true
38
 
 
39
38
    property int cellWidth: 158
40
39
    property int cellHeight: 76
41
 
    property int horizontalSpacing: 26
42
 
    property int verticalSpacing: 26
43
 
 
44
 
    /* FIXME: using results_layout.anchors.topMargin in the following expression
45
 
              causes QML to think they might be an anchor loop. */
46
 
    property int totalHeight: results.count > 0 ? results_layout.anchors.topMargin + results.totalHeight : 0
47
 
 
48
 
    Item {
49
 
        id: results_layout
50
 
 
51
 
        anchors.fill: parent
52
 
        anchors.topMargin: 12
 
40
 
 
41
    property int minHorizontalSpacing: 26
 
42
    property int minVerticalSpacing: 26
 
43
 
 
44
    property bool centered: true
 
45
 
 
46
    FocusPath {
 
47
        id: focusPath
 
48
 
 
49
        item: grid
 
50
        columns: grid.columns
 
51
    }
 
52
 
 
53
    Grid {
 
54
        id: grid
 
55
 
 
56
        columns: Math.floor(parent.width/(renderer.cellWidth + renderer.minHorizontalSpacing))
 
57
        anchors.top: parent.top
 
58
        anchors.left: parent.left
 
59
        anchors.right: parent.right
 
60
        anchors.bottomMargin: 12
53
61
        anchors.leftMargin: 2
54
62
 
55
 
        CenteredGridView {
 
63
        property int itemHorizontalSpacing: renderer.centered ? Math.floor(renderer.width / columns - renderer.cellWidth) : renderer.minHorizontalSpacing
 
64
        Repeater {
56
65
            id: results
57
66
 
58
 
            focus: true
59
 
 
60
 
            anchors.fill: parent
61
 
 
62
 
            property int totalHeight: results.cellHeight*Math.ceil(count/cellsPerRow)
63
 
 
64
 
            minHorizontalSpacing: renderer.horizontalSpacing
65
 
            minVerticalSpacing: renderer.verticalSpacing
66
 
            delegateWidth: renderer.cellWidth
67
 
            delegateHeight: renderer.cellHeight
68
 
 
69
 
            interactive: false
70
 
            clip: true
71
 
 
72
 
            delegate: FocusScope {
73
 
 
74
 
                width: results.cellWidth
75
 
                height: results.cellHeight
 
67
            FocusPath.skip: true
 
68
 
 
69
            FocusScope {
 
70
                id: cell
 
71
 
 
72
                width: renderer.cellWidth + grid.itemHorizontalSpacing
 
73
                height: renderer.cellHeight + renderer.minVerticalSpacing
76
74
                /* When hovered the item needs to be on top of every other item
77
75
                   in order for its label to not be covered */
78
76
                z: ( loader.item.state == "selected" || loader.item.state == "hovered" ) ? 1 : 0
79
77
 
 
78
                FocusPath.index: index
 
79
 
 
80
                property string uri: column_0
 
81
                property string iconHint: column_1
 
82
                property string categoryId: column_2 // FIXME: rename to categoryIndex
 
83
                property string mimetype: column_3
 
84
                property string displayName: column_4 // FIXME: rename to name
 
85
                property string comment: column_5
 
86
                property string dndUri: column_6
 
87
 
80
88
                Loader {
81
89
                    id: loader
82
 
                    property string uri: column_0
83
 
                    property string iconHint: column_1
84
 
                    property string categoryId: column_2 // FIXME: rename to categoryIndex
85
 
                    property string mimetype: column_3
86
 
                    property string displayName: column_4 // FIXME: rename to name
87
 
                    property string comment: column_5
88
 
                    property string dndUri: column_6
89
90
 
90
 
                    width: results.delegateWidth
91
 
                    height: results.delegateHeight
 
91
                    focus: true
 
92
                    width: renderer.cellWidth
 
93
                    height: renderer.cellHeight
92
94
                    anchors.horizontalCenter: parent.horizontalCenter
 
95
                    anchors.verticalCenter: parent.verticalCenter
93
96
 
94
 
                    focus: true
95
97
                    sourceComponent: cellRenderer
96
98
                    onLoaded: {
97
99
                        item.uri = uri
108
110
            /* Only display one line of items when folded */
109
111
            model: SortFilterProxyModel {
110
112
                model: renderer.category_model != undefined ? renderer.category_model : null
111
 
                limit: folded ? results.cellsPerRow : -1
 
113
                limit: renderer.folded ? grid.columns : -1
112
114
            }
113
115
        }
114
116
    }