Custom Spinner

[Malamin Gindi]

I'm trying to make a custom drop-down list control like the Droidscript Spinner Control. I've so far posted the code on https://github.com/musaaj/Droidscript-Custom-Spinner/blob/master/spinner.js. I hope to get help from this group. Would you help me make it better?

[Netpower8]

do you have a sample onstart on how to use this ?

[Malamin Gindi]

Yes.
//Create a custom spinner
spinner = new Spinner(list, title, width, height, options);

//add the custom spinner to a layout
lay.AddChild(spinner);

[Netpower8]

after some testing ... spinner does not seem to work on touches

[Malamin Gindi]

It's a work in progress. I'm working on getting it better. You can help as well

[Malamin Gindi]

Now spinner touches work. After creating the spinner set a function to be called when touched like this; spinner.onTouch = function()
{
//do something
app.ShowPopup(this.GetText());
}

[Malamin Gindi]

Just solved conflict when more than one instance of Spinner is created

[Netpower8]

Just need some explaination. Why make a custom spinner when there is a spinner available. What features of this spinner different from the ds spinner?

[Malamin Gindi]

I wanted a spinner that supports html and fontawesome. That's the reason for my custom spinner

[Netpower8]

Is you github link of the code updated? You should include a onstart sample the use of it

[Malamin Gindi]

Noted

[Netpower8]

i made this on a quick run... you might want to check it out. did not add other features
let me know if this works for you


//Called when application is started.
function OnStart()
{
    //Create a layout with objects vertically centered.
    lay = app.CreateLayout( "linear", "VCenter,FillXY" );   

    //Create a text label and add it to layout.
    txt = app.CreateText( "Hello" );
    txt.SetTextSize( 32 );
    lay.AddChild( txt );
   
    tx=spinner2('[fa-bars] line 1,[fa-power-off] line 2,line 3',0.5);
    lay.AddChild(tx);
   
    //Add layout to app.   
    app.AddLayout( lay );
}

function spinner2(list,width,height,options) {
    width=width || 0.5;
    height=height || 0.05;
    var lst=list;
    var self=this;
    var left,top;
    var collapse=true;
    var lay=null;
    //var lay=app.CreateLayout('linear','vertical');
   
    if (typeof list=='string') lst=list.split(',');
   
    var titleTxt=app.CreateText(lst[0],width,height,'left,fontawesome');
    titleTxt.SetBackColor('#ee44ee');

    newlist=function() {
        lay=app.CreateLayout('linear','vcenter');
        tray=app.CreateLayout('linear');
        for (var i=0;i<lst.length;i++) {
            var t=app.CreateText(lst[i],width,height,'left,fontawesome');
            t.SetBackColor('#3344ee');
            t.SetOnTouchDown( toggle);
            t.item=lst[i];
            tray.AddChild(t);
        }
        lay.AddChild(tray);
        lay.SetPadding(left,top);
        //lay.SetSize(width,-1);
        app.AddLayout(lay);
    }
   
    toggle=function() {
        if (!lay) {
            left=this.GetLeft();
            top=this.GetTop();
            newlist();
        }

        if (collapse) {
            titleTxt.SetVisibility('hide');
            collapse=false;
            lay.SetVisibility('true');
        }
        else {
            app.ShowPopup(this.item);
            titleTxt.SetText(this.item);
            titleTxt.SetVisibility('show');
            lay.SetVisibility('hide');
            collapse=true;
        }
    }

    titleTxt.SetOnTouchDown( toggle);
    return titleTxt;
}

[Malamin Gindi]

Yes yours seems better than mine. I'll edit and use it

[Netpower8]

You can try this. It also works with array.

var ar=['[fa-bars] line 1','[fa-power-off] line 2','line 3'];

tx=spinner2(ar,0.5);