Wednesday 20 August 2014

Getting user input

I frequently need to ask for user input when it is not convenient to have a TextEdit on the screen permanently.

Of course it's possible to organize this on a case by case basis but it is frequently needed at the early stages of code testing, so I could do with a nice simple way to put a quick and dirty solution up, even if I later replace it later with more considered design.

What I've ended up doing is creating a reasonable facsimile of a dialog, which can be called by placing a file ask.js into the Misc folder beside the main code.

I then load that using:
  app.LoadScript("Misc/ask.js");



The question is asked using the format:
  ask("Enter your first name","Steve")
Where the second parameter is an optional default value.
If the default is to be cleared between uses of the dialog, I set it to ""

The answer is return in something similar to an OnTouch handler
function askAnswer( ans ){
  alert( ans )
}
I have a simple demo spk called mydialog
The file Misc/ask.js looks like this:

/*  //This code will be in the calling app
 app.LoadScript("Misc/ask.js");
 ask("prompt", "default answer");
//////////
//Called when user touches Ok button.
function askAnswer( ans ){
  alert( ans )
}
*/
///////////
// This code in Misc/ask.js
//ask functionality
function createAskDialog( ){
  //Create a layout for Ask dialog
  layAsk = app.CreateLayout( "Linear" );
  layAsk.SetPadding( 0, 0.01, 0, 0 ); 
  layAsk.SetBackColor( "#ee666666" );
  layAsk.SetPosition(0, 0, 0.5, 0.5);
  layAsk.SetVisibility( "Hide" )
    
  txtAsk = app.CreateText("", 0.49);
  layAsk.AddChild(txtAsk);
  txtAsk.SetTextSize(12);
  txtAsk.SetMargins( 0, 0, 0, 0.05 );
  txtAsk.SetPadding( 0.05,0.05,0.05,0.05 );
  txtAsk.SetBackColor("#ff000000");
  edtAsk = app.CreateTextEdit("",0.4);
  edtAsk.SetMargins( 0, 0, 0, 0.05 );
  //edtAsk.SetBackColor("#88000000");
  layAsk.AddChild(edtAsk);
  //Create button and add to  layout.
  btnAskOk = app.CreateButton( "Ok",-1,-1,"gray");
  btnAskOk.SetOnTouch( AskSaysOK_internal);
  layAsk.AddChild( btnAskOk );

  app.AddLayout(layAsk);
  return true;
}
function ask(msg, dflt){
  //open dialog
  try {
    var x = layAsk
  }
  catch(err) {
    var pause = createAskDialog();
  }
  txtAsk.SetText( msg );
  if(dflt != undefined)
    edtAsk.SetText( dflt );
  layAsk.Animate("SlideFromLeft");
  //layAsk.SetVisibility( "Show" );
}
function unAsk(){
  //close dialog
  app.HideKeyboard();//just in case
  layAsk.Animate("SlideToLeft");
}
////////
//Called when user touches Ok button.
function AskSaysOK_internal(){
  unAsk();
  askAnswer(edtAsk.GetText());  
}
////////



1 comment:

  1. Jorge Ramirez made the very sensible suggestion that I add a callback function to make it easier to identify which question is being answered.

    Details of my changes made discussed at
    https://groups.google.com/forum/m/#!topic/androidscript/bWEc1pxNK74

    ReplyDelete