[SailfishDevel] SilicaFlickable, Column, SilicaListView
Dmitriy Purgin
dpurgin at gmail.com
Sun May 24 17:28:37 UTC 2015
Прив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>
More information about the Devel
mailing list