Nerwyn / android-tv-card

A completely customizable universal remote card for Home Assistant. Supports multiple platforms out of the box.
Apache License 2.0
254 stars 13 forks source link

Show current volume in volume slider as an alternative to icon #98

Closed queimadus closed 5 months ago

queimadus commented 5 months ago

Is your feature request related to a problem? Please describe. We are only able to set an icon in the slider.

Describe the solution you'd like It would be nice if instead of the icon, we could show the current volume. (Or allow showing the volume any other place in the widget)

Example:

Before After
Screenshot 2024-06-21 at 19 06 29 Screenshot 2024-06-21 at 19 06 24
Nerwyn commented 5 months ago

This is technically a duplicate of #78. I plan on porting over a lot of code from one of my other projects, which includes labels. Labels can then be used to display the current value of the slider and stylized to transform like the icon does. I won't get around to this until the next major version of that project is complete though.

mk89pwnz commented 3 months ago

Sorry for commenting on completed issue but was this merged or still I can't do this atm? as I can't find any example.

Nerwyn commented 3 months ago

You can add labels in version 4, which is a very in progress alpha. Labels can be set to display the slider element value.

The configuration UI in version 4 will modify your configs to the new format and it's still buggy and incomplete, so use at your own risk.

queimadus commented 2 months ago

An effect similar to the screenshot can now be achieved with something like:

:host {
  --tooltip-label: '{{ (100 * VALUE) | int }}%';
  --label-transform: translateX(var(--thumb-offset));
}
.label {
  font-size: 20px;
  margin-bottom: 6px;
  background-color: #1c1c1c;
  color: #e1e1e1;
  width: 35px;
  padding: 10px 0;
  border-radius: 50%;
}

image