RSS

Category Archives: Uncategorized

Using GenyMotion with AppyBuilder

Title

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

Drag, Drop, Snap Blocks, Build app

AppyBuilder FREE online platform allows individuals to design and build Android mobile apps, using Drag-n-Drop interface. You can use Wi-Fi or USB to connect to AppyBuilder companion for Live-Development testing.

Below is a tutorial from  Husain Al-Haboubi, a community member in AppyBuilder forum HERE. It discusses using GenyMotion emulator for Live Development.

Installing Emulator

  • Download and install GenyMotion: https://www.genymotion.com/#!/download
  • Download and install Oracle VM VirtualBox (Currently, only v5.1.26 works): https://www.virtualbox.org/wiki/Downloads
  • Open GenyMotion and install and add a virtual device – choose any one.
  • Close GenyMotion and open Oracle VM VirtualBox. Choose the virtual device you have just added then press Settings. From Network >> Adapter 2 choose Bridged Adapter from Attached to. Then click OK. (Leave Adapter 1 as Host-only Adapter)
  • Above will create a unique IP address for the Virtual Device in your home network.
  • Open the GenyMotion again and double click the virtual device. This will open the virtual device.
  • The virtual device has no Google Play Store and it has to be installed manually by yourself.
  • After you have successfully ran the emulator and it’s up and running, click on Open GAPP on the top right corner of the emulator. Click Agree and Install. This will install Google Play on your emulator and will restart your emulator.
  • At this time, you are done and you can open Google Play and sign in to your Google account then download and install AppyBuilder companion from Play Store.
  • Note: If you are having issues with the companion identifying the Wi-Fi, open up Oracle VM VirtualBox >> Select the device >> Settings >> Adapter 2 >> Advanced >> Change Adapter Type to PCnet-Fast III

Using Camera in the Virtual Device

If your app uses Camera and you would like to perform Live-Testing, follow instructions below

  • Close all virtual devices and close GenyMotion.
  • Download and install ManyCam: http://download.manycam.com/
  • Open ManyCam, click the small arrow on screen 1 then Desktop >> Area under cursor.
  • Keep ManyCam open then open Oracle VM VirtualBox. Click on the virtual device and then settings. Click Display >> Video Capture. Check Enable Video Capture.
  • Next, open the virtual device. When it’s open, click on the camera icon on the right bar (Third icon).
  • Press ON then for front camera, choose Webcam 0 and for back camera, choose  Webcam 0.
  • Click preview to make sure the camera is working.

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 March 21, 2018 in Uncategorized

 

AppyBuilder Custom Image Borders

Title

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

Drag, Drop, Snap Blocks, Build app

Below is a preview of coming feature in AppyBuilder that will allow you to transform an image into various shapes as seen in video below. This transformation will be achievable using only 1-AppyBuilder-block.

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 February 18, 2018 in Uncategorized

 

Building Android Wallpaper app

Title

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

Drag, Drop, Snap Blocks, Build app

TUTORIAL DIFFICULTY: Easy
Requires basic understanding of AppyBuilder platform to build Android apps using drag-and-drop

VIDEO DESCRIPTION:
This video tutorial shows you how to quickly build Android Wallpaper app that will allow you to change the Homescreen wallpaper using images that can be either from asset folder or SD card or Internet or a photo from your device’s gallery.

Questions/comments? Check the forum community post HERE

Join forum community for tutorials, discussions, technical questions

http://Community.AppyBuilder.com

Website: http://AppyBuilder.com

Share, Like us below 🙂

 

 
2 Comments

Posted by on February 16, 2018 in Uncategorized

 

Scratch Card using Sprites on a Canvas

Title

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

Drag, Drop, Snap Blocks, Build app

Tutorial & Video Production:   By: Pixii Bomb

TUTORIAL DIFFICULTY: Medium
You are not supposed to follow along step-by-step, second-by-second. Please do not attempt to follow at this pace, it would be impossible. You should be able to follow along easily if you are able to find blocks by looking at a screenshot.

VIDEO DESCRIPTION:
Simulate scratching off a circle by using a simple animation with Image Sprites and a Clock. In this mini-game, users get 3 chances to find a cherry on a scratch card. If the user finds 1 cherry, they get 10 points. If the user finds 2 cherries, they get 25 points, and if the user finds 3 cherries they get 100 points. The icons on the scratch card will be generated randomly each time the user plays the mini-game. We’ll use test labels to help us “cheat” during development.

Need project .aia? Get it community forum post 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 February 11, 2018 in Uncategorized

 

Creating a Shake-Effect

Title

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

Drag, Drop, Snap Blocks, Build app

 Tutorial by Italo

Tutorial Difficulty: Medium
This tutorial assumes you already have experience building apps using AppyBuilder

Shake Effect 

A shake effect is a visual indicator that shows a window or component shaking when we type a wrong login information, such as a wrong password, username, etc.

In this tutorial, I’ll show you how how to create this effect using AppyBuilder by using the TextUtils extension which comes included in every AppyBuilder project.

This is how it looks when finished (You can make any component shake, by just changing the component ID in the procedure parameter).

This video shows the Shake-Effect in-action

Create app:

Use AppyBuilder to start a new app

Design Editor:
First, we need to add the AppyBuilder built-in TextUtils extension to design-editor

Next, add a clock, with properties shown below

Blocks Editor:

In the blocks editor, we create three variables as shown below:

Next, we create a procedure:

Next, from your components block, select the Clock that was added in design-editor and add blocks as shown block.  The image show blocks for the Timer event that once enabled will be triggered every 50 milliseconds until it is disabled:

  • First, it makes the device vibrate.
  • Then it uses the method TextUtils.Rotate to rotate the specified component in the angle provided. But here’s the trick: Every time it gets here the angle is NEGATED, so if the angle is 3 in the first event, next will be -3, then the next will be 3, -3, 3, -3 etc, etc. That way, the components gets rotated rapidly between 3 degrees and -3 degrees, simulating a shaking movement.
  • How do we negate a number? By multiplying it by -1 (i.e. 8x-1=-8, -4x-1=4)
  • Now we subtract 1 from ShakeDuration, which controls how many shakes we want to make.
  • If ShakeDuration = 0, then we need to stop shaking, but we can’t leave the component as it is, because it will be rotated.
  • So we do one last rotate to angle 0 to leave it straight.
  • And lastly we turn off the timer, to stop the effect.

 

Finally, we need to Call/Invoke the procedure to create the shake-effect; where: ShakeComponent: Is the ID of the component you want to shake (can be any component!), ShakeAngle: Is how much the component will rotate with each shake, and ShakeDuration is how many shakes you want the component to make before stopping.

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 February 11, 2018 in Uncategorized

 

Notifier Dialog and Alert Messages

Title

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

Drag, Drop, Snap Blocks, Build app

Dialog Windows A dialog is a small window that prompts the user to make a decision or enter additional information. A dialog does not fill the screen and is normally used for modal events that require users to take an action before they can proceed. For example the Dialog below is used to show a Help screen:

AppyBuilder makes it very simple to create Dialog windows. You use the Notifier component and its ShowMessageDialog block to create the window. This block includes ability to include html tags. It also includes an animation style. Use numbers 1 to 4 to specify animation type (1= pop-up, 2=slide from left, 3=slide from right, 4=slide from bottom, 5 (or larger) means no animation).

Here is a demo showing different animationTypes:

 

Alert Messages

Alert messages provide simple feedback about an operation in a small popup. It only fills the amount of space required for the message and the current activity remains visible and interactive. Alerts automatically disappear after a timeout.

There are 6 type of Notifier Alert messages that can be displayed either at center or bottom of screen. To display Alert messages, use Notifier.ShowAlert block: 

The above block includes a socket for alertType. Use any number between 1 to 6 to display messages of different style:

 

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 February 2, 2018 in Uncategorized

 

Material Design Dialog and Toast Messages

Title

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

Drag, Drop, Snap Blocks, Build app

Material Design Dialog and Toast Message

AppyBuilder includes a Notifier component that allows building beautiful Android apps that includes Toast (Alert) messages and pop-up Dialog  as shown in video below:

 

Alert Messages

There are 6 type of Alert messages that can be displayed either at center or bottom of screen. To display Alert messages, use Notifier.ShowAlert block: 

The above block includes a socket for alertType. Use any number between 1 to 6 to display messages of different style:

Dialog Messages:

To display pop-up Dialog window, use Notifier.ShowMessageDialog. This block also includes a slot for animationType where values of 1 to 3 can be plugged in. The animationType is used to animate pop-up from Top, Side or Bottom:

If you like to display additional button, use Notifier.ShowChooseDialog block that allows you to display 2 buttons:

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 January 28, 2018 in Uncategorized

 
 
%d bloggers like this: