59 |
59 |
60 QT_BEGIN_NAMESPACE |
60 QT_BEGIN_NAMESPACE |
61 |
61 |
62 /*! |
62 /*! |
63 \qmlclass PropertyChanges QDeclarativePropertyChanges |
63 \qmlclass PropertyChanges QDeclarativePropertyChanges |
|
64 \ingroup qml-state-elements |
64 \since 4.7 |
65 \since 4.7 |
65 \brief The PropertyChanges element describes new property bindings or values for a state. |
66 \brief The PropertyChanges element describes new property bindings or values for a state. |
66 |
67 |
67 PropertyChanges provides a state change that modifies the properties of an item. |
68 PropertyChanges is used to define the property values or bindings in a |
68 |
69 \l State. This enables an item's property values to be changed when it |
69 Here is a property change that modifies the text and color of a \l Text element |
70 \l {QML States}{changes between states}. |
70 when it is clicked: |
71 |
|
72 To create a PropertyChanges object, specify the \l target item whose |
|
73 properties are to be modified, and define the new property values or |
|
74 bindings. For example: |
71 |
75 |
72 \qml |
76 \snippet doc/src/snippets/declarative/propertychanges.qml import |
73 Text { |
77 \codeline |
74 id: myText |
78 \snippet doc/src/snippets/declarative/propertychanges.qml 0 |
75 width: 100; height: 100 |
79 |
76 text: "Hello" |
80 When the mouse is pressed, the \l Rectangle changes to the \e resized |
77 color: "blue" |
81 state. In this state, the PropertyChanges object sets the rectangle's |
78 |
82 color to blue and the \c height value to that of \c container.height. |
79 states: State { |
83 |
80 name: "myState" |
84 Note this automatically binds \c rect.height to \c container.height |
81 |
85 in the \e resized state. If a property binding should not be |
82 PropertyChanges { |
86 established, and the height should just be set to the value of |
83 target: myText |
87 \c container.height at the time of the state change, set the \l explicit |
84 text: "Goodbye" |
|
85 color: "red" |
|
86 } |
|
87 } |
|
88 |
|
89 MouseArea { anchors.fill: parent; onClicked: myText.state = 'myState' } |
|
90 } |
|
91 \endqml |
|
92 |
|
93 By default, PropertyChanges will establish new bindings where appropriate. |
|
94 For example, the following creates a new binding for myItem's \c height property. |
|
95 |
|
96 \qml |
|
97 PropertyChanges { |
|
98 target: myItem |
|
99 height: parent.height |
|
100 } |
|
101 \endqml |
|
102 |
|
103 If you don't want a binding to be established (and instead just want to assign |
|
104 the value of the binding at the time the state is entered), |
|
105 you should set the PropertyChange's \l{PropertyChanges::explicit}{explicit} |
|
106 property to \c true. |
88 property to \c true. |
107 |
89 |
108 State-specific script for signal handlers can also be specified: |
90 A PropertyChanges object can also override the default signal handler |
|
91 for an object to implement a signal handler specific to the new state: |
109 |
92 |
110 \qml |
93 \qml |
111 PropertyChanges { |
94 PropertyChanges { |
112 target: myMouseArea |
95 target: myMouseArea |
113 onClicked: doSomethingDifferent() |
96 onClicked: doSomethingDifferent() |
114 } |
97 } |
115 \endqml |
98 \endqml |
116 |
99 |
117 You can reset a property in a state change by assigning \c undefined. In the following |
100 \note PropertyChanges can be used to change anchor margins, but not other anchor |
118 example we reset \c theText's width when we enter state1. This will give the text its |
101 values; use AnchorChanges for this instead. Similarly, to change an \l Item's |
119 natural width (which is the whole string on one line). |
102 \l {Item::}{parent} value, use ParentChanges instead. |
120 |
103 |
121 \qml |
104 |
122 import Qt 4.7 |
105 \section2 Resetting property values |
123 |
106 |
124 Rectangle { |
107 The \c undefined value can be used to reset the property value for a state. |
125 width: 640 |
108 In the following example, when \c theText changes to the \e widerText |
126 height: 480 |
109 state, its \c width property is reset, giving the text its natural width |
127 Text { |
110 and displaying the whole string on a single line. |
128 id: theText |
111 |
129 width: 50 |
112 \snippet doc/src/snippets/declarative/propertychanges.qml reset |
130 wrapMode: Text.WordWrap |
113 |
131 text: "a text string that is longer than 50 pixels" |
114 |
132 } |
115 \section2 Immediate property changes in transitions |
133 |
116 |
134 states: State { |
117 When \l Transitions are used to animate state changes, they animate |
135 name: "state1" |
118 properties from their values in the current state to those defined in the |
136 PropertyChanges { |
119 new state (as defined by PropertyChanges objects). However, |
137 target: theText |
120 it is sometimes desirable to set a property value \e immediately during a |
138 width: undefined |
121 \l Transition, without animation; in these cases, the PropertyAction |
139 } |
122 element can be used to force an immediate property change. |
140 } |
123 |
141 } |
124 See the PropertyAction documentation for more details. |
142 \endqml |
|
143 |
|
144 Anchor margins should be changed with PropertyChanges, but other anchor changes or changes to |
|
145 an Item's parent should be done using the associated change elements |
|
146 (ParentChange and AnchorChanges, respectively). |
|
147 |
125 |
148 \sa {declarative/animation/states}{states example}, {qmlstate}{States}, QtDeclarative |
126 \sa {declarative/animation/states}{states example}, {qmlstate}{States}, QtDeclarative |
149 */ |
|
150 |
|
151 /*! |
|
152 \internal |
|
153 \class QDeclarativePropertyChanges |
|
154 \brief The QDeclarativePropertyChanges class describes new property values for a state. |
|
155 */ |
127 */ |
156 |
128 |
157 /*! |
129 /*! |
158 \qmlproperty Object PropertyChanges::target |
130 \qmlproperty Object PropertyChanges::target |
159 This property holds the object which contains the properties to be changed. |
131 This property holds the object which contains the properties to be changed. |