Dropdown textAlign

Ignition
1

Using a Dropdown component in Perspective - Is there a way to make the selected value to be aligned in the same way as the options? Currently it looks like this:
image

textAlign in the ‘style’ property does not seem to have an effect while properties like ‘font’ have an influence:
image

Thanks.

2

I played around with the parameters, but I couldn’t find one that would center the selected label either. I can script it, but I hope there is a better solution.

To script it, add fontSize and paddingLeft parameters to your style parameters.
Then, create a custom method called paddingOffset() that you can call from the onStartup and onActionPerformed events.

Here is the code for the custom method:

def paddingOffset(self):
	for i in range(len(self.props.options)):
		if self.props.options[i-1].value == self.props.value:
			self.props.style.paddingLeft = (.5*self.position.width)-(.3*len(self.props.options[i-1].label)*self.props.style.fontSize)
			break

It uses the font size, the length of the selected label and the width of the dropdown box to calculate the amount of padding needed to center the text.
Here is the result:
image

1 Like
3

Impressive :slight_smile: Thanks for your effort. I agree, this warrants a simpler solution. To me this looks more like a bug. What’s the best way to report this to IA? I read somewhere that one could add "[Bug] to the topic title, is this still the case? Or I could call tech support and mention it to them.

1 Like
4

To be honest, I’m not sure what the official procedure is, but I have noticed that the IA staff is diligent about reading this forum, and when anything is posted that warrants a ticket, they create it.

5

That being said, whenever I encounter something like this, I like to go ahead and create a work around because sometimes an official resolution can take a while for them to get to if it is a low priority problem.

6

I think you will find that your centre-justified drop-down is not good GUI design and is visually distracting. In general, text should be left aligned and numbers right-aligned. You are in the awkward position of having both numbers and text and since the text changes you have no hope of aligning all of the numbers. I recommend align-right so that all values of “hour” are aligned, etc.

See Applied Gestalt Laws: Table Alignment for further thoughts on this relating to table alignment.

1 Like
7

You make a good point about the awkward situation with the text-numbers combo that I got. Thanks for the link. Even Ignition’s default drop down for Shelving alarms throws up its hands and simply left justifies everything:
image