Attract-Mode Support Forum
Attract-Mode Support => Themes => Topic started by: chrisvg on March 13, 2016, 03:18:58 PM
-
CHANGELOG
Version 0.1 (8th December 2015) - Initial release (included in Blastcity layout)
Version 1.0 (14th March 2016) - Complete rewrite to extend PreserveArt module
Version 1.1 (14th March 2016) - Added start_scale and randomize_on_transition
Version 1.2 (22th March 2016) - Fixed bug with bounce animation when art is smaller than surface
After a bit of prodding from Verion (ouch!), I finally got around to rewriting the PanAndScan module I included with my previous Blastcity layout! :P
This version of the module extends liquid8d's excellent PreserveArt module. I have included the most recent version (1.0) of his module in the archive. You can find this and his other projects hosted at his github repo (https://github.com/liquid8d).
With liquid8d's module you can define an arbitrary space on the screen and place an art or image object in there, either scaled to fit within the space, or to fill it, while preserving the original aspect ratio.
My module extends this functionality by adding a "Pan and Scan" style animation to it. This allows you to either scroll the art/image object side to side, up and down, or in all four directions. It also allows you to zoom in to the image to a desired scale (happy now Verion? ;)).
Example usage:
fe.load_module("pan-and-scan");
local my_art = PanAndScanArt("flyer", 0, 0, 640,480);
my_art.set_fit_or_fill("fill");
my_art.set_anchor(::Anchor.Center);
my_art.set_zoom(4.5, 0.00008);
my_art.set_animate(::AnimateType.Bounce, 0.07, 0.07)
my_art.set_randomize_on_transition(true);
my_art.set_start_scale(1.15);
Breakdown of each command:
First thing we load the module into the layout...
fe.load_module("pan-and-scan");
Then create an instance of the module class. Arguments are: art type, x pos, y pos, surface width, surface height
(Also, you can replace PanAndScanArt() with PanAndScanImage() if you want to use an image in your layout directory)
local my_art = PanAndScanArt("flyer", 0, 0, 640, 480);
Tell the module whether you want to make the loaded art/image "fit" the size of the surface you've created, or to "fill" the surface. I'd recommend sticking with "fill" for the purpose of this module, though you may find a use for "fit" in some cases.
my_art.set_fit_or_fill("fill");
Configure the anchor point for the art/image. When you have zooming and scrolling going on, I find Center to be the best option here. Other choices for the ::Anchor table include .Left, .Top, .Center, .Centre (same as .Center), .Right, and .Bottom.
my_art.set_anchor(::Anchor.Center);
Here is where the fun stuff starts (no offence to liquid8d!). Arguments are: zoom scale, zoom speed
For the scale, note that 1.0 is the actual art/image scale displayed on the surface prior to zooming. So, if you want to end up with the image doubled in size at the end of the zoom animation, you'd enter 2.0
my_art.set_zoom(2.5, 0.0002);
This sets the pan and scan animation. Arguments are: animation type, x/y speed, [y speed].
Choices for the ::AnimateType table include .Bounce, .HorizBounce, and .VertBounce. If using Horiz or Vert, only 1 speed argument is needed.
my_art.set_animate(::AnimateType.Bounce, 0.1, 0.1)
Enabling this will randomize the pan animation direction when transitioning to another list item.
my_art.set_randomize_on_transition(true);
Alter the starting scale of the image after it has been processed by PreserveArt. I found this helps to remove some of the initial "wiggle" as the pan animation bounces from side to side at the beginning.
my_art.set_start_scale(1.15);
I think I've covered everything. Have a play around with it and see what you think. I mostly created this to have animated backgrounds, zooming and panning around large flyer images and such. Let me know if you manage to break it some how and I'll take a look, or if anyone has some suggestions for improvements then I'm all ears!
-
happy now Verion?
You bet!
I'm gonna test it tomorrow - because today I have to beat the clock and get one of my payed projects finished in time.
-
This is exciting. Don't know how I'll use it yet, but I have an idea.
Is there another module I should be loading? I'm only getting a static image and this error:
Script Error in /home/toothpick/.attract/layouts/Panning/layout.nut - wrong number of parameters
_______Code Below
fe.load_module("pan-and-scan");
fe.layout.width=1024;
fe.layout.height=768;
local my_art = PanAndScanArt("fanart", 0, 0, 480, 480);
my_art.set_fit_or_fill("fill");
my_art.set_anchor(::Anchor.Center);
my_art.set_zoom(true, 2.5, 0.0002);
my_art.set_animate(::AnimateType.Bounce, 0.1, 0.1);
-
Script Error in /home/toothpick/.attract/layouts/Panning/layout.nut - wrong number of parameters
Ahh, there was a typo in my post. use this line instead:
my_art.set_zoom(2.5, 0.0002);
ie: get rid of the "true" param and you should be sweet!
-
VERSION 1.1 RELEASED
added the following functions:
set_randomize_on_transition(bool)
set_start_scale(float)
See initial post for updated download and explanation.
-
Chrisvg, thanks. Removing the true did indeed work.
Would it be time consuming to have the zoom choose an x,y to be the center of the final zoom?
-
Would it be time consuming to have the zoom choose an x,y to be the center of the final zoom?
If you just want it to zoom without panning around, you can simply omit the set_animate() function call.
Upon reflection set_animate() is probably a misleading name, but it will only set the panning animation, which is handled separately from the zoom animation.
Also, while it is not possible to set x,y coordinates for the zoom direction, you can use the set_anchor() function to make the zoom to go towards one of the edges instead of the center of the image.
The ::Anchor table includes the following members: Left, Top, Center, Centre (same as Center), Right, Bottom.
So you could call:
my_art.set_anchor(::Anchor.Left);and it will make the zoom go towards the left edge of the image.
Is that what you are looking for?
-
What I mean is say your image is 1000,1000 but you want the end of the zoom to show the center as 300,325.
-
What I mean is say your image is 1000,1000 but you want the end of the zoom to show the center as 300,325.
I see. I don't currently have plans to add support for zooming in to an arbitrary location of the image other than the current anchor points, I'll certainly keep it in mind for future updates to the module.
Alternatively, I don't have any issues with people making changes to the module to suit their own needs. If you want to add the functionality you want, go right ahead! :)
-
This does allow customization, but it's not working as hoped...more of a proof of concept...or proof of failure.
I am enjoying your plugin...the zoom feature reminds me of a Prezi...
layout.nut:
customx <- 1; <2 this is what the width is divided by for the zoom until it's reached.
customy <- 2; <2 this is what the height is divided by for the zoom until it's reached.
preserve-art-nut
::Anchor <-
{
Custom = "Custom",
___________________________
case ::Anchor.Custom:
art.x -= (art.width - _prev_art_width) / ::customx
art.y -= (art.height - _prev_art_height) / ::customy
break;
pan-and-scan.nut
case ::Anchor.Custom:
art.x -= (art.width - _prev_art_width) / ::customx
art.y -= (art.height - _prev_art_height) / ::customy
break;
-
Ninja update - 1.1a
No changes to the PanAndScan module, I just noticed that I had left debug mode enabled in the PreserveArt module by mistake. Debug mode is now disabled by default.
I have updated the original post with a new download link.
-
This looks great! I hope you don't mind but I'm going to include this in the package for the next version of Attract-Mode
-
This looks great! I hope you don't mind but I'm going to include this in the package for the next version of Attract-Mode
Hey raygun!
By all means, I'm happy for it to be included with AM :)
You may also want to include a couple of other things I've posted today - an updated LEDBlinky plugin (http://forum.attractmode.org/index.php?topic=446.msg4470#msg4470) that resolves the crashes at startup, and an enhanced version of the intro video script (http://forum.attractmode.org/index.php?topic=632.msg4476) that handles aspect ratios and monitor rotation.
-
If you choose horizontal, is it supposed to bounce back and forth? It seems to stop when using Horiz when it reaches edge.
-
If you choose horizontal, is it supposed to bounce back and forth? It seems to stop when using Horiz when it reaches edge.
could you please post a code sample and the image you are using that is causing the bug?
also, which version of the module are you using?
-
local l1= PanAndScanArt("laptop",431,845, 69,43);
l1.set_start_scale(0.5);
l1.set_zoom(1.25, 0.01);
l1.set_animate(::AnimateType.HorizBounce,0.2);
I did a git pull and built from source: attract -v Attract-Mode v2.0.0-rc3-1 (Linux, SFML 2.1 +FontConfig +SWF)
Image attached...
When the image reaches left border, it doesn't bounce back.
-
Thanks bionictoothpick,
I've uploaded a bugfix to the original post (version 1.2) .. give it a try and see what you think.
-
Nice module, I need to update robospin with this.
-
Nice module, I need to update robospin with this.
Thanks! I'd be keen to see what you do with it :)
-
Chrisvg!
Thanks for the update. Now it is working as expected...the logo is bouncing back and forth on the laptop.
I'm working on the menu options now to make it a bit more user friendly (my isometric magazine theme).
Thanks again!
-
Thanks for the update. Now it is working as expected...the logo is bouncing back and forth on the laptop.
I'm working on the menu options now to make it a bit more user friendly (my isometric magazine theme).
Great! Glad to hear the update helped to resolve the problem. I knew it had this problem at one point when I was first coding it, but I thought I got it sorted out already! Oh well, it's fixed now :)
Also I haven't forgotten about your earlier request for setting arbitrary zoom-to co-ordinates, I'll see what I can do for you over the Easter break. I'm a bit busy with a top secret project right now, but should have that wrapped up shortly ;)
-
Is it possible to integrate the FadeArt module into this?
I've tried to use the FadeArt Image as the source for pan and scan but nothing happened.
-
Is it possible to integrate the FadeArt module into this?
I've tried to use the FadeArt Image as the source for pan and scan but nothing happened.
Hmmm yeh that might be a pain in the arse. If PreserveArt doesn't support it then PanAndScan isnt going to either. I'll put it on the list of things to look into in a future version tho.
-
Thanks, that would be great.
I really like the pan and scan effect but i don't like the "jump" it does when switching games... that's where FadeArt would come in handy :D
-
Thinking out loud:
I'm want to use the zoom feature on my magazine template so when a button is hit to display game info (history.dat) it zooms in on the notepad, and then displays the text. That's why I want to make the center of the zoom a specific x/y coordinate.
In the meantime I will come up with something else...
-
This module doesn't seem to take the bgart.trigger = Transition.EndNavigation; option into consideration. When used on a pi this causes navigation performance issues because it loads the flyer for each game when moving through the wheel. Does anyone here know how to fix this issue?
local bgart = PanAndScanArt( "flyer", 0, 0, flw, flh);
bgart.preserve_aspect_ratio = false;
bgart.set_fit_or_fill("fill");
bgart.set_anchor(::Anchor.Center);
bgart.set_zoom(4.5, 0.00008);
bgart.set_animate(::AnimateType.Bounce, 0.50, 0.50)
bgart.set_randomize_on_transition(true);
bgart.set_start_scale(1.1);
bgart.trigger = Transition.EndNavigation;
-
Agreed, allowing art.trigger = Transition.EndNavigation would be great.
In the meantime, you can hack it in if you don't mind it being set for all your pan-and-scan stuff. Open up pan-and-scan.nut and find this section on line 80 and add the last line to it:
constructor(name, x, y, w, h, parent = ::fe)
{
if (base.VERSION != PRESERVEART_VERSION)
{
::print("\n***\n*** WARNING: PreserveArt module version mismatch.\n*** PreserveArt version installed: " + base.VERSION + "\n*** PanAndScan expecting version: " + PRESERVEART_VERSION + "\n***\n\n")
}
base.constructor(name, x, y, w, h, parent = ::fe);
art.trigger = Transition.EndNavigation; //Add this line
}
Only issue is the animation still resets to the anchor as you scroll, but still better than a laggy interface.
-
Yeah, I figured this out earlier but thanks anyway :)