qmlcore
qmlcore copied to clipboard
Implementation of Behavior on
Currently the implementation of Behavior is written as special case in generator code.
Behavior on
However, this make it impossible to implement component like(Binding on x) in qml, instead I should
Binding {
target: parent;
property: "x";
when: btn.pressed;
value: 100;
}
It would be handy to add syntax sugar. When XX on x {} syntax, it dynamically bind parent to target and x to property and those two cannot be changed.
This is only my opinion, I still has ways to workaround though.
by the way, what do you think "supporting multiple properties at once"
Behavior on x,y,z {
Animation { duration: 1000; }
}
this is really good suggestions, thank you! I'll update you after I add them
my pleasure, actually I am pretty glad when I found this project is very active.
I found this project is very active.
Many people use it on daily basis, even though there's not much activity here
Behavior on [property list] is perfectly fine now, consider the following example:
Item {
anchors.fill: context;
Rectangle {
id: r1;
border.width: 1;
border.color: "black";
color: "#0000";
width: 10;
height: 10;
}
Rectangle {
id: r2;
border.width: 1;
border.color: "black";
color: "#0000";
width: 10;
height: 10;
}
Timer {
running: true;
repeat: true;
interval: 1000;
onTriggered: {
r1.x = r1.x !== 100? 100: 0;
r2.y = r2.y !== 100? 100: 0;
}
}
Behavior on r1.x, r2.y {
Animation { duration: 200; }
}
}
context.onWidthChanged fixed in cca410b7fdf8d869bbc8a7631eb8477ea3ee928b
Thanks! What about conditional binding? What is the preferred way to achieve this in pureqml?
@whoozle This is related to another issue https://github.com/pureqml/qmlcore/issues/164
accidentally closed wrong one, sorry :)
I think that generalising on
statement is the best way of doing this, but I'm not sure if it could be done soon. After initial generic on
support I have to implement Binding itself
Binding
has been implemented in e946e99ec661c698012a86bf009eee1db7a5dae2
consider the following example:
Item {
anchors.fill: parent;
Rectangle {
id: rect;
width: 100;
height: 100;
color: 'red';
HoverMixin {
id: hover;
cursor: 'pointer';
onValueChanged: { log("hover", value); }
}
Binding
{
target: rect;
property: 'effects.invert';
value: true;
when: hover.value;
delayed: true;
}
}
}
All original properties are supported, including path in property, e.g. 'effects.invert'
BIG thanks for officially implementing this.
@tim37021 np, it was not hard at all :)