Volume and Brightness Sliders in iOS Style

I have made sliders for volume and brightness in iOS style:

They both use the same mechanism: Behind the slider, there is a white and a gray Button (which are visible behind the slider because they are set to have a negative "free space after button" and because sliders have transparent backgrounds). When sliding, apart from controlling the volume/brightness, the slider widget also adjusts the fixed width of the white and gray backgrounds (as well as their corner radius) so that they line up exactly with the slider track. For this, they use the BTT update_trigger method. So don't forget to replace the UUIDs in the code (in the sliders, the mute button and the brightness slider helper widget). You can find info on update_trigger and UUID in the BTT documentation.

Preset (especially brightness slider) is a little experimental: While just on the TouchBar indicating the volume/brightness level, the sliders look very pretty and clean. While using them though, the slider track adjusts faster than the backgrounds and some other small visual bugs around the slider may appear for a second because the timing of the different settings being adjusted is not always perfect. That's why this preset is not really perfect, but I wanted to share it anyways, because I haven't seen anything like this on here yet and I thought maybe some of you will find it interesting. If you make any improvements to this, let me know! :slight_smile:

The Brightness Slider needs the Homebrew package "brightness" to be installed (install Homebrew, then type "brew install brightness" in terminal). The brightness slider is also a little more buggy in general. If you're a beginner, you might want to use only the volume slider. More info on the brightness package and how it is used with AppleScript.

What is the brightness slider helper widget? I made this because the system adjusts the brightness automatically every now and then. The widget is not visible on the TouchBar and just refreshes the width of the backgrounds of the brightness slider every 10 seconds.

Download: https://share.folivora.ai/sharedPreset/fded137c-9311-4d00-a64f-25bc902bc4ce

nice! will definitely use it :slight_smile:

1 Like