Getting index from picker


I'm displaying a volatile set of text values in a picker, and while the onAccept returns the picked value, I want the index, and have to search the PickerFactory's array to find the index. That seems a lot of work, using valuable resources. I note that the PickerDelegate's return value is an array, and wonder if I can add the index there, but can't decode the syntax.

[resolved]
I modeled my code on the samples and used
function getValue(index) {
return mWords[index];
}

But what actually works, to return the index is:
function getValue(index) {
return index;
}

  • While it seems that you have figured out what to do, I'm thinking this is something that may be worth explaining. This should help others to understand a little about how the picker stuff works.

    The derived PickerFactory class must have an implementation of the getValue() function. Typically that function would return a value given an item index. If this function returns a value, then the array passed to PickerDelegate.onAccept() will be an array of values. If, on the other hand, you implement getValue() to return the index (as is being done above), you will get an array of indices passed to onAccept().

    This is a fine thing to do assuming that you always need indices and you never need to look at the values. If you care about the values, as is typically the case, you should return a value from getValue().

    Here is a simple picker test program that can be used to tinker.

    using Toybox.Application as App;
    using Toybox.Lang as Lang;
    using Toybox.System as Sys;
    using Toybox.WatchUi as Ui;
    using Toybox.Graphics as Gfx;
    using Toybox.Communications as Comm;

    class WordFactory extends Ui.PickerFactory {
    var mWords;
    var mFont;

    function initialize<{words, options}> {
    Sys.println<{"Factory.initialize<{" + words + ", " + options + "}>"}>;
    PickerFactory.initialize<{}>;

    if <{options == null}> {
    options = {};
    }

    mWords = words;

    mFont = options.get<{:font}>;
    if<{mFont == null}> {
    mFont = Gfx.FONT_LARGE;
    }
    }

    function getIndex<{value}> {
    Sys.println<{"Factory.getIndex<{" + value + "}>"}>;
    //for<{var i = 0; i < mWords.size<{}>; ++i}> {
    // if<{value.equals<{mWords}>}> {
    // return i;
    // }
    //}

    //return 0;
    return value;
    }

    function getSize<{}> {
    Sys.println<{"Factory.getSize<{}>"}>;
    return mWords.size<{}>;
    }

    function getValue<{index}> {
    Sys.println<{"Factory.getValue<{" + index + "}>"}>;
    //return mWords[index];
    return index;
    }

    function getDrawable<{index, selected}> {
    Sys.println<{"Factory.getDrawable<{" + index + ", " + selected + "}>"}>;

    return new Ui.Text<{{
    :text => mWords[index],
    :color => Gfx.COLOR_WHITE,
    :font => mFont,
    :locX => Ui.LAYOUT_HALIGN_CENTER,
    :locY => Ui.LAYOUT_VALIGN_CENTER
    }}>;
    }
    }

    class WordPicker extends Ui.Picker {

    function initialize<{words}> {
    Sys.println<{"Picker.initialize<{" + words + "}>"}>;

    var title = new Ui.Text<{{
    :text => "Word",
    :locX => Ui.LAYOUT_HALIGN_CENTER,
    :locY => Ui.LAYOUT_VALIGN_BOTTOM,
    :color => Gfx.COLOR_WHITE
    }}>;

    var pattern = [
    new WordFactory<{words, null}>
    ];

    Picker.initialize<{{
    :title => title,
    :pattern => pattern
    }}>;
    }

    function onUpdate<{dc}> {
    Sys.println<{"Picker.onUpdate<{}>"}>;

    dc.setColor<{Gfx.COLOR_BLACK, Gfx.COLOR_BLACK}>;
    dc.clear<{}>;
    Picker.onUpdate<{dc}>;
    }
    }

    class WordPickerDelegate extends Ui.PickerDelegate
    {
    hidden var mCancelCallback;
    hidden var mAcceptCallback;

    function initialize<{cancelCallback, acceptCallback}> {
    Sys.println<{"PickerDelegate.initialize<{}>"}>;

    PickerDelegate.initialize<{}>;
    mCancelCallback = cancelCallback;
    mAcceptCallback = acceptCallback;
    }

    function onCancel<{}> {
    Sys.println<{"WordPicker.onCancel<{}>"}>;

    mCancelCallback.invoke<{}>;
    Ui.popView<{Ui.SLIDE_IMMEDIATE}>;
    }

    function onAccept<{values}> {
    Sys.println<{"WordPicker.onAccept<{" + values + "}>"}>;

    mAcceptCallback.invoke<{values[0]}>;
    Ui.popView<{Ui.SLIDE_IMMEDIATE}>;
    }
    }


    class Delegate extends Ui.BehaviorDelegate
    {
    function initialize<{}> {
    Sys.println<{"Delegate.initialize<{}>"}>;
    BehaviorDelegate.initialize<{}>;
    }

    function onSelect<{}> {
    Sys.println<{"Delegate.onSelect<{}>"}>;

    var picker = new WordPicker<{["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]}>;
    var delegate = new WordPickerDelegate<{
    self.method<{:onCancel}>,
    self.method<{:onAccept}>
    }>;
    Ui.pushView<{picker, delegate, Ui.SLIDE_UP}>;

    return true;
    }

    function onCancel<{}> {
    Sys.println<{"Delegate.onCancel<{}>"}>;
    }

    function onAccept<{value}> {
    Sys.println<{"Delegate.onAccept<{" + value + "}>"}>;
    }
    }

    class View extends Ui.View
    {
    function initialize<{}> {
    View.initialize<{}>;
    }

    function onUpdate<{dc}> {
    dc.setColor<{Gfx.COLOR_WHITE, Gfx.COLOR_BLACK}>;
    dc.clear<{}>;
    }
    }

    class App extends App.AppBase
    {
    function initialize<{}> {
    AppBase.initialize<{}>;
    }

    function getInitialView<{}> {
    return [ new View<{}>, new Delegate<{}> ];
    }
    }
    [/code]