[SailfishDevel] SilicaFlickable, Column, SilicaListView

[Dmitriy Purgin]

Привiт, Вiталiй!

If want to have something like a toolbar at the bottom of the list, I'd go
with DockedPanel [1]. I guess it's the preferred way of doing it. But you
can also do this by setting list view height explicitly if you do it in
column or anchoring. Consider the following code, it lays out a header and
a button at top and bottom of page respectively, and a list view in the
middle:

Page {
    id: page

    SilicaFlickable {
        anchors.fill: parent

        // test pull down menu
        PullDownMenu {
            MenuItem {
                text: 'Item 1'
            }
        }

        // test push up menu
        PushUpMenu {
            MenuItem {
                text: 'Item 2'
            }
        }

        // set this explicitly, otherwise you will have
        // weird problems with push and pull menus
        contentHeight: column.height

        Column {
            id: column

            anchors.fill: parent

            PageHeader {
                id: header

                anchors.left: parent.left
                anchors.right: parent.right

                title: 'Header'
            }

            SilicaListView {
                id: listView

                // fill all the space between header and button
                height: page.height - header.height - button.height

                anchors.left: parent.left
                anchors.right: parent.right

                // this is needed so that the list elements
                // do not overlap with other controls in column
                clip: true

                model: 20

                delegate: ListItem {
                    anchors.left: parent.left
                    anchors.right: parent.right

                    Label {
                        width: parent.width
                        height: parent.height

                        text: model.modelData
                    }
                }
            }

            Button {
                id: button

                anchors.horizontalCenter: parent.horizontalCenter

                text: 'Button'
            }
        }
    }
}

If you'd do this using anchoring, you should set contentHeight to sum of
all the elements included to flickable.

Please note that if you would set a view that wouldn't fit to screen (by
setting listView.height to something larger than the expression in the
sample code), you would have to either scroll the list all the way up or
down for the menus or begin dragging outside the list.

Cheers
Dmitriy

[1]
https://sailfishos.org/develop/docs/silica/qml-sailfishsilica-dockedpanel.html/


2015-05-23 22:57 GMT+06:00 Віталій Коренєв <nemish94 at gmail.com>:

> I'm just starting to learn qml, and there are many questions.
> I have
>     XmlListModel {
>         id: listModel
>         query: "/ colors / color"
>         XmlRole {name: "id"; query: "id / string ()"}
>         XmlRole {name: "title"; query: "title / string ()"}
> ...
>     }
>
>     SilicaFlickable {
>         anchors.fill: parent
>
>         Column
>         {
>             width: parent.width; height: parent.height
>             id: mainContainer
>
>             SilicaListView
>             {
>                 width: parent.width; height: parent.height
>                 id: list
>                 model: listModel
>                 delegate: BackgroundItem {
>                     width: parent.width; height: 120
>                     Image {
>                         source: imageUrl
>                         anchors.fill: parent
>                     }
>                     Label {text: title}
>                 }
>                 VerticalScrollDecorator {}
>             }
>         }
>     }
>
> How can I add other elements (buttons, labels ...) after all elements of
> SilicaListView, if its height: parent.height. If you remove line height:
> parent.height for SilicaListView, it is not displayed. There have been
> attempts to add other elements before VerticalScrollDecorator {} and other
> places (experimenting with anchors), but the added elements were in the
> upper left corner of the screen or on the last 10 points of the screen
> (under SilicaListView).
>
> Sorry for my English.
> PS. This is the only way to get or give help when working with qml +
> Silica? No forum for developers Sailfish?
>
> _______________________________________________
> SailfishOS.org Devel mailing list
> To unsubscribe, please send a mail to
> devel-unsubscribe at lists.sailfishos.org
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.sailfishos.org/pipermail/devel/attachments/20150524/77d0dd91/attachment-0001.html>