I think your best bet is to use your Skin as a component, then have your
Interface assign settings from the component. Then just change out the Skin
component file as needed. (Rename files to change skins)
________________________________
From: Srikanth <[email protected]>
To: [email protected]
Sent: Tue, April 26, 2011 3:36:29 AM
Subject: [Qt-qml] How to do skinning in QML
So that would say that there is no chance of applying skinning via QSS files.
Correct me if I am wrong.
-Srikanth
>---------- Forwarded message ----------
>From: Srikanth <[email protected]>
>To: [email protected]
>Date: Mon, 25 Apr 2011 21:34:36 +0530
>Subject: [Qt-qml] How to do skinning in QML
>Hi,
>
>I have a simple qml item like
>
>Rectangle{
> id: myRect
> width: 360; height: 80
> color: "white" // this color should be skinned dynamically using qss
> //...
>}
>
>My requirement is that for different clients the color of the rect changes.
>This
>can be perfectly done using qss in a QWidget based approach, where we generate
>a
>qss specific to the client's requirement. Is there a way in which I can use
>qss
>or css to do styling in QML. I hope there should be one, but I need the best
>practice to achieve this.
>
>Thanks,
>Srikanth
>
>
>
>
>---------- Forwarded message ----------
>From: Girish Ramakrishnan <[email protected]>
>To: Srikanth <[email protected]>
>Date: Mon, 25 Apr 2011 21:54:24 +0530
>Subject: Re: [Qt-qml] How to do skinning in QML
>Hi Srikanth,
>
>On Mon, Apr 25, 2011 at 9:34 PM, Srikanth <[email protected]> wrote:
>> Hi,
>>
>> I have a simple qml item like
>>
>> Rectangle {
>>
>> id: myRect
>>
>> width: 360; height: 80
>>
>> color: "white" // this color should be skinned dynamically using qss
>>
>> //...
>>
>> }
>>
>> My requirement is that for different clients the color of the rect changes.
>> This can be perfectly done using qss in a QWidget based approach, where we
>> generate a qss specific to the client's requirement. Is there a way in which
>> I can use qss or css to do styling in QML. I hope there should be one, but I
>> need the best practice to achieve this.
>>
>
>If your skin is simply about switching colors and images, you can
>expose a "Skin" QObject using QDeclarativeEngine::setContextProperty.
>The Skin class can contain various properties that QML can bind to.
>See QDeclarativePropertyMap that might help you create this "Skin"
>Object.
>
>(eg) Rectangle { id: myRect; color: skin.myRectColor } // skin is C++
>object with property myRectColor
>
>For more complex skins, you can just create a separate qml for each client.
>
>Girish
>
>
>
>---------- Forwarded message ----------
>From: Owen Zhao <[email protected]>
>To: [email protected]
>Date: Tue, 26 Apr 2011 09:55:36 +0800
>Subject: [Qt-qml] The two transitions have the same result. But I think it
>shouldn't.
>Hi all,
>I am learning the Qt Essentials(QML Version) by myself. And something in
>transitions is confusing me.
>In the pdf I download from nokia website, it says.
>
>transitions: [
>>Transition {
>>from: "stop"; to: "go"
>>PropertyAnimation {
>>target: stop_light
>>properties: "color"; duration: 1000
>>}
>>},
>>Transition {
>>from: "go"; to: "stop"
>>PropertyAnimation {
>>target: go_light
>>properties: "color"; duration: 1000
>>}
>>} ]
>>
is the same as
transitions: [
>Transition {
>from: "*"; to: "*"
>PropertyAnimation {
>target: stop_light
>properties: "color"; duration: 1000
>}
>PropertyAnimation {
>target: go_light
>properties: "color"; duration: 1000
>}
>} ]
>
And when I run the code in qmlviewer, they do do the same thing.(full code is
provided at the bottom of this email) However, I believe they shouldn't be the
same. As in the first code when transitioning from the "stop" to "go" state,
the
target is only the "stop_light", and in the second code when transition accurs,
both the "stop_light" and "go_light" are targets.
Am I wrong or there is something I misunderstood?
The full qml file code here:
import QtQuick 1.0
>
>Rectangle {
> width: 150; height: 250
>
> Rectangle {
> id: stopLight
> x: 25; y: 15; width: 100; height: 100
> }
> Rectangle {
> id: goLight
> x: 25; y: 135; width: 100; height: 100
> }
>
> states: [
> State {
> name: "stop"
> PropertyChanges { target: stopLight; color: "red" }
> PropertyChanges { target: goLight; color: "black" }
> },
> State {
> name: "go"
> PropertyChanges { target: stopLight; color: "black" }
> PropertyChanges { target: goLight; color: "green" }
> }
> ]
>
> state: "stop"
>
> MouseArea {
> anchors.fill: parent
> onClicked: parent.state == "stop" ?
> parent.state = "go" : parent.state = "stop"
> }
>
> transitions: [
> Transition {
> from: "*"; to: "*"
> PropertyAnimation {
> target: stopLight
> properties: "color"; duration: 1000
> }
> PropertyAnimation {
> target: goLight
> properties: "color"; duration: 1000
> }
> } ]
>
>
>}
>
>--
Owen Zhao
---------- Forwarded message ----------
From: <[email protected]>
To: <[email protected]>, <[email protected]>
Date: Tue, 26 Apr 2011 03:49:05 +0000
Subject: Re: [Qt-qml] The two transitions have the same result. But I think
it shouldn't.
They actually turn on (red/blue) immediately. Only when the reversible is set
it
will be the same.
--Kuifei
importQtQuick1.0
Rectangle{
width:150;height:250
Rectangle{
id:stopLight
x:25;y:15;width:100;height:100
}
Rectangle{
id:goLight
x:25;y:135;width:100;height:100
}
states:[
State{
name:"stop"
PropertyChanges{target: stopLight;color:"red"}
PropertyChanges{target: goLight;color:"black" }
},
State{
name:"go"
PropertyChanges{target: stopLight;color:"black" }
PropertyChanges{target: goLight;color:"green" }
}
]
MouseArea{
anchors.fill:parent
onClicked:parent.state=="stop" ?
parent.state="go":parent.state="stop"
}
// transitions:[
// Transition{
// from:"*";to:"*"
// PropertyAnimation{
// target:stopLight
// properties:"color";duration:5000
// }
// PropertyAnimation{
// target:goLight
// properties:"color";duration:5000
// }
// }]
transitions:[
Transition{
from:"stop"; to:"go"
reversible: true
PropertyAnimation{
target:stopLight
properties:"color"; duration:5000
}
},
Transition{
from:"go";to:"stop"
reversible: true
PropertyAnimation{
target:goLight
properties:"color"; duration:5000
}
}
]
}
From:[email protected]
[mailto:[email protected]] On Behalf Of ext Owen
Zhao
Sent: 2011年4月26日9:56
To: [email protected]
Subject: [Qt-qml] The two transitions have the same result. But I think it
shouldn't.
Hi all,
I am learning the Qt Essentials(QML Version) by myself. And something in
transitions is confusing me.
In the pdf I download from nokia website, it says.
transitions: [
Transition {
from: "stop"; to: "go"
PropertyAnimation {
target: stop_light
properties: "color"; duration: 1000
}
},
Transition {
from: "go"; to: "stop"
PropertyAnimation {
target: go_light
properties: "color"; duration: 1000
}
} ]
is the same as
transitions: [
Transition {
from: "*"; to: "*"
PropertyAnimation {
target: stop_light
properties: "color"; duration: 1000
}
PropertyAnimation {
target: go_light
properties: "color"; duration: 1000
}
} ]
And when I run the code in qmlviewer, they do do the same thing.(full code is
provided at the bottom of this email) However, I believe they shouldn't be the
same. As in the first code when transitioning from the "stop" to "go" state,
the target is only the "stop_light", and in the second code when transition
accurs, both the "stop_light" and "go_light" are targets.
Am I wrong or there is something I misunderstood?
The full qml file code here:
import QtQuick 1.0
Rectangle {
width: 150; height: 250
Rectangle {
id: stopLight
x: 25; y: 15; width: 100; height: 100
}
Rectangle {
id: goLight
x: 25; y: 135; width: 100; height: 100
}
states: [
State {
name: "stop"
PropertyChanges { target: stopLight; color: "red" }
PropertyChanges { target: goLight; color: "black" }
},
State {
name: "go"
PropertyChanges { target: stopLight; color: "black" }
PropertyChanges { target: goLight; color: "green" }
}
]
state: "stop"
MouseArea {
anchors.fill: parent
onClicked: parent.state == "stop" ?
parent.state = "go" : parent.state = "stop"
}
transitions: [
Transition {
from: "*"; to: "*"
PropertyAnimation {
target: stopLight
properties: "color"; duration: 1000
}
PropertyAnimation {
target: goLight
properties: "color"; duration: 1000
}
} ]
}
--
Owen Zhao
_______________________________________________
Qt-qml mailing list
[email protected]
http://lists.qt.nokia.com/mailman/listinfo/qt-qml_______________________________________________
Qt-qml mailing list
[email protected]
http://lists.qt.nokia.com/mailman/listinfo/qt-qml
