PixcelDev [Lexaloffle Blog Feed]https://www.lexaloffle.com/bbs/?uid=16609 Made With PICO-8 GitHub Badges <p>To all of you users maintaining public Github repositories of either your games or supporting libraries for other PICO-8 users, I've just put up a repository containing PICO-8 badges.</p> <p>This way you can add a Made With PICO-8 badge to your readme, alongside any other repo related badges you generally use!</p> <p>Show your support for the tool and enjoy!</p> <p>Link: <a href="https://github.com/JoebRogers/MadeWithPICO-8Badges">https://github.com/JoebRogers/MadeWithPICO-8Badges</a></p> https://www.lexaloffle.com/bbs/?tid=32156 https://www.lexaloffle.com/bbs/?tid=32156 Wed, 31 Oct 2018 11:42:18 UTC PICO-Tween Easings Demo <p> <table><tr><td> <a href="/bbs/?pid=52475#p"> <img src="/bbs/thumbs/pico52473.png" style="height:256px"></a> </td><td width=10></td><td valign=top> <a href="/bbs/?pid=52475#p"> PICO-Tween Easings Demo 1.0.1</a><br><br> by <a href="/bbs/?uid=16609"> PixcelDev</a> <br><br><br> <a href="/bbs/?pid=52475#p"> [Click to Play]</a> </td></tr></table> </p> <p>The demo cart for my tweening/easings library <strong>PICO-Tween</strong>.</p> <p>You can see the thread for the library here: <a href="https://www.lexaloffle.com/bbs/?tid=31241">https://www.lexaloffle.com/bbs/?tid=31241</a></p> <p>Alternately you can view the repository here: <a href="https://github.com/JoebRogers/PICO-Tween">https://github.com/JoebRogers/PICO-Tween</a></p> <hr /> <p>The cart just demonstrates all the available easing functions provided with the library (all easing functions from the traditional Robert Penner easing libraries are ported).</p> <p>Left Arrow and Right Arrow to cycle through the different easings.</p> <p>Enjoy!</p> https://www.lexaloffle.com/bbs/?tid=31246 https://www.lexaloffle.com/bbs/?tid=31246 Sun, 06 May 2018 20:08:36 UTC PICO-Tween and PICO-TweenMachine <p>Hey all! </p> <p>I've recently worked on a couple of different libraries for the PICO-8, which are available on Github. I've posted them around on the subreddit and Discord server to good responses, however have held back from posting here until now!</p> <p>So without further adieu..</p> <p><table style="width:640px" cellspacing=0 cellpadding=10><tr><td bgcolor=#ffeedd><span style="color: #101010;"><strong>PICO-Tween - <a href="https://github.com/JoebRogers/PICO-Tween">Repository</a></strong><br></span></td></tr></table></p> <p>PICO-Tween is a port of the easing functions developed by Robert Penner. This port was based on the Lua port by EmmanuelOga and optimised to suit the PICO-8 by refactoring to remove unnecessary tokens and making it compatible with the way the PICO-8 handles math functions.</p> <p>It comes packaged with some various sourced and ported additional math functions to make some things work, such as asin and acos.</p> <p>It comes with a pretty hefty token count if using every tween, at 2083 tokens, however on average each easing function is only around 40-60 tokens so can just be picked out and slotted in where appropriate along with any math dependencies.</p> <p>It should come pretty easy to use, if you have any experience with tweens, particularly of the Penner variety, in any other language or framework. Here's a small code example that you can paste directly into a cart to see how to get set up with something basic like linear tween:</p> <div> <div class=scrollable_with_touch style="width:100%; max-width:800px; overflow:auto; margin-bottom:12px"> <table style="width:100%" cellspacing=0 cellpadding=0> <tr><td background=/gfx/code_bg1.png width=16><div style="width:16px;display:block"></div></td> <td background=/gfx/code_bg0.png> <div style="font-family : courier; color: #000000; display:absolute; padding-left:10px; padding-top:4px; padding-bottom:4px; "> <pre> function linear(t, b, c, d) return c * t / d + b end local distance = 50 local duration = 1 function downFunc(v) return linear(v, 0, distance, duration) end function upFunc(v) return linear(v, distance, -distance, duration) end local easeProp = 0 local timeElapsed = 0 local currentFunc = downFunc local lastTime = time() local dt = 0 function _update() t = time() dt = t - lastTime lastTime = t timeElapsed += dt if timeElapsed &gt; duration then timeElapsed = 0 if currentFunc == downFunc then currentFunc = upFunc else currentFunc = downFunc end end easeProp = currentFunc(timeElapsed) end function _draw() rectfill(0, 0, 128, 128, 3) circfill(64, 40 + easeProp, 20, 15) end </pre></div></td> <td background=/gfx/code_bg1.png width=16><div style="width:16px;display:block"></div></td> </tr></table></div></div> <p>Which should net you the following results on screen:</p> <img style="margin-bottom:16px" border=0 src="https://www.lexaloffle.com/bbs/files/16609/basic-usage-demo.gif" width=800 height=600 alt="" /> <p>For more example gifs, a demo cart which allows you to cycle through all available tweening functions, and of course the source code, please check out the repository here: <a href="https://github.com/JoebRogers/PICO-Tween">Repository</a></p> <p><table style="width:640px" cellspacing=0 cellpadding=10><tr><td bgcolor=#ffeedd><span style="color: #101010;"><strong>PICO-TweenMachine</strong> - <a href="https://github.com/JoebRogers/PICO-TweenMachine">Repository</a><br></span></td></tr></table></p> <p>However, whilst that's all well and good, it can get quite cumbersome to keep track of and add tween code. There's a lot of increasingly painful boilerplate and it can introduce mess into your codebase pretty quickly.</p> <p>Not to mention that it can be a bit confusing to both read and write for those less experienced!</p> <p>That's where <strong>PICO-TweenMachine</strong> comes in! <strong>PICO-TweenMachine</strong> is a small wrapper extension library intended to support the PICO-Tween library by removing the excess noise of writing tweens and driving them from a centralized place.</p> <p>Instead of the traditional approach, that's all taken care of by the tween_machine object, leaving you to simply set up your tween object with the values you want, such as start and end point, duration and tween type, then leave the wrapper to drive the rest.</p> <p>All you need to do is add your object to the wrapper, set up any callbacks you may like to occur during step events or upon tween completion and then call it in your update function.</p> <p>Here's a code example taking the earlier sample and porting it for use with the new library (this sample assumes the PICO-TweenMachine library is pasted to the top of the cart and won't run just by pasting in this sample):</p> <div> <div class=scrollable_with_touch style="width:100%; max-width:800px; overflow:auto; margin-bottom:12px"> <table style="width:100%" cellspacing=0 cellpadding=0> <tr><td background=/gfx/code_bg1.png width=16><div style="width:16px;display:block"></div></td> <td background=/gfx/code_bg0.png> <div style="font-family : courier; color: #000000; display:absolute; padding-left:10px; padding-top:4px; padding-bottom:4px; "> <pre> function linear(t, b, c, d) return c * t / d + b end local move_distance = 30 local move_duration = 1 local easeprop = 0 function set_ball_position(position) easeprop = position end function reverse_ball_direction(tween) tween.v_start = tween.v_end tween.v_end = -tween.v_end tween:restart() end function _init() ball_tween = tween_machine:add_tween({ func = linear, v_start = -move_distance, v_end = move_distance, duration = move_duration }) ball_tween:register_step_callback(set_ball_position) ball_tween:register_finished_callback(reverse_ball_direction) end function _update() tween_machine:update() end function _draw() rectfill(0, 0, 128, 128, 3) circfill(64, 60 + easeprop, 20, 15) end </pre></div></td> <td background=/gfx/code_bg1.png width=16><div style="width:16px;display:block"></div></td> </tr></table></div></div> <p>As you can see, this approach is much clearer and easy to both understand and extend. </p> <p>The library is both simple to set up and use, as well as very light at only 239 tokens.</p> <p><table style="width:640px" cellspacing=0 cellpadding=10><tr><td bgcolor=#ffeedd><span style="color: #101010;">Example Images<br></span></td></tr></table></p> <img style="margin-bottom:16px" border=0 src="https://www.lexaloffle.com/bbs/files/16609/bounce-out.gif" width=800 height=600 alt="" /> <img style="margin-bottom:16px" border=0 src="https://www.lexaloffle.com/bbs/files/16609/out-in-cubic.gif" width=800 height=600 alt="" /> <p><table style="width:640px" cellspacing=0 cellpadding=10><tr><td bgcolor=#ffeedd><span style="color: #101010;">Links<br></span></td></tr></table></p> <p>Hopefully some of you will appreciate this, if so, please go ahead and test out the demo carts, download the sources and use these libraries in your own projects! I would also appreciate the stars on Github. ;)</p> <p><strong>PICO-Tween - <a href="https://github.com/JoebRogers/PICO-Tween">Repository</a></strong><br /> <strong>PICO-TweenMachine - <a href="https://github.com/JoebRogers/PICO-TweenMachine">Repository</a></strong></p> <p>Thank you all for reading, I appreciate it!</p> https://www.lexaloffle.com/bbs/?tid=31241 https://www.lexaloffle.com/bbs/?tid=31241 Sat, 05 May 2018 21:00:05 UTC