Flex Combobox how to set characters to have the same width

Question

I am simulating a multi-column combobox by introducing spaces between each column, such that all rows for the 3 columns should appear in a single line.

The gap in this implementation is that due to the varying widths of characters, this spacing technique does not work.

How to set the combobox characters to have the same width?

The other approach is to calculate the width occupied by characters in each column and then set the start position of the next column. How to achieve this?

Your help is appreciate in advance.

Answer 1

The easy way is to use a monospace font.

--or--

Use mx.core.UITextFormat.measureText to calculate with widths of any font. See the docs here.

Answer 2

An alternate approach might be to consider using a DataGrid as your itemRenderer for the ComboBox.

This would be odd, and unusual, but is in theory possible.

Answer 3

I finally used this approach - it gives flexibility in terms of font usage. Plus Flex takes care of appending the ... for long strings that may spill over.

I used mx:GridItem with 3 grid columns