A way to bind the color of a button

[borolepratik]

I'd like to bind the color of a button along with enabled and text. I dont see a bind_color method available, but are there any other levers i can pull to bind the color of the button to nicegui storage?

[evnchn]

Hello @borolepratik thanks for the observation.

I think the lack of binding support may be due to the complex logic nature of the colors:

Check the source code:

nicegui/nicegui/elements/mixins/color_elements.py

Lines 20 to 43 in faa3375

	class BackgroundColorElement(Element):
	BACKGROUND_COLOR_PROP = 'color'
	def __init__(self, *, background_color: Optional[str], **kwargs: Any) -> None:
	super().__init__(**kwargs)
	if background_color in QUASAR_COLORS:
	self._props[self.BACKGROUND_COLOR_PROP] = background_color
	elif background_color in TAILWIND_COLORS:
	self._classes.append(f'bg-{background_color}')
	elif background_color is not None:
	self._style['background-color'] = background_color
	class TextColorElement(Element):
	TEXT_COLOR_PROP = 'color'
	def __init__(self, *, text_color: Optional[str], **kwargs: Any) -> None:
	super().__init__(**kwargs)
	if text_color in QUASAR_COLORS:
	self._props[self.TEXT_COLOR_PROP] = text_color
	elif text_color in TAILWIND_COLORS:
	self._classes.append(f'text-{text_color}')
	elif text_color is not None:
	self._style['color'] = text_color

There is 3 code paths, depending whether it is quasar color, Tailwind color, or CSS color, all setting in 3 different places.

But this does sound like an interesting challenge to me 🤔

[evnchn]

I have an idea. To being coding some time.

[falkoschindler]

Depending on what exactly you're trying to achieve, you can bind the color of a button:

b = ui.button('Button', color=None)
ui.select(['red', 'green', 'blue'], value='red').bind_value_to(b.props, 'color')

[evnchn]

Only works with Quasar colors, though...

[evnchn]

#5512

[falkoschindler]

This PR is part of release 3.6. ✔️