[Interest] Animating a gradient

Jason H jhihn at gmx.com
Wed Nov 18 16:29:56 CET 2015


Another clever work-around! I was trying another animation to separately animate the following stop. I'll use yours since I don't like unneeded multiple animations.

Thanks!

> Sent: Wednesday, November 18, 2015 at 10:24 AM
> From: "Gian Maxera" <gmaxera at gmail.com>
> To: "Jason H" <jhihn at gmx.com>
> Cc: "interest at qt-project.org" <interest at qt-project.org>
> Subject: Re: [Interest] Animating a gradient
>
> Ok, that’s explain also because onPositionChanged does not work.
> The property has no signal notify changes. So, it means you cannot do what you want.
> 
> So, my workaround is:
>  - define a property and animate this property
>  - refer this property into gradient
> 
> Rectangle {
>   id: myRect
>   property real gradPosition: 0.98
>   gradient: Gradient {
>       GradientStop{ … ; position: myRect.gradPosition }
>> 
> Ciao,
> Gianluca.
> 
> 
> > On 18 Nov 2015, at 15:20, Jason H <jhihn at gmx.com> wrote:
> > 
> > A fantastic suggestion! However when I tried it I got:
> > QQmlExpression: Expression qrc:/NextBar.qml:33:40 depends on non-NOTIFYable properties:
> >    QQuickGradientStop::position
> > 
> > Does anyone know why these aren't NOTIFYable?
> > 
> > 
> >> Sent: Tuesday, November 17, 2015 at 4:16 PM
> >> From: Gianluca <gmaxera at gmail.com>
> >> To: "Jason H" <jhihn at gmx.com>
> >> Cc: "interest at qt-project.org" <interest at qt-project.org>
> >> Subject: Re: [Interest] Animating a gradient
> >> 
> >> Hello Jason,
> >> why you don’t simple use property binding ?
> >> 
> >> GradientStop { id: gs2; position: gs1.position+0.1; color: "dodgerblue" }
> >> 
> >> and remove completely onPositionChanged
> >> 
> >> Ciao,
> >> Gianluca.
> >> 
> >> 
> >> Il giorno 17/nov/2015, alle ore 20:39, Jason H <jhihn at gmx.com> ha scritto:
> >> 
> >>> I want to animate a gradient, but onPositionChanged gives an error, even though I can animate it. What am I doing wrong?
> >>> 
> >>> 
> >>> Item {
> >>> 	property alias color: container.color
> >>> 	Component.onCompleted: anim.start()
> >>> 	Rectangle {
> >>> 		id: container
> >>> 		width: parent.width * .9
> >>> 		height : parent.height / 2
> >>> 		anchors.centerIn: parent
> >>> 		Rectangle {
> >>> 			anchors.centerIn: parent
> >>> 			width: container.height /2
> >>> 			height: container.width
> >>> 			rotation: -90
> >>> 			gradient:Gradient {
> >>> 					GradientStop { id: gs0; position: 0.00; color: "dodgerblue" }
> >>> 					GradientStop {
> >>> 						id: gs1;
> >>> 						position: 0.98;
> >>> 						color: "white";
> >>> 						onPositionChanged: { // Cannot assign to non-existent property "onPositionChanged"
> >>> 							gs2.position = position +.01
> >>> 						}
> >>> 					}
> >>> 					GradientStop { id: gs2; position: 0.99; color: "dodgerblue" }
> >>> 					GradientStop { id: gs3; position: 1.00; color: "dodgerblue" }
> >>> 			}
> >>> 		}
> >>> 	}
> >>> 
> >>> 	NumberAnimation {
> >>> 		id: anim
> >>> 		target: gs1
> >>> 		property: "position"
> >>> 		duration: 2000
> >>> 		easing.type: Easing.InOutQuad
> >>> 		loops: Animation.Infinite
> >>> 		from: .98
> >>> 		to: 0
> >>> 	}
> >>> }
> >>> _______________________________________________
> >>> Interest mailing list
> >>> Interest at qt-project.org
> >>> http://lists.qt-project.org/mailman/listinfo/interest
> >> 
> >> 
> 
>



More information about the Interest mailing list