Layouts are container objects which are used to visually organize graphical objects (controls), such as text, buttons and images on the screen.
lay = app.CreateLayout(
type,
options )
→
app object: Layout
There are 3 types of layout: “Linear”, “Absolute” and “Frame”.
Layouts are transparent by default but you can set a background image which can be tiled or stretched to fill the layout. You can also set a background color or background gradient.
You can add child objects to the Layout using the AddChild function: lay.AddChild( object );
The alignment of chlld objects within a layout can be set by adding the options “Left”, “Right”, “Bottom” and “VCenter”, by default objects will be aligned “Top,Center”.
Linear Layouts
Linear layouts are probably the most useful type and are used to organize controls in either the default “Vertical” or “Horizontal” direction on screen.
Example - Vertical
function OnStart()
{
lay = app.CreateLayout( "Linear", "Vertical" );
btnA = app.CreateButton( "A", 0.2, 0.1 );
lay.AddChild( btnA );
btnB = app.CreateButton( "B", 0.2, 0.1 );
lay.AddChild( btnB );
btnC = app.CreateButton( "C", 0.2, 0.1 );
lay.AddChild( btnC );
app.AddLayout( lay );
}
Example - Horizontal
function OnStart()
{
lay = app.CreateLayout( "Linear", "Horizontal,FillXY" );
btnA = app.CreateButton( "A", 0.2, 0.1 );
lay.AddChild( btnA );
btnB = app.CreateButton( "B", 0.2, 0.1 );
lay.AddChild( btnB );
btnC = app.CreateButton( "C", 0.2, 0.1 );
lay.AddChild( btnC );
app.AddLayout( lay );
}
By default Layouts will auto-size to wrap their contents but you have 3 more options as to how a layout sizes within it's parent: “FillX”, “FillY” and “FillXY”.
Example - Combined
function OnStart()
{
layVert = app.CreateLayout( "Linear", "Vertical,FillXY" );
btnA = app.CreateButton( "A", 0.6, 0.1 );
layVert.AddChild( btnA );
layHoriz = app.CreateLayout( "Linear", "Horizontal" );
layVert.AddChild( layHoriz );
btnB1 = app.CreateButton( "B1", 0.2, 0.1 );
layHoriz.AddChild( btnB1 );
btnB2 = app.CreateButton( "B2", 0.2, 0.1 );
layHoriz.AddChild( btnB2 );
btnB3 = app.CreateButton( "B3", 0.2, 0.1 );
layHoriz.AddChild( btnB3 );
btnC = app.CreateButton( "C", 0.6, 0.1 );
layVert.AddChild( btnC );
app.AddLayout( layVert );
}
Frame Layouts
Frame layouts are used to display objects in front or behind each other. Every time the AddChild function is called on a Frame layout, the child object is placed in a new layer in front of the previously added object at the top left of the frame.
Frame Layouts are useful if you wish to do animated Flips or Slides to reveal layers of objects or use transparency.
Example - Image Swap
function OnStart()
{
lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
layFrm = app.CreateLayout( "Frame" );
img1 = app.CreateImage( "/Sys/Img/Droid1.png", 0.5 );
layFrm.AddChild( img1 );
img2 = app.CreateImage( "/Sys/Img/Hello.png", 0.5 );
img2.SetVisibility( "Hide" );
layFrm.AddChild( img2 );
lay.AddChild( layFrm );
btn = app.CreateButton( "Press Me" );
btn.SetMargins( 0,0.1,0,0 );
btn.SetOnTouch( btn_OnTouch );
lay.AddChild( btn );
app.AddLayout( lay );
}
function btn_OnTouch()
{
if( img2.GetVisibility() == "Hide" )
img2.SetVisibility( "Show" );
else
img2.SetVisibility( "Hide" );
}
Absolute Layouts
Absolute layouts ignore all alignment options and allow the absolute positioning of controls by calling the SetPosition and SetSize functions of each of the child objects. However, you are encouraged use linear layouts for most of your programs, unless it is absolutely necessary.
Methods
The following methods are available on the Layout object:
boolean
app object
number
string
unknown
number: factor
number: fraction (0..1)
number: integer
number: milliseconds
number: -180..180
number: -100..100
number: 0..100
number: 0..0.99 or 1..256
string:
hexadecimal: “#rrggbb”, “#aarrggbb”
colourName: “red”, “green”, ...
string: comma “,” separated
string: path to file or folder ( “/absolute/...” or “relative/...” )
string: “Linear” or “Absolute” or “Frame”
string: comma “,” separated: “TouchThrough”,
“TouchSpy”,
“Left” or
“Top” or
“Right” or
“Bottom” or
“Center” or
“H/VCenter”,
“Wrap”,
“Horizontal” or
“Vertical”,
“FillX/Y”
string: “Flip” or “FadeIn” or “FadeOut” or “CrossFade” or “SlideFromBottom” or “SlideFromLeft” or “SlideFromRight” or “SlideFromTop” or “SlideToBottom” or “SlideToLeft” or “SlideToRight” or “SlideToTop” or “ScaleFromBottom” or “ScaleFromLeft” or “ScaleFromRight” or “ScaleFromTop” or “ScaleToBottom” or “ScaleToLeft” or “ScaleToRight” or “ScaleToTop”
string: “px”
string: “screen”, “px”
string: “left-right” or “right-left” or “top-bottom” or “bottom-top” or “bl-tr” or “br-tl” or “tl-br” or “tr-bl”
string: “repeat”
string: “Add” or “Multiply” or “clear” or “darken” or “lighten” or “overlay” or “screen” or “xor” or “src_in” or “src_out” or “src_atop” or “src_over” or “dst_in” or “dst_out” or “dst_atop” or “dst_over”
string: “Left”, “Top”, “Right”, “Bottom”, “VCenter”, “HCenter”, “FillX”, “FillY”, “FillXY”
string: “px” or “sp” or “dip” or “mm” or “pt”
string: “Horizontal” or “Vertical”
string: “px” or “sp” or “dip” or “dp” or “mm” or “pt”
string: “Show” or “Hide” or “Gone”
string: “Linear.None” or “Quadratic.In/Out” or “Cubic.In/Out” or “Quartic.In/Out” or “Quintic.In/Out” or “Sinusoidal.In/Out” or “Exponential.In/Out” or “Circular.In/Out” or “Elastic.In/Out” or “Back.In/Out” or “Bounce.In/Out”
object: {
source,
action,
count, x: [
x1,
x2,
x3 ], y: [
y1,
y2,
y3 ] }
object: {
source,
action,
count, x: [
x1,
x2,
x3 ], y: [
y1,
y2,
y3 ] }
object: {
source,
action,
count, x: [
x1,
x2,
x3 ], y: [
y1,
y2,
y3 ] }
object: {
source,
action,
count, x: [
x1,
x2,
x3 ], y: [
y1,
y2,
y3 ] }
object: {
x,
y,
w,
w,
sw,
sh,
rot }
list: boolean,char,byte,short,int,long,float,double,String,CharSequence,...
function()
lay.AddChild
Adds a control to the layout.
lay.AdjustColor
Adjust the visual color effect of the control by setting the Hue (by angle in degrees in a color circle), the saturation, brightness and contrast of the control.
lay.Animate
Animates the layout. Available animations are Fade, Flip, Slide or Scale.
lay.ChildToFront
Moves a child in front of all other children.
lay.ClearFocus
Removes the focus of the control so that the user no longer has immediate access to it.
lay.DestroyChild
Destroys and removes a child from the layout.
lay.Focus
Set the focus to the control so that the user can interact with it immediately.
lay.GetAbsHeight
Get the absolute height of the control in pixels.
lay.GetAbsWidth
Get the absolute width of the control in pixels.
lay.GetChildOrder
Returns the z order of a child.
lay.GetHeight
Get the height of the control as screen height relative float or in pixels with the px option.
lay.GetLeft
Get the distance from the control to the left parent border as width relative float or in pixels with the px option.
lay.GetParent
Returns the parent control object where the object was added to - commonly a layout.
lay.GetPosition
Returns data about the position and size of the control.
If the screen option is given the position on the screen will be returned. Otherwise relative to the parent control.
The px options turns the relative values into pixels.
lay.GetTop
Get the distance from the control to the upper parent border as height relative float or in pixels with the px option.
lay.GetType
Returns the control class name.
lay.GetVisibility
Returns the current visibility state of the control. The Values are:
Show: visible
Hide: invisible but still consuming space
Gone: invisible and not consuming space
lay.GetWidth
Get the width of the control as screen width relative float or in pixels with the px option.
lay.Gone
Hides the control without consuming any more layout space as if it were never there.
lay.Hide
Hide the control but keep the layout space free.
lay.IsEnabled
Returns whether the control is currently useable by the user.
lay.IsOverlap
Returns whether the control overlaps with another by a given distance.
lay.IsVisible
Returns whether the control is currently visible to the user, ignoring overlaying controls.
lay.MethodAllows access to other functions defined on the object in Java via reflection.
Note: This function is a premium feature. Please consider subscribing to Premium to use this feature and support DroidScript in its further development.
lay.RemoveChild
Removes a child from the layout.
lay.SetBackAlpha
Set the transparency of the background by an alpha value between 0 (no transparency) and 0.99 (full transparent) or 1 (no transparency) and 256 (full transparent)
lay.SetBackColor
Changes the background color of the control.
lay.SetBackGradient
Define the background color of the control with a gradient. The default gradient direction is from top to bottom, but you can change it from left to right and the reversed versions of course.
lay.SetBackGradientRadial
Define a radial color gradient for the background of control.
lay.SetBackground
Changes the background to an image which can be repeated using the repeat option.
An image which is often used with that option is '/res/drawable/pattern_carbon' - try it out!
lay.SetColorFilterAdjust the visual color effect with a color and a given BlendMode. More information about BlendMode can be found in the
Android Developer page.
lay.SetEnabled
En/Disable the control physically and visually so that the user can/can not access the control. Events like OnTouch will still be fired.
lay.SetGravity
Adjust the placing of contained children.
lay.SetMargins
Define a distance to other controls on each side of the control.
lay.SetOnChildChange
Defines a callback function which is called when the content of a child control has beed changed by the user.
lay.SetOnLongTouch
Define a callback function which is called when the object has been long pressed.
lay.SetOnTouch
Define a callback function that is called when the user touches the control. In addition, an event object is passed to the callback function to obtain information about the touch type, the touch position(s), the amount of touches and the control that was touched.
lay.SetOnTouchDown
Define a callback function which is called when the user started toching the control.
lay.SetOnTouchMove
Define a callback function which is called when the user drags his finger over the screen.
lay.SetOnTouchUp
Define a callback function which is called when the users finger leaves the screen.
lay.SetOrientation
Change the children orientation.
lay.SetPadding
Define distances that elements within the control are to maintain from the control borders.
lay.SetPosition
Defines the position and size for the control if the parent is an absolute layout.
lay.SetScale
Scales the control along with its contents by the factors passed to the function.
lay.SetSize
Change the size of the control in either screen relative values or in pixels if the px option was given.
lay.SetTouchable
En/Disables touch events to be fired on the control. Other events like OnChange will still be fired.
lay.SetTouchThrough
Define whether the layout should forward OnTouch events to underlying controls.
lay.SetVisibility
Change the visibility of the control to one of the available modes:
Show: visible
Hide: invisible but still consuming space
Gone: invisible and not consuming space
lay.Show
Set the visibility of the control to “Show”.
lay.Tween
Performs an animation on the control.
The target object is for the position, size and rotation that the control has at the end of the animation.
The type specifies the behavior and the speed of the animation. Separated by a dot, you must also specify whether you want to apply this behavior to the beginning (In), end (Out), or to both (InOut) times of the animation.
With the amount of repeats you can control how many times you want to play the animation.
If you have jojo activated, the animation will alternate between forward and backward playback, so that if the repetition value is odd, the control will be at the start position again at the end of the animation.
Finally the callback function will be called after the animation has finished. Well, it's about time!