Implementation of Behavior on

[tim37021]

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; }
}

[whoozle]

this is really good suggestions, thank you!
I'll update you after I add them

[tim37021]

my pleasure, actually I am pretty glad when I found this project is very active.

[whoozle]

I found this project is very active.

Many people use it on daily basis, even though there's not much activity here

[whoozle]

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; }
	}
}

[whoozle]

context.onWidthChanged fixed in cca410b

[tim37021]

Thanks! What about conditional binding? What is the preferred way to achieve this in pureqml?

@whoozle
This is related to another issue
#164

[whoozle]

accidentally closed wrong one, sorry :)

[whoozle]

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

[whoozle]

Binding has been implemented in e946e99

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'

[tim37021]

BIG thanks for officially implementing this.

[whoozle]

@tim37021 np, it was not hard at all :)