Back

CreateImage

Image creates an Image object to display an image from a file and/or allow users to draw with the drawing methods.

app.CreateImage( file, width, height, options, w, h ) -> app object - Image

Example - Original Size



function OnStart()
{
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );

    img = app.CreateImage( "/Sys/Img/Droid1.png" );
    img.SetOnTouch( img_OnTouch );
    lay.AddChild( img );

    app.AddLayout( lay );
}

function img_OnTouch( ev )
{
    if( ev.action=="Down" )
        app.ShowPopup( "Ouch!" );
}
    Copy     Copy All       Run      

Example - Stretched



function OnStart()
{
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );

    img = app.CreateImage( "/Sys/Img/Droid1.png", 0.5, 0.7 );
    img.SetOnTouch( img_OnTouch );
    lay.AddChild( img );

    app.AddLayout( lay );
}

function img_OnTouch( ev )
{
    if( ev.action=="Down" )
        app.ShowPopup( "Aaaargh!" );
}
    Copy     Copy All       Run      

Example - Maintain Aspect



function OnStart()
{
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );

    img = app.CreateImage( "/Sys/Img/Droid1.png", 0.5, -1 );
    img.SetOnTouch( img_OnTouch );
    lay.AddChild( img );

    app.AddLayout( lay );
}

function img_OnTouch( ev )
{
    if( ev.action=="Down" )
        app.ShowPopup( ev.x[0] + ", " + ev.y[0], "Short" );
}
    Copy     Copy All       Run      

Example - Images



<sample Draw Shapes>
function OnStart()
{
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );

    img = app.CreateImage( null, 0.8, 0.8 );
    lay.AddChild( img );

    img.SetColor( "#8888ff" );
    img.SetPaintColor( "#ff0000" );
    img.DrawCircle( 0.5, 0.5, 0.1 );
    img.DrawRectangle( 0.7, 0.7, 0.05 );

    app.AddLayout( lay );
}
    Copy     Copy All       Run      

The following methods are avaiable on the Image object:

  Clear()
  Destroy()
  Draw( func, p1, p2, p3, p4, p5, p6, p7 )
  DrawArc( x1, y1, x2, y2, start, sweep )
  DrawImage( image, x, y, w, h, angle, mode )
  DrawLine( x1, y1, x2, y2 )
  DrawPoint( x, y )
  DrawRectangle( x1, y1, x2, y2 )
  DrawText( txt, x, y )
  Explode()
  Flatten()
  Focus()
  GetAbsHeight() -> number - integer
  GetAbsWidth() -> number - integer
  GetHeight( options ) -> number - fraction of screen height
  GetLeft( options ) -> number - fraction of screen width
  GetName() -> string - "name"
  GetPixelColor( x, y ) -> list - [ red, green, blue ]
  GetPixelData( format, left, top, width, height ) -> string - "data"
  GetPosition( options ) -> object - { left: fraction of parent width, top: fraction of parent height, right: fraction of parent width, bottom: fraction of parent height }
  GetTop( options ) -> number - fraction of screen height
  GetType() -> string - "Image"
  GetVisibility() -> string - "Show" or "Hide" or "Gone"
  GetWidth( options ) -> number - fraction of screen width
  Gone()
  Hide()
  IsEnabled() -> boolean
  IsOverlap( obj, depth ) -> boolean
  IsVisible() -> boolean
  Move( x, y )
  Release()
  Reset()
  Scale( x, y )
  SetName( name )
  SetScale( x, y )
  Show()
  Skew( x, y )
  Update()
  _auto -> boolean
  _gfb -> string
  id -> string - "#id"

string - path to file or folder ( "/absolute/..." or "relative/..." )
number - fraction of screen width
number - fraction of screen height
string - "fix" or "alias" or "ScaleCenter" or "async" or "FontAwesome" or "Resize"
number - integer
number
set color effects
clear wimage contrastent
?
destroys object
unknown
?
number - angle in degrees ( 0 - 360 )
DrawArc
DrawCircle
app object - app image
DrawImage
list
draw image using format matrix (list[9])
DrawLine
draw single pixel
DrawRectangle
list - [ data ]
draws a graph in relation to the range
string
DrawText
destroys object with explode animation and sound
?
?
get height in pixels
get width in pixels
get screen relative height
get distance to left parent border
return name set via SetName
[r,g,b] values between 0 and 255
string - "rawbase64" or "pngbase64" or "jpgbase64"
get distance to upper parent border
GetVisibility
get screen relative width
Set visibility "Gone"
Set visibility "Hide"
IsEnabled
app object
return wether obj overlap with an other
IsVisible
?
?
?
rotate image contrastent
number - factor
scale image contrastent
alpha value between 0 and 255
boolean
en/disable updating image after drawing
string -
  hexadecimal: "#rrggbb", "#aarrggbb"
  colourName: "red", "green", ...
SetBackColor
SetBackColorRadial
changes the background image
set contrastent str_col
string - "Add" or "Multiply" or "?"
adjust color
en/disable object
change font style
string - path to file or folder ( "/absolute/..." or "relative/..." ) or app image
set image from file or other image object
set stroke width in pixels
move object from current position
number - milliseconds
delay between two OnTouch events
change name
function()
?
function( self )
callen when object long pressed
function( event )
called when user touches object
function( event )
called when finger comes down
function( event )
called when finger was moved over screen
function( event )
called when finger leaves screen
set surrounding borders
SetPanum_intColor
string - "fill" or "line" or "?"
SetPanum_intStyle
SetPixelData
SetPixelMode
SetPosition
SetScale
change object size
SetTextSize
SetTouchable
string - "Show" or "Hide" or "Gone"
change visibility mode
Set visibility "Show"
?
?
?
neccessary when using SetAutoUpdate(false)
if _auto is true the canvas will be updated automatically when something was drawn.
will be modified from SetAutoUpdate(onooff)
draw commands
object id
{
    source: app object,
    action: string - "Down" or "Move" or "Up",
    count: number - integer,
    X: number - fraction of screen width,
    Y: number - fraction of screen height,
    x: list - [ x1, x2, x3 ],
    y: list - [ y1, y2, y3 ]
}