Spinner button size

Ignition
1

Is there any way to make the buttons on the spinner wider?
Resizing the spinner only adjusts the button height, but not the width.
I will be using Ignition in a touch panel and would like wider buttons so they are easier to press for users.

2

Not currently, but it’s on our list of things to do some time in 7.7

3

Was this ever addressed in 7.7 or 7.8? Is it possible to resize the spinner buttons?

1 Like
4

Has this been addressed yet? The spinner isn’t very useful on a touch panel without being able to increase the button size.

Thanks!

5

I can’t see any way to make them wider in 7.9.2, so probably not yet.

6

If the button size is really important, there is a dirty hack:

Add a custom method ‘setWidth’ with a parameter ‘w’ to your spinner component:

def setWidth(self, w):
	"""
	Arguments:
		self: A reference to the component instance this method is invoked on. This argument
		  is automatic and should not be specified when invoking this method.
		width: The button width
	# First component of the JSpinner should be the 'up' button
	btn1 = self.getComponent(0)

	# the field 'c' is returned by getPreferredSize() of the button
	c = btn1.getClass()
	sizeField = c.getDeclaredField("c")
	sizeField.setAccessible(1);
	
	# set the new button size. only the width is used, the height is determined by the text editor
	from java.awt import Dimension
	newSize = Dimension(w,w)
	sizeField.set(btn1, newSize)
	self.doLayout()
	self.getComponent(2).doLayout()

Call the new method in the spinner’s propertyChange script:

if event.propertyName in ('editor', 'componentRunning' ):
	# editor: designer preview mode
	# componentRunning: client
	event.source.setWidth(30)

In the designer, the width will only be updated when switching to preview node.

4 Likes
7

In case someone wants to do that in Ignition 8.
Here is an updated version of this method to work with Java 11

def setWidth(self, w):
	"""
	Arguments:
		self: A reference to the component instance this method is invoked on. This argument
		  is automatic and should not be specified when invoking this method.
		width: The button width
    """
	# First component of the JSpinner should be the 'up' button
	btn1 = self.getComponent(0)

	# set the new button size. only the width is used, the height is determined by the text editor
	from java.awt import Dimension
	newSize = Dimension(w,w)

	btn1.setPreferredSize(newSize)
	self.doLayout()
	self.getComponent(2).doLayout()
2 Likes
8

Nice, I think I can live with that vertical line in there
image

9

I know this post is years old, but is there any update on this functionality? or a better work around? I have used the work around provided by benjamin.samson but as jespinmartin1 pointed out it makes the buttons look odd.

10

The residual line and the rectangle on the spinner tool are not a part of the SynthArrowButtons or the JFormattedTextField. They are actually part of the spinner's painted background. The simple work around is to make the spinner's background transparent. Then, supply the desired background with the rectangle tool. It also looks nice to use the line tool to outline the left side of the button. Simply layer the line and the rectangle underneath the spinner component.

Here's how it turned out when I performed the procedure in my test environment:
image

Ingredients:
image
image

2 Likes
11

Good work around, that worked well for me. It'd be nice to have a feature that to adjust the button size directly but this works.