animation, scale Question

[jedione]

anyone know how one could instead of scale a snap,
only scale vertically or horizontally
so the snap would start at 100, 100   
then shrink  to 0, 100
code mite look something like this

Code: [Select]

::OBJECTS <- {
pac = fe.add_artwork("video", flx*0.100, fly*0.200 , flw*0.100, flh*0.100)
}

local down = {
        when =Transition.ToNewSelection ,
property = "fly*",
start = fly*0.100,
end = fly*0.00,
time = 600,
loop=false
 }
animation.add( PropertyAnimation ( OBJECTS.pac, down ) );
like a window rolloin down.....so one could add transitional pinch or skew

the goal woud be to make it look like a cube rotating with every side beeing a diff game
like they have in launchbox "bigbox"

[jedione]

hmm im starting to think mabe this can be done with just movment and pinch..and scale

[liquid8d]

correct... if you want to "scale" on one axis just use width or height. All scale does is adjust width and height uniformly to the initial width and height values. So for a "window rollup-down" effect where the image changes, you could do something like:

- animate from initial height to zero
- change image
- animate from zero to initial height

Just remember if you have preserve_aspect_ratio on, it will adjust your width or height to scale the image accordingly - so you may or may not want that on.

[jedione]

when i get done making it ill post it up here.....

[jedione]

i have got the pinch and skew down

Code: [Select]

local down = {
        when =Transition.ToNewSelection ,
property = "pinch_x",
start = (-100),
end = (0),
time = 600,
loop=false
//delay = 1600,
 }
but as for the scale from 100 to 0  man ive tried  all i can think of and cant make it work
you would think it would be "scale_x   or scale_y  but it wont work.....

i know ill benifet from figuring it out...my self could you point me to were its documentet so i can read it....thanks

[liquid8d]

Like I said, scale will only uniformly resize the object - resizing both width and height. scale = 1 is the original size, scale = 2 would be twice the size, but if you just want to resize width or height just use "width" or "height" and do * 2 or whatever 'scale' you want. Unfortunately, it's not going to center the object when you change width/height, so you'd also have to adjust x or y to re-center the object along the way. I agree I should have added a scale_x or scale_y to make that a bit easier.

The info for using a property animation is in the property.nut file:
https://github.com/liquid8d/attract-extra/blob/master/modules/animate/property.nut

[qqplayer]

Like I said, scale will only uniformly resize the object - resizing both width and height. scale = 1 is the original size, scale = 2 would be twice the size, but if you just want to resize width or height just use "width" or "height" and do * 2 or whatever 'scale' you want. Unfortunately, it's not going to center the object when you change width/height, so you'd also have to adjust x or y to re-center the object along the way. I agree I should have added a scale_x or scale_y to make that a bit easier.

The info for using a property animation is in the property.nut file:
https://github.com/liquid8d/attract-extra/blob/master/modules/animate/property.nut

Can we make an object "fliping 3d" like on css?

https://www.youtube.com/watch?v=W3eJWpvIl0g

[liquid8d]

Can we make an object "fliping 3d" like on css?

There is no 3d, but you can fake that effect using pinch/skew or animating the height or width to 0 (while moving x/y to keep it centered), changing the image while the width/height is 0, then sizing back to its original size. I think that's similar to what jedi is trying to do, no? A scale_x or scale_y while keeping it centered would really help that.

[qqplayer]

Can we make an object "fliping 3d" like on css?

There is no 3d, but you can fake that effect using pinch/skew or animating the height or width to 0 (while moving x/y to keep it centered), changing the image while the width/height is 0, then sizing back to its original size. I think that's similar to what jedi is trying to do, no? A scale_x or scale_y while keeping it centered would really help that.

Can you please make a little example , I´ve tested some combinations:

Code: [Select]

local boxartrotate = {
    when = When.ToNewSelection,
    property = "rotation",
    start = -180,
    end = 0,
    time = 500,
    loop=false
 }

local boxartpinch_x = {
    when = Transition.ToNewSelection ,
property = "pinch_x",
start = (500),
end = (0),
time = 1000,
loop=false
 }
But when there is no boxart a "flash" appears suddenly rotating on the left of my theme.

[liquid8d]

Here's the basic idea.. this doesn't shrink into center and doesn't "flip" 360 - it also wouldn't work right with preserve_aspect_ratio on but it should give you some ideas:

Code: [Select]

fe.load_module("animate")

local shrink = {
    when = Transition.ToNewSelection,
    property = "width",
    start = 300,
    end = 1,
    time = 750,
    loop=false,
    wait = true
}
local skew = {
    when = Transition.ToNewSelection,
    property = "pinch_y",
    start = 0,
    end = 150,
    time = 750,
    loop=false,
    wait = true
}
local shrink_restore = {
    when = Transition.FromOldSelection,
    property = "width",
    start = 1,
    end = 300,
    time = 750,
    loop=false
}
local skew_restore= {
    when = Transition.FromOldSelection,
    property = "pinch_y",
    start = 150,
    end = 0,
    time = 750,
    loop=false
}
 
local img = fe.add_artwork("flyer", 100, 100, 300, 400)

animation.add(PropertyAnimation(img, shrink))
animation.add(PropertyAnimation(img, skew))
animation.add(PropertyAnimation(img, shrink_restore))
animation.add(PropertyAnimation(img, skew_restore))

I noticed I couldn't use 0 for width, so I had to set it to 1 or it would auto-resize it.. if you wanted 360 degress, you'd probably have to set the texture_width? to -1 before the 'restore' animations and reverse the pinching somehow.

I'm not sure on the flash, you'd have to see which anim or which property is causing that - you might have to work around it by catching that event and just hiding the artwork or something if the artwork isn't available.

[qqplayer]

Here's the basic idea.. this doesn't shrink into center and doesn't "flip" 360 - it also wouldn't work right with preserve_aspect_ratio on but it should give you some ideas:

Code: [Select]

fe.load_module("animate")

local shrink = {
    when = Transition.ToNewSelection,
    property = "width",
    start = 300,
    end = 1,
    time = 750,
    loop=false,
    wait = true
}
local skew = {
    when = Transition.ToNewSelection,
    property = "pinch_y",
    start = 0,
    end = 150,
    time = 750,
    loop=false,
    wait = true
}
local shrink_restore = {
    when = Transition.FromOldSelection,
    property = "width",
    start = 1,
    end = 300,
    time = 750,
    loop=false
}
local skew_restore= {
    when = Transition.FromOldSelection,
    property = "pinch_y",
    start = 150,
    end = 0,
    time = 750,
    loop=false
}
 
local img = fe.add_artwork("flyer", 100, 100, 300, 400)

animation.add(PropertyAnimation(img, shrink))
animation.add(PropertyAnimation(img, skew))
animation.add(PropertyAnimation(img, shrink_restore))
animation.add(PropertyAnimation(img, skew_restore))

I noticed I couldn't use 0 for width, so I had to set it to 1 or it would auto-resize it.. if you wanted 360 degress, you'd probably have to set the texture_width? to -1 before the 'restore' animations and reverse the pinching somehow.

I'm not sure on the flash, you'd have to see which anim or which property is causing that - you might have to work around it by catching that event and just hiding the artwork or something if the artwork isn't available.

Thanks I`ll do some tests.

[jedione]

was able to make like a flipping card..effect
would be nice if their was a way to shrink "width or height" from both side's to a center point

https://youtu.be/jZVFXeNgt84

here is the code:

Code: [Select]

fe.load_module("animate")

local move = {
    when = Transition.ToNewSelection,
    property = "y",
    start = 150,
    end = 1,
    time = 500,
    loop=false,
    //wait = true
    delay = 500,
}
local move2 = {
    when = Transition.ToNewSelection,
    property = "y",
    start = 1,
    end = 150,
    time = 500,
    loop=false,
    wait = true
}

local pac = {
   when = Transition.ToNewSelection,
    property = "height",
    start = 1,
    end = 300,
    time = 500,
    loop=false,
   // wait = true
    delay = 500,
}


local pac2 = {
   when = Transition.ToNewSelection,
    property = "height",
    start = 300,
    end = 1,
    time = 500,
    loop=false,
    wait = true
}

local img = fe.add_artwork("snap", 200, -500, 400, 0)
animation.add(PropertyAnimation(img, move))
animation.add(PropertyAnimation(img, pac))
animation.add(PropertyAnimation(img, move2))
animation.add(PropertyAnimation(img, pac2))
then i still need to put it on its own surface so it can be moved around easily

[liquid8d]

Looks nice! I'm *still* working on getting the new animate module working properly.. but I'm keeping these things in mind. Once I can get it working properly I'd like to start making some presets or modules for stuff like this. There was just a lot of limitations with the current animate module.

I really need a way to dump 'wait' because while it's necessary to wait for the 'in' animation to finish.. it also locks out control of your input. That's something I like to avoid..

[jedione]

any idea when it will be ready maybe a few months ?

[liquid8d]

I hope a lot sooner than that - I'm pretty close, but still have some issues that make it difficult for testing. At least the rewritten core and property and sprite animations.. particles might be a bit longer.