Button text align left.

[Richweb]

Is their any options to change the default alignment of the text inside app button?

the text is default aligned to the center and I want it to be aligned left inside a button.

 var btn = app.CreateButton( "Left Aligned Text", 0.4, -1, "Left" );

This doesn't work!

any tricks?

[BareK]

I dont know if it's possible, but as a replacement solution you could use a text control and make it behave like a button.
Take a look at the "Icon Fonts" built-in sample.

[Steve Garman]

I see Barek replied while I was working on some sample code.

I would do something like this.

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

txtBtn = app.CreateText("My Button", 0.4, -1, "Left");
txtBtn.SetBackColor("#666666");
txtBtn.SetPadding(0.01, 0.01, 0.01, 0.01);
txtBtn.SetOnTouchDown(txtBtn_OnTouchDown);
txtBtn.SetOnTouchUp(txtBtn_OnTouchUp);
txtBtn.SetTextSize(16);
lay.AddChild(txtBtn);

app.AddLayout(lay);
}

function txtBtn_OnTouchDown()
{
this.SetBackAlpha(0.5);
}

function txtBtn_OnTouchUp()
{
this.SetBackAlpha(1);
app.ShowPopup("Pressed");
}

[BareK]

I modified your sample to try to get the closest to the default button look (just in case).

I used #ARGB instead of #RGB + SetBackAlpha because .SetBackColor resets the alpha value previously setted by SetBackAlpha.

I also put some pattern on the background to bring out transparency.

function OnStart()
{  
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );
    lay.SetBackground( "/Sys/Img/Hello.png", "Repeat" );

   
    txtBtn = app.CreateText( "My Button", 0.4, -1, "Left" );

    txtBtn.SetPadding( 0.015, 0.015, 0.015, 0.015 );
    txtBtn.SetOnTouchDown( txtBtn_OnTouchDown );
    txtBtn.SetOnTouchUp( txtBtn_OnTouchUp );
    txtBtn.SetTextColor( "#FFFFFF" );
    txtBtn.SetTextSize( 16 );
    txtBtn.ColorNormal  = "323232";
    txtBtn.ColorTouched = "B2B2B2";
    txtBtn.SetBackColor( "#B2" + txtBtn.ColorNormal );
    lay.AddChild( txtBtn );
   
    btn = app.CreateButton( "My Button", 0.4, -1, "Left" );
    btn.SetMargins( 0, 0.1, 0, 0 );
    btn.SetTextSize( 16 );
    lay.AddChild( btn );
       
    app.AddLayout( lay );
}

function txtBtn_OnTouchDown()
{  
    this.SetBackColor( "#B2" + this.ColorTouched );
}

function txtBtn_OnTouchUp()
{
    this.SetBackColor( "#B2" + this.ColorNormal );
    app.ShowPopup( "Pressed" );
}

[Richweb]

I tried using the text control as a button, it actually works as per the look and design, but when it comes to the touch event, it behaves a bit different.

• touch down over a text control and then slide your finger away from it to any other element or empty space and then remove your finger away from the screen. the TouchDown event gets triggered ( No Issue ). but the TouchUp event is also triggered ( Issue ).
• If you perform the same test over a button control, the default OnTouch event is not triggered if we remove focus from the button object to any other one.

But still. Text control is the only solution.

[BareK]

The OnTouch callbacks receives an event parametter from which you can get the touches coordinates.
You can then check in OnTouchUp if the finger is still upon the control.

A bit of infos here:
https://groups.google.com/d/topic/androidscript/EgNaexBo2C8/discussion

[Guest3450D]

The minus of this script is that when you press (not releasing) the bottom button and divert it aside, it does not perform the task, because the focus is lost, and the upper one is yes.

[BareK]

Here are the modifications to allow cancel by moving fingers out of the text-button:

function txtBtn_OnTouchDown()
{
this.Canceled = false;

this.SetBackColor( "#B2" + this.ColorTouched );
}

function txtBtn_OnTouchMove( ev )
{
if( ev.X < 0 || ev.Y < 0 || ev.X > 1 || ev.Y > 1 )
{
this.Canceled = true;

this.SetBackColor( "#B2" + this.ColorNormal );
}
}

function txtBtn_OnTouchUp()
{
if( !this.Canceled )

[Guest3450D]

Working