Using Dropdown

TinyCLR OS
1

Hi,

I am trying to use the GHIElectronics.TinyCLR.UI.Controls.Dropdown using the code below

        Dropdown TTFire = new Dropdown();
        var option = new ArrayList();

        option.Add("text 1");
        option.Add("text 2");
        option.Add("text 3");
        option.Add("text 4");
        option.Add("text 5");
        option.Add("text 6");
        option.Add("text 7");

        TTFire.Height = 20;
        TTFire.Font = fontB;
        TTFire.Foreground = new SolidColorBrush(Colors.Black);
        TTFire.Background = new SolidColorBrush(Colors.Teal);
        TTFire.Options = option;
        TTFire.SelectedIndex = 0;
        Canvas.SetLeft(TTFire, 100);
        Canvas.SetTop(TTFire, 50);

        this.canvas.Children.Add(TimeToFireText);
        this.canvas.Children.Add(TTFire);

Sadly this does not appear to work, nothing appears on the screen and existing items get cleared from the screen which suggests the dropdown is over the top of them or larger than expected.

I took the basic code from the Carwash example but in fairness it was commented out!!!

Is there any working code examples or documentation for Dropdown?

Thanks

2

try this:

var TTFire = new Dropdown {
    Width = 140,             // REQUIRED — must be set or render throws
    Height = 24,              // collapsed-row height; set BEFORE Options
    Font  = fontB
};

var option = new ArrayList();
option.Add("text 1");
option.Add("text 2");
option.Add("text 3");
option.Add("text 4");
option.Add("text 5");
option.Add("text 6");
option.Add("text 7");

TTFire.Options = option;      // populates Items, snapshots originalHeight
TTFire.SelectedIndex = 0;     // collapses to show only the selected row

TTFire.SelectionChanged += (s, e) => {
    Debug.WriteLine("Picked: " + option[TTFire.SelectedIndex]);
};

Canvas.SetLeft(TTFire, 100);
Canvas.SetTop(TTFire, 50);    // leave room below for expanded list
this.canvas.Children.Add(TTFire);
2 Likes
3

Perfect

Thanks

2 Likes