Jump to content

Stack Animation Development


atreiu

Recommended Posts

@AndrewYY: Why did you make grid's icons so close each other ? :) Of course you can, but my dock doesn't prepare for it :)

I saw that the icons were overlapping, but I don't have very much to do about it. I make them zoom to 100% and then down to 97%. If you can give me more space to work with (bigger window for the stack) then I can zoom to 120% and down to 100% :)

Link to comment
  • Replies 67
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

then why do you include .pas files with your docklets? I guess I need to learn more about that...

I will assume that .pas will be pascal, and .dpr will be delphi project ;)

@Atreiu: I found that for most icon sizes and stack sizes, the maximum zoom is about 103%. The new "wobble" animation (which I renamed to "expand", since it doesn't really wobble) is available for download in the skins and support files thread. It doesn't have the problem of "wobble" where icons would overlap.

Link to comment
I will assume that .pas will be pascal, and .dpr will be delphi project ;)
LOL You learn quickly, you wise a... :P

FYI:

. Delphi is a Pascal dialect;

. .pas refers to pascal (delphi) source-code files;

. I guess I was an engineer before you're even born.

Last but not least, don't get angry with me, will you? :D

Link to comment

@atreiu: haha, far from that... we all play nice! :D

I did take a look at the page as you indicated but, unless I'm in one of those 'blonde days' what I read there is no different to what a project file for any language is: it references rather than contains source files - among other things it does. Thus, my original question still applies...

Link to comment
@atreiu: haha, far from that... we all play nice! :D

I did take a look at the page as you indicated but, unless I'm in one of those 'blonde days' what I read there is no different to what a project file for any language is: it references rather than contains source files - among other things it does. Thus, my original question still applies...

That was my impression too, though when I opened the project file, it just created a bunch of other files around it... Not exactly sure what those files were... Other than that, dpr can be opened in notepad :P so it's a strange project file format.

@Atreiu: The 103% thing shouldn't be seen as a rule (as people with huge monitors will be able to see the icons clip at the edges with 103%)... The actual window just contains barely the border and stuff inside it. it just so happens that 103% fits for everything on my screen resolution (1280x1024) :P

Link to comment
That was my impression too, though when I opened the project file, it just created a bunch of other files around it... Not exactly sure what those files were... Other than that, dpr can be opened in notepad :P so it's a strange project file format

.dpr is normally used as a "project file", but it is written in pascal language :confused: and actually it can contain code! Indeed small DLL and console application projects normally consist of a single .dpr file with all the code inside. Other than that, it's syntax is the same than a .pas file.

The other files you see being created are probably temporal files, resource files, and package inclusion/exclusion setting files (dcu, dof, res, etc...) The res file is mostly important if you change your app's icon or configure version info to the project, other than that it remains mostly unused (though I usually put the app's manifest there too).

Link to comment

Ok here goes. The idea of animating icons individually (as in Shishimaru's demo) intrigued me, so I invented a method of calling for each icon depending on their individual index.

(this is pretty easy to figure out, but) In the grid, the item number (from 1 to the total number of items) is:

iHeight*cWidth+iWidth+1

And of course, the total number of items is:

cWidth*cHeight

Take a look at a this "card dealing" animation to see how I used it ;)

I think we should be able to fulfill shishimaru's request soon ;)

Deal.zip

Link to comment
Beautiful, but... you forgot to draw tha last card (Open)!! Right now it remains over the stack icon. o_O

Really? It's working for me now, though I have made a whole bunch of changes since I uploaded that... Guess I'll upload later again ;)

Edit: yeah, I can understand why it wouldn't work. It's working now though. Gonna add a few things and upload again.

Edit2:

Alright. Got it! I'm happy with this. If you guys have any suggestions, say 'em now. I'm publishing it in the other thread soon. :)

If you fiddle with it, you'll notice that no matter what the settings are, each icon takes exactly 0.2 seconds to get to the spot, unless there's no time. The speed settings will decide how close together the "deals" will be. It's a bit fast, but I think it works.

Deal.zip

Link to comment
Really? It's working for me now, though I have made a whole bunch of changes since I uploaded that... Guess I'll upload later again ;)

Edit: yeah, I can understand why it wouldn't work. It's working now though. Gonna add a few things and upload again.

Edit2:

Alright. Got it! I'm happy with this. If you guys have any suggestions, say 'em now. I'm publishing it in the other thread soon. :)

If you fiddle with it, you'll notice that no matter what the settings are, each icon takes exactly 0.2 seconds to get to the spot, unless there's no time. The speed settings will decide how close together the "deals" will be. It's a bit fast, but I think it works.

VERY good work, Andrew! It's beautiful, smooth and really different to the other animations. Speed is fine, too. Nice job!

Link to comment
VERY good work, Andrew! It's beautiful, smooth and really different to the other animations. Speed is fine, too. Nice job!

Glad to hear it :)

The file has been published in the other thread :D. Take a look at the fan animation too. I copied the code and modified it to work with that as well ;)

By the way, I did end up slowing the speed to 0.25 seconds. I felt it was a bit fast :) Speed for fan stacks is 0.2, since fans are less "snappy" than grids.

Link to comment

So I've been studying Shishimaru's example... Here's what I got:

Each icon flies to about position (3/4,1/2) of the grid before continuing to it's final destination. Same thing on coming back (actually, it does one at a time for open, and all at the same time for close, but we can't do that)

I'm considering using a bezier curve from start to (3/4,1/2) to end, and then smoothing the speed out with a sine function. I say bezier curve since it's the only curve I'm familiar with in programming :P I'll just add this stuff to my "deal" animation since the icon start and end times are pretty similar anyways.

Cheers.

Edit: Arg! The math is driving me nuts! I think it's something to do with my PointDirection function... Please point out my flaws:

function PointDirection(x1,x2,y1,y2:real) : real;

//returns direction in radians

var

xdiff, ydiff: real;

begin

xdiff := x2-x1;

ydiff := y2-y1;

if xdiff = 0 then //to prevent division by 0 error

begin

Result := ydiff/abs(ydiff)*pi/2; //returns either pi/2 or -pi/2 depending on direction

end

else

begin

Result := arctan(ydiff/xdiff); //calculates direction. I think this is where it screws up

end;

end;

Edit2: forget the above, I made a stupid mistake :P

Edited by AndrewYY
Link to comment

The deal animation is awesome AndrewYY. Please make more. Also, where can I learn Delphi language. I am very good at math (just finished my gr. 12 advanced functions exam few days ago), it's just that I don't really understand the mathematical descriptions of animations.

Link to comment
The deal animation is awesome AndrewYY. Please make more. Also, where can I learn Delphi language. I am very good at math (just finished my gr. 12 advanced functions exam few days ago), it's just that I don't really understand the mathematical descriptions of animations.

Great! you can help me then! I still haven't even been introduced (in school) to grade 10 trigonometry yet :slant:. Can you write a direction (in radians) function from 0 to 2pi in math? Arguments are x1,y1,x2,y2. Return from 0 to 2pi radians

Edit: so if (x1,y1) was the center of a circle, (x2,y2) is a point on the circle represented as (cos θ, sin θ) and I need θ :P

Edit2: either arctan((y2-y1)/(x2-x1)) isn't working, or my bug lies elsewhere.

Edit3: I don't know delphi either :P I'm really just learning as I go along. Take a look at online pascal tutorials.

Edit4: I'm an idiot, I figured it out :)

Edit5: Hehe, I've almost got it now. Just need to make a matching fan animation and I'm all set :)

Edit6: Alright. I released it into the other thread. It's now available in all its bezier-curve goodness :P

Link to comment

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now

×
×
  • Create New...