Parental Gates (Numeric)

Parental Gates (Numeric) is a module to create 'numeric simple instruction gates' that comply with Apple's Parental Gates Guide.

ex1 ex2 ex3 ex4

Need a child-gate! Don't spend hours coding your own. Just use the provided art, or supply your own, and get done fast!

This module:

Basic Usage

A. Activate Plugin

First, purchase the module on Corona Marketplace to activate it.

B. Require it

Require the module where you need it.

local gate = require "gate"

C. Code Listeners

Write a success listener and an optional cancel listener.

local function onSuccess()
   -- User completed gate.  Do something now.
end

local function onCancel()
   -- User canclled gate.  Do something?
end

D. Show The Gate

Show the gate using provided art or your own.

gate.new( {
   imagesPath   = "images/numbers_ex1",
   onSuccess    = onSuccess,
   onCancel     = onCancel,
} )

Art

This gate comes with four samples of art, but creating your own is easy.

Tip 1: See the supplied art to see how your images should fit together.

Tip 2: All images should be PNGs.

Tip 3: All buttons have two versions: XXX_unsel.png and XXX_sel.png, representing the unselected and selected representations.

DIY Gate Art In 5 Easy Steps

  1. Create the background tray image.
  2. Create a number frame image, ensuring it is proportional to tray image.
  3. Create the number buttons 0 .. 9, ensuring they are proportional to the tray image.
  4. Create the back button (same size as the number button images).
  5. Create the exit button (any size you like).

kenney

When you are done, you will have 26 pieces of art:

Configuring Gates

The gate builder function new() takes a single argument: params

Tip: The word proportional is used a lot below. This means the value is a number relative to the full sized art. It may later be auto-scaled to make things fit. The key thing to remember is, once you get a gate to look the way you want on one device, it will look good on all devices and have the same proportional layout.

verticalRatios

These are the default vertical ratios (expressed as percentage of tray.png height):

local verticalRatios  { 
    title           = 0.08, -- Title
    numbers             = 0.28, -- Numbers
    instructions    = 0.45, -- Instructions
    question        = 0.55, -- Question
    buttons             = 0.71, -- Inputs
}

In example two, these are adjusted because the title isn't shown:

local myGate = gate.new( {
      imagesPath              = "images/numbers_ex2",
      onSuccess               =  onSuccess,
      onCancel                = onCancel,
      frameColor              = { 123/255, 1, 191/255 },
      trayColor               = { 0.2, 0.3, 0.5 },
      instructionsFontColor   = { 1,1,1 },
      questionFontColor       = { 1, 1, 0 },
      title                   = "", -- No title!    
      instructions            = "enter these numbers:",

      -- Adjust vertical layout
      verticalRatios          =  
      { 
         title          = 0.0,
         numbers        = 0.22,
         instructions   = 0.40,
         question       = 0.52,
         buttons        = 0.68,
      },
   } )

numberNames

The default numberNames table is defined as:

local numberNames = {}
numberNames[0] = "ZERO"
numberNames[1] = "ONE"
numberNames[2] = "TWO"
numberNames[3] = "THREE"
numberNames[4] = "FOUR"
numberNames[5] = "FIVE"
numberNames[6] = "SIX"
numberNames[7] = "SEVEN"
numberNames[8] = "EIGHT"
numberNames[9] = "NINE"

If you wanted to use Italian, you could do this:

local numberNames = {}
numberNames[0] = "ZERO"
numberNames[1] = "UNO"
numberNames[2] = "DUO"
numberNames[3] = "TRE"
numberNames[4] = "QUATTRO"
numberNames[5] = "CINQUE"
numberNames[6] = "SEI"
numberNames[7] = "SETTE"
numberNames[8] = "OTTO"
numberNames[9] = "NOVE"

gate.new( {
   imagesPath   = "images/numbers_ex1",
   onSuccess    = onSuccess,
   onCancel     = onCancel,
   numberNames = numberNames
} )

RoamingGamer Copyright © Roaming Gamer, LLC. 2008-2017; All Rights Reserved