More worky-worky
- alignment & layout of content items, depending on width, still pretty rough, needs a state machine
This commit is contained in:
parent
46e2dad148
commit
3b3481292b
@ -19,31 +19,29 @@
|
|||||||
|
|
||||||
/**Documented API
|
/**Documented API
|
||||||
Inherits:
|
Inherits:
|
||||||
Label
|
Item
|
||||||
|
|
||||||
Imports:
|
Imports:
|
||||||
QtQuick 1.1
|
QtQuick 1.1
|
||||||
org.kde.plasma.components
|
org.kde.plasma.extras
|
||||||
|
|
||||||
Description:
|
Description:
|
||||||
This is a title label which uses the plasma theme.
|
This is a container for Apps. Navigation and Content area layout can
|
||||||
The characteristics of the text will be automatically set
|
vary depending on the available size.
|
||||||
according to the plasma theme. Use this components for titles
|
|
||||||
in your UI, for example page or section titles.
|
|
||||||
|
|
||||||
Properties:
|
Properties:
|
||||||
string text:
|
Item navigation: Navigation or Context Area.
|
||||||
The most important property is "text", which applies to the text property of Label
|
Item content: The "main view"
|
||||||
For the other ones see Plasma Component's Label or QML primitive Text element
|
|
||||||
|
|
||||||
Methods:
|
Methods:
|
||||||
See Plasma Component's Label and primitive QML Text element
|
|
||||||
|
|
||||||
Signals:
|
Signals:
|
||||||
See Plasma Component's Label and primitive QML Text element
|
|
||||||
**/
|
**/
|
||||||
|
|
||||||
import QtQuick 1.1
|
import QtQuick 1.1
|
||||||
|
import org.kde.plasma.core 0.1 as PlasmaCore
|
||||||
import org.kde.plasma.components 0.1 as PlasmaComponents
|
import org.kde.plasma.components 0.1 as PlasmaComponents
|
||||||
//import org.kde.plasma.extras 0.1 as PlasmaExtras
|
//import org.kde.plasma.extras 0.1 as PlasmaExtras
|
||||||
|
|
||||||
@ -56,19 +54,21 @@ Item {
|
|||||||
property int contentWidth: app.width - navigationWidth
|
property int contentWidth: app.width - navigationWidth
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
|
|
||||||
|
PlasmaCore.Theme { id: theme }
|
||||||
|
|
||||||
Image {
|
Image {
|
||||||
id: contentBackground
|
id: contentBackground
|
||||||
anchors { left: navigationBackground.right; right: parent.right; top: parent.top; bottom: parent.bottom; }
|
anchors { left: navigationBackground.right; right: parent.right; top: parent.top; bottom: parent.bottom; }
|
||||||
source: "image://appbackgrounds/standard"
|
source: "image://appbackgrounds/standard"
|
||||||
fillMode: Image.Tile
|
fillMode: Image.Tile
|
||||||
asynchronous: true
|
asynchronous: true
|
||||||
|
width: childrenRect.width
|
||||||
Item {
|
Item {
|
||||||
id: contentItem
|
id: contentItem
|
||||||
width: app.width - navigationWidth
|
width: app.width - navigationWidth - space*2
|
||||||
height: app.height
|
height: app.height
|
||||||
anchors { left: parent.left; leftMargin: space; top: parent.top; bottom: parent.bottom; right: parent.right; }
|
anchors { left: parent.left; leftMargin: space; rightMargin: space; top: parent.top; bottom: parent.bottom; right: parent.right; }
|
||||||
}
|
}
|
||||||
//onChildrenRectChanged: root.width = childrenRect.width + contentBackground.childrenRect.width
|
|
||||||
|
|
||||||
}
|
}
|
||||||
Image {
|
Image {
|
||||||
@ -82,12 +82,7 @@ Item {
|
|||||||
Item {
|
Item {
|
||||||
id: navigationItem
|
id: navigationItem
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
//anchors { left: parent.left; leftMargin: space; top: parent.top; bottom: parent.bottom; right: parent.right; }
|
|
||||||
}
|
}
|
||||||
// onChildrenRectChanged: {
|
|
||||||
// width = childrenRect.width
|
|
||||||
// print(" set navwidth to: " + width);
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
Image {
|
Image {
|
||||||
source: "image://appbackgrounds/shadow-right"
|
source: "image://appbackgrounds/shadow-right"
|
||||||
@ -99,18 +94,9 @@ Item {
|
|||||||
leftMargin: -1
|
leftMargin: -1
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Component.onCompleted: {
|
|
||||||
//setWidth(340);
|
|
||||||
}
|
|
||||||
|
|
||||||
onNavigationWidthChanged: {
|
onNavigationWidthChanged: {
|
||||||
navigationBackground.width = navigationWidth;
|
navigationBackground.width = navigationWidth;
|
||||||
navigationItem.width = navigationWidth;
|
navigationItem.width = navigationWidth;
|
||||||
}
|
}
|
||||||
|
|
||||||
// function setNavigationWidth(w) {
|
|
||||||
// navigationItem.width = w;
|
|
||||||
// navigationWidth = w;
|
|
||||||
// }
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user