RSS

Monthly Archives: July 2018

Tutorial – Shrink & Grow Images

Title

Join Community: http://Community.AppyBuilder.com

Drag, Drop, Snap Blocks, Build app

Tutorial, written by imagPeter Peter Mathijssen

This tutorial adds new functionality to “Rotating Images” post found HERE. It shows how to add Grow & Shrink effects to images.

For this effect, 2 buttons and 2 clock components were added.

Selectie_999(421)

The Clock2.timer block makes the image 10 pixels bigger every 1/10th of a second. The clock1.timer block makes the image 10 pixels smaller every 1/10th of a second. The blocks for Grow and Shrink look like image below:

Selectie_999(422)

Looking for .aia source file? Get it HERE.

Join forum community for tutorials, discussions, technical questions

http://Community.AppyBuilder.com

Website: http://AppyBuilder.com

Share, Like us below 🙂

 

Advertisements
 
Leave a comment

Posted by on July 8, 2018 in Uncategorized

 

Tutorial – Rotating Images

Title

Join Community: http://Community.AppyBuilder.com

Drag, Drop, Snap Blocks, Build app

This tutorial, written by imagPeterPeter Mathijssen, shows you how you can get use AppyBuilder to create a nice graphical effects.

Assumption: You have basics knowledge of AppyBuilder for creating projects / apps.

Media image files: The images were used from site HERE

For this tutorial, we use Image component and its RotationAngle block:

Selectie_999(417)

The end result will look like image below which uses a Clock non-visible component:

Image below shows list of components that are used for this tutorial. It also shows the media (asset images):
Selectie_999(414) Selectie_999(415)

Button2 through Button7 Click blocks, show how to switch between different asset images. Button1.Click block shows how to start / stop (toggle) animation using Clock component.  Once animation (Clock) is enabled, then Clock1.Timer will automatically be triggered and continues to change the the image RotationAngle, giving it the end result that you see in the gif image below:

Note: The rotation angle of the image is changed by 60 degrees when the clock fires.

You can press, Button 1 to 6 to alternate between images. Press the Start/Stop button to Start or Stop the rotation.

Looking for .aia source file? Get it HERE.

 

Join forum community for tutorials, discussions, technical questions

http://Community.AppyBuilder.com

Website: http://AppyBuilder.com

Share, Like us below 🙂

 

 
Leave a comment

Posted by on July 7, 2018 in Uncategorized

 
 
%d bloggers like this: