Re: [Interest] Can QML do this animation?
Hi Juergen, sorry for the off-topic. But great job with qmlbook, it helped me a lot :) Em ter, 24 de mar de 2015 às 09:57, Juergen Bocklage-Ryannel li...@ryannel.org escreveu: Hi, First of all. Thanks for the great example. Love it! I'm the author of the QmlBook (qmlbook.org). I would maybe like to use the example in the book if this would be okay with you. The example would be licensed under the BSD and the text would be copyrighted to the authors of the book, the book is under the CC license. I would reference your name on the example and the text. Please let me know if this is okay with you. I would imagine this would be a good place under Advanced Techniques: http://qmlbook.github.io/en/ch05/index.html#advanced-techniques If i find some time I maybe even can finish it with the draining. Take care / juergen On 27/02/15 16:12, Arthur Buldauskas wrote: Wow, that's amazing! Thank you very much for doing this. It sure is quite a lot of QML code for something that looks so simple (and cool). Just curious about two things: 1. Is there any reason why you mailed it me directly and not the mailing list? I think others would like this as well. 2. Under what license do you release this? I don't have any direct plans to use it, but i probably will use parts of it in some projects (like my file manager, Accretion, where i would probably use this as a copy progressbar). Best regards, Mark Btw. disabling the line: rotation: indicator.rotation; makes it look even better :) The text now actually rotates with the indicator. My bad, forgot to reply all. Feel free to use the code, I just made this as a fun exercise. It could be a lot cleaner and probably smoother. A lot of the code is just making sure the indicator animates properly. http://pastebin.com/cwCPChLk ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest -- / jryannel http://qmlbook.org ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Hi, First of all. Thanks for the great example. Love it! I'm the author of the QmlBook (qmlbook.org). I would maybe like to use the example in the book if this would be okay with you. The example would be licensed under the BSD and the text would be copyrighted to the authors of the book, the book is under the CC license. I would reference your name on the example and the text. Please let me know if this is okay with you. I would imagine this would be a good place under Advanced Techniques: http://qmlbook.github.io/en/ch05/index.html#advanced-techniques If i find some time I maybe even can finish it with the draining. Take care / juergen On 27/02/15 16:12, Arthur Buldauskas wrote: Wow, that's amazing! Thank you very much for doing this. It sure is quite a lot of QML code for something that looks so simple (and cool). Just curious about two things: 1. Is there any reason why you mailed it me directly and not the mailing list? I think others would like this as well. 2. Under what license do you release this? I don't have any direct plans to use it, but i probably will use parts of it in some projects (like my file manager, Accretion, where i would probably use this as a copy progressbar). Best regards, Mark Btw. disabling the line: rotation: indicator.rotation; makes it look even better :) The text now actually rotates with the indicator. My bad, forgot to reply all. Feel free to use the code, I just made this as a fun exercise. It could be a lot cleaner and probably smoother. A lot of the code is just making sure the indicator animates properly. http://pastebin.com/cwCPChLk ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest -- / jryannel http://qmlbook.org ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Arthur Buldauskas schreef op 28-2-2015 om 05:13: Yeah, I started working on the drain animation for failure but scrapped it. So its just the successful animation that is finished. On Fri, Feb 27, 2015 at 1:57 PM, Gunnar Roth gunnar.r...@gmx.de mailto:gunnar.r...@gmx.de wrote: Thanks a lot for this nice example. I just could not get to work it doing failure case. var amount = [ 18, 10, 15, 57 ];//insert -1 to cause failure inserting -1 here just shortens the animation, still done is shown not fail. Regards, Gunnar Roth Am 27.02.2015 um 16:12 schrieb Arthur Buldauskas whinem...@gmail.com mailto:whinem...@gmail.com: Wow, that's amazing! Thank you very much for doing this. It sure is quite a lot of QML code for something that looks so simple (and cool). Just curious about two things: 1. Is there any reason why you mailed it me directly and not the mailing list? I think others would like this as well. 2. Under what license do you release this? I don't have any direct plans to use it, but i probably will use parts of it in some projects (like my file manager, Accretion, where i would probably use this as a copy progressbar). Best regards, Mark Btw. disabling the line: rotation: indicator.rotation; makes it look even better :) The text now actually rotates with the indicator. My bad, forgot to reply all. Feel free to use the code, I just made this as a fun exercise. It could be a lot cleaner and probably smoother. A lot of the code is just making sure the indicator animates properly. http://pastebin.com/cwCPChLk ___ Interest mailing list Interest@qt-project.org mailto:Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest Did you notify the author of the original animation that you implemented it? He might like to know... André ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Yeah, I started working on the drain animation for failure but scrapped it. So its just the successful animation that is finished. On Fri, Feb 27, 2015 at 1:57 PM, Gunnar Roth gunnar.r...@gmx.de wrote: Thanks a lot for this nice example. I just could not get to work it doing failure case. var amount = [ 18, 10, 15, 57 ];//insert -1 to cause failure inserting -1 here just shortens the animation, still done is shown not fail. Regards, Gunnar Roth Am 27.02.2015 um 16:12 schrieb Arthur Buldauskas whinem...@gmail.com: Wow, that's amazing! Thank you very much for doing this. It sure is quite a lot of QML code for something that looks so simple (and cool). Just curious about two things: 1. Is there any reason why you mailed it me directly and not the mailing list? I think others would like this as well. 2. Under what license do you release this? I don't have any direct plans to use it, but i probably will use parts of it in some projects (like my file manager, Accretion, where i would probably use this as a copy progressbar). Best regards, Mark Btw. disabling the line: rotation: indicator.rotation; makes it look even better :) The text now actually rotates with the indicator. My bad, forgot to reply all. Feel free to use the code, I just made this as a fun exercise. It could be a lot cleaner and probably smoother. A lot of the code is just making sure the indicator animates properly. http://pastebin.com/cwCPChLk ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Thanks a lot for this nice example. I just could not get to work it doing failure case. var amount = [ 18, 10, 15, 57 ];//insert -1 to cause failure inserting -1 here just shortens the animation, still done is shown not fail. Regards, Gunnar Roth Am 27.02.2015 um 16:12 schrieb Arthur Buldauskas whinem...@gmail.com: Wow, that's amazing! Thank you very much for doing this. It sure is quite a lot of QML code for something that looks so simple (and cool). Just curious about two things: 1. Is there any reason why you mailed it me directly and not the mailing list? I think others would like this as well. 2. Under what license do you release this? I don't have any direct plans to use it, but i probably will use parts of it in some projects (like my file manager, Accretion, where i would probably use this as a copy progressbar). Best regards, Mark Btw. disabling the line: rotation: indicator.rotation; makes it look even better :) The text now actually rotates with the indicator. My bad, forgot to reply all. Feel free to use the code, I just made this as a fun exercise. It could be a lot cleaner and probably smoother. A lot of the code is just making sure the indicator animates properly. http://pastebin.com/cwCPChLk http://pastebin.com/cwCPChLk ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Wow, that's amazing! Thank you very much for doing this. It sure is quite a lot of QML code for something that looks so simple (and cool). Just curious about two things: 1. Is there any reason why you mailed it me directly and not the mailing list? I think others would like this as well. 2. Under what license do you release this? I don't have any direct plans to use it, but i probably will use parts of it in some projects (like my file manager, Accretion, where i would probably use this as a copy progressbar). Best regards, Mark Btw. disabling the line: rotation: indicator.rotation; makes it look even better :) The text now actually rotates with the indicator. My bad, forgot to reply all. Feel free to use the code, I just made this as a fun exercise. It could be a lot cleaner and probably smoother. A lot of the code is just making sure the indicator animates properly. http://pastebin.com/cwCPChLk ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
On Wed, Feb 18, 2015 at 1:18 AM, Jason H jh...@gmx.com wrote: Yes, I think 80% of it is 100% do-able. Rotation defined by bytes receiced, with bounce easing. The only issue is the drain animation. I'd probably use Canvas and mathmatically define the position of a set of control points as a function of time. Feed those to a path, and you've got all the makings of a drain effect. I actually don't mind the drain animation, it's nice, but i never imagine a progressbar to drain in that way :) But i do like to - try and - make a progressbar in the same fashion with a tooltip floating above it. Guess it's time to play with QML and see how far i can get with this. *Sent:* Tuesday, February 17, 2015 at 6:48 PM *From:* Mark Gaiser mark...@gmail.com *To:* Qt Interest interest@qt-project.org *Subject:* [Interest] Can QML do this animation? Hi, Take a look at this animation: https://dribbble.com/shots/1853526-Download The progressbar can probably be done using particles. The real thing i'm interested in is the progress tooltip the floats above it. It moves along with the progressbar in a nice smooth acceleration/deceleration animation. I'm not quite sure how to accomplish that. Also, the rotation of the progress tooltip (where it changes in done and failed).. How can that be done? I can rotate a rectangle using transform, but any text i place on that is then also transformed (read mirrored) which is not what you want. Just curious if - and how! - QML can do these fancy animations. Cheers, Mark ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Jason H schreef op 18-2-2015 om 15:03: Sent: Wednesday, February 18, 2015 at 5:44 AM From: Mark Gaiser mark...@gmail.com To: Qt Interest interest@qt-project.org Subject: Re: [Interest] Can QML do this animation? On Wed, Feb 18, 2015 at 1:18 AM, Jason H jh...@gmx.com wrote: Yes, I think 80% of it is 100% do-able. Rotation defined by bytes receiced, with bounce easing. The only issue is the drain animation. I'd probably use Canvas and mathmatically define the position of a set of control points as a function of time. Feed those to a path, and you've got all the makings of a drain effect. I actually don't mind the drain animation, it's nice, but i never imagine a progressbar to drain in that way :) But i do like to - try and - make a progressbar in the same fashion with a tooltip floating above it. Guess it's time to play with QML and see how far i can get with this Well That's the easist part! Just do things as a percentage. Implementation is left to the reader. The real fun starts when you want to change the rotation of the sign with the speed (or better: acceleration and decelleration) of the download with a nice animation :-) Still: I think the draining of the progress on a fail is nice little touch. As is the morphing from a download button into a progress bar and back. André ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Sent: Wednesday, February 18, 2015 at 5:44 AM From: Mark Gaiser mark...@gmail.com To: Qt Interest interest@qt-project.org Subject: Re: [Interest] Can QML do this animation? On Wed, Feb 18, 2015 at 1:18 AM, Jason H jh...@gmx.com wrote: Yes, I think 80% of it is 100% do-able. Rotation defined by bytes receiced, with bounce easing. The only issue is the drain animation. I'd probably use Canvas and mathmatically define the position of a set of control points as a function of time. Feed those to a path, and you've got all the makings of a drain effect. I actually don't mind the drain animation, it's nice, but i never imagine a progressbar to drain in that way :) But i do like to - try and - make a progressbar in the same fashion with a tooltip floating above it. Guess it's time to play with QML and see how far i can get with this Well That's the easist part! Just do things as a percentage. Implementation is left to the reader. ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
On 02/18/2015 11:44 AM, Mark Gaiser wrote:
On Wed, Feb 18, 2015 at 1:18 AM, Jason H jh...@gmx.com
mailto:jh...@gmx.com wrote:
Yes, I think 80% of it is 100% do-able.
Rotation defined by bytes receiced, with bounce easing.
The only issue is the drain animation. I'd probably use Canvas
and mathmatically define the position of a set of control points as
a function of time. Feed those to a path, and you've got all the
makings of a drain effect.
I actually don't mind the drain animation, it's nice, but i never
imagine a progressbar to drain in that way :)
But i do like to - try and - make a progressbar in the same fashion with
a tooltip floating above it. Guess it's time to play with QML and see
how far i can get with this.
You were worried about synchronizing the end of the progressbar with the
location of the floater (hmm, that's probably a bad word for it) above
it, right?
To fix this, create a property that's used by both the progressbar and
the sign.
Item {
property int currentX: progress / 100 * progressWidth
Behaviour on currentX { ... }
}
If you want to rotate the sign but not the text, then encapsulate the
item twice:
Item {
id: floater
Item { id: signPart: ... }
Item { id: textPart; ... }
}
Then you can rotate the signPart without rotating the text.
Doing stuff like this is where QML is *fantastic*, and it's great fun to
figure out how to do it.
Be careful to encapsulate everything in Items, or you will regret it
later. You can have a look here for a bit of inspiration (shameless
plug, it's my own Qt blog): http://www.vikingsoft.eu/blog/?p=173
Have fun :)
Bo Thorsen,
Director, Viking Software.
--
Viking Software
Qt and C++ developers for hire
http://www.vikingsoft.eu
___
Interest mailing list
Interest@qt-project.org
http://lists.qt-project.org/mailman/listinfo/interest
Re: [Interest] Can QML do this animation?
Yes, I think 80% of it is 100% do-able. Rotation defined by bytes receiced, with bounce easing. The only issue is the drain animation. Id probably use Canvas and mathmatically define the position of a set of control points as a function of time. Feed those to a path, and youve got all the makings of a drain effect. Sent:Tuesday, February 17, 2015 at 6:48 PM From:Mark Gaiser mark...@gmail.com To:Qt Interest interest@qt-project.org Subject:[Interest] Can QML do this animation? Hi, Take a look at this animation: https://dribbble.com/shots/1853526-Download The progressbar can probably be done using particles. The real thing im interested in is the progress tooltip the floats above it. It moves along with the progressbar in a nice smooth acceleration/deceleration animation. Im not quite sure how to accomplish that. Also, the rotation of the progress tooltip (where it changes in done and failed).. How can that be done? I can rotate a rectangle using transform, but any text i place on that is then also transformed (read mirrored) which is not what you want. Just curious if - and how! - QML can do these fancy animations. Cheers, Mark ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest ___ Interest mailing list Interest@qt-project.org http://lists.qt-project.org/mailman/listinfo/interest
