plasma-framework/declarativeimports/plasmacomponents/qml/ListItem.qml

132 lines
4.4 KiB
QML
Raw Normal View History

2011-10-31 16:41:43 +01:00
/*
* Copyright 2010 Marco Martin <notmart@gmail.com>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU Library General Public License as
* published by the Free Software Foundation; either version 2, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Library General Public License for more details
*
* You should have received a copy of the GNU Library General Public
* License along with this program; if not, write to the
* Free Software Foundation, Inc.,
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
2012-01-10 21:39:18 +01:00
/**Documented API
Inherits:
Item
Imports:
org.kde.plasma.core
QtQuick 1.0
Description:
An item delegate for the primitive ListView component. It's intended to make all listview look coherent
Properties:
* bool checked:
If true makes the list item look as checked or pressed. It has to be set from the code, it won't change by itself.
* bool sectionDelegate:
If true the item will be a delegate for a section, so will look like a "title" for the otems under it.
* bool enabled:
Holds if the item emits signals related to mouse interaction.
The default value is false.
2012-01-10 21:39:18 +01:00
Signals:
* clicked():
This handler is called when there is a click.
This is disabled by default, use enable property to activate it.
2012-01-10 21:39:18 +01:00
* pressAndHold():
The user pressed the item with the mouse and didn't release it for a certain amount of time.
This is disabled by default, use enable property to activate it.
2012-01-10 21:39:18 +01:00
**/
2011-10-31 16:41:43 +01:00
import QtQuick 1.0
import org.kde.plasma.core 0.1 as PlasmaCore
Item {
id: listItem
default property alias content: paddingItem.data
//this defines if the item will emit clicked and look pressed on mouse down
property alias enabled: itemMouse.enabled
2011-10-31 16:41:43 +01:00
//item has been clicked or pressed+hold
signal clicked
signal pressAndHold
//plasma extension
//always look pressed?
property bool checked: false
//is this to be used as section delegate?
property bool sectionDelegate: false
width: parent.width
height: paddingItem.childrenRect.height + background.margins.top + background.margins.bottom
property int implicitHeight: paddingItem.childrenRect.height + background.margins.top + background.margins.bottom
Connections {
target: listItem
onCheckedChanged: background.prefix = (listItem.checked ? "pressed" : "normal")
onSectionDelegateChanged: background.prefix = (listItem.sectionDelegate ? "section" : "normal")
}
2011-10-31 16:41:43 +01:00
PlasmaCore.FrameSvgItem {
id : background
imagePath: "widgets/listitem"
prefix: "normal"
anchors.fill: parent
opacity: itemMouse.containsMouse ? 0.5 : 1
2011-10-31 16:41:43 +01:00
Component.onCompleted: {
prefix = (listItem.sectionDelegate ? "section" : (listItem.checked ? "pressed" : "normal"))
}
Behavior on opacity { NumberAnimation { duration: 200 } }
2011-10-31 16:41:43 +01:00
}
PlasmaCore.SvgItem {
svg: PlasmaCore.Svg {imagePath: "widgets/listitem"}
elementId: "separator"
anchors {
left: parent.left
right: parent.right
top: parent.top
}
height: naturalSize.height
visible: listItem.sectionDelegate || (index != undefined && index > 0 && !listItem.checked && !itemMouse.pressed)
}
MouseArea {
id: itemMouse
property bool changeBackgroundOnPress: !listItem.checked && !listItem.sectionDelegate
anchors.fill: background
enabled: false
hoverEnabled: true
2011-10-31 16:41:43 +01:00
onClicked: listItem.clicked()
onPressAndHold: listItem.pressAndHold()
onPressed: if (changeBackgroundOnPress) background.prefix = "pressed"
onReleased: if (changeBackgroundOnPress) background.prefix = "normal"
onCanceled: if (changeBackgroundOnPress) background.prefix = "normal"
}
Item {
id: paddingItem
anchors {
fill: background
leftMargin: background.margins.left
topMargin: background.margins.top
rightMargin: background.margins.right
bottomMargin: background.margins.bottom
}
}
}