Jump to content


Photo

Vertical slider from top to bottom (contrary to usual)

vertical slider upside down

  • Please log in to reply
7 replies to this topic

#1 Raul (ulneiz)

Raul (ulneiz)

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1040 posts
  • Gender:Male
  • Location:Spain

Posted 17 October 2017 - 01:39

I have a simple question about "slider":

 

Is there any way to represent the top-down slider? That is, the value 0 would be up and the maximum positive value would be below. Unlike the usual.  Increasing involves dragging down... It's possible with some trick?

 

If this is possible, it may also be possible to place the slider upside down horizontally, increase the value by dragging it to the left...

 

 


Edited by Raul (ulneiz), 20 October 2017 - 02:10.

:excl: Development of my tool: GT16-Colors

 

:excl: My API wishlist R3.1 (updated 24 July 2017):

Spoiler

 

:excl: My Renoise 3.1 wishlist (updated 26 September 2017):

Spoiler

#2 joule

joule

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1508 posts
  • Gender:Not Telling
  • Location:Sweden
  • Interests:music, philosophy, engineering

Posted 17 October 2017 - 07:25

Yes, it's possible to make your own slider with a bit of creative layout. But it's not that easy to explain, and requires some time and experience to make, so I can't go into details.

 

Here's what is needed:

 

1) Use a normal slider as background

2) Overlay with a suiting rack background layout. (you can actually use add_child on all controls, instead of using the negative margin trick)

3) Overlay a button as a knob. This should, of course, be a class with width, height and position properties that will automatically redraw the button.

3b ) Important: if you're using a button as knob (instead of a click-transparent rack), you need to temporarily disable it for some nano-seconds when it's being clicked. Normally, only racks are transparent to clicks on overlays, but with this trick you can make the button "transparent" for the background slider to catch the click position. PS. This is also the trick needed to drag&drop buttons in a Viewbuilder piano roll.

4) Some maths are needed for inverting, positioning and scaling the knob button.



#3 Raul (ulneiz)

Raul (ulneiz)

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1040 posts
  • Gender:Male
  • Location:Spain

Posted 18 October 2017 - 18:14

Hi Joule, Thanks!!

 

From what I see, it seems that any element can be replaced with this method, I suppose. I would need to find some example of a tool that would hold the slider with another image/images. It looks like the slider is made up of 3 elements, the slider button to drag, the image of the background bar and the image of the bar that increases or decreases. I think if I could change the images the rest could do it.

 

The tool is this:

 

vpdpro-sliders.png

                        mode = "normal"                                                                     mode = "inverse"

 

The change would be as follows (view right of image): the fourth slider called "D" that visually the black bar is blue, and the blue bar is black (just upside down), leaving the rest as it is. This would be possible? (note: this tool use background bitmaps; the values "FF, EF ... 0F, .." should appear upside down on the "D" slider on the right of the image, "FF" below and ".." above).

 

The problem I see is that it will break Renoise's skin theme. I'm interested in continuing the theme (colors, contrast...) of Renoise, because the rest of the sliders are original. I'm afraid with this method, I would have to change all the sliders to look like the same tool. It's kind of complicated for me to do all this.

 

I think I would have no problem with math but yes with the visual GUI.

 

Anyway, it would be great if the API allowed all sliders to be used upside down, simply using negative values (or something, adding the property, "inverse") and not using overlapping skins. When I started with the sliders, I thought this was possible, following the logic.

 

---

 

On the other hand, Renoise has a horizontal Panning slider, whose level is filled to left or right. Is it possible to get that effect with a slider from the API? I mean the visual aspect of the blue bar of my tool when dragging the slider.


Edited by Raul (ulneiz), 20 October 2017 - 19:36.

:excl: Development of my tool: GT16-Colors

 

:excl: My API wishlist R3.1 (updated 24 July 2017):

Spoiler

 

:excl: My Renoise 3.1 wishlist (updated 26 September 2017):

Spoiler

#4 joule

joule

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1508 posts
  • Gender:Not Telling
  • Location:Sweden
  • Interests:music, philosophy, engineering

Posted 19 October 2017 - 07:29

I don't think it's a good idea dealing with images, for the reason you mentioned. You can get something decent-ish by using just a normal button as knob, and rack layouts as background. It's theoretically possible to build something pixel perfect looking like the skin, but it's really a big waste of time imo.



#5 Raul (ulneiz)

Raul (ulneiz)

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1040 posts
  • Gender:Male
  • Location:Spain

Posted 20 October 2017 - 01:52

I don't think it's a good idea dealing with images, for the reason you mentioned. You can get something decent-ish by using just a normal button as knob, and rack layouts as background. It's theoretically possible to build something pixel perfect looking like the skin, but it's really a big waste of time imo.

 

I did not want to complicate it too much. In the end I've done something simpler:

vpdpro-delay-slider.gif

 

I wanted a kind of marker which visually shows the delay within the row. The slider represents the height of the row which comprises a range between "..", "01" to "FF". When the higher is the delay, the note is reproduced more below. Visually, it is as if the two blue bars push the notes down into the playback.

 

This resulting is only using the Renoise API without any trick to replace the slider. It's quite curious. It is a pity that the slider and rotary can not be displayed in reverse. As is the catch, I would actually only change the black bar by the blue bar, and it is already possibly with a property called mode = "normal" or "inverted" would be feasible, something like this:

vb:slider {
  id = "DLY_SLIDER",
  midi_mapping = MIDI_IN.DLY_SLIDER,
  height = 652,
  width = 22,
  min = 0,
  max = 255,
  value = 0,
  active = false,
  notifier = function(value) vpd_dly_value() vpd_show_dcol() vpd_dly_marker(value) end,
  tooltip = "Delay bar: .."

and

  mode = "inverse"  <---------
}, 
It would be magnificent!

Edited by Raul (ulneiz), 20 October 2017 - 01:53.

:excl: Development of my tool: GT16-Colors

 

:excl: My API wishlist R3.1 (updated 24 July 2017):

Spoiler

 

:excl: My Renoise 3.1 wishlist (updated 26 September 2017):

Spoiler

#6 joule

joule

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1508 posts
  • Gender:Not Telling
  • Location:Sweden
  • Interests:music, philosophy, engineering

Posted 20 October 2017 - 15:16

I would say, for me, it becomes a bit more visually confusing this way (but I realize that perception is very individual - like synesthesia!). I would go for a left-right perspective as a compromise, making the sliders more intuitive even though they do not match the pattern flow.

 

Indeed I like your suggestion. Uni-polar sliders have been suggested in the API suggestion thread, but maybe not inverted ones.



#7 Raul (ulneiz)

Raul (ulneiz)

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1040 posts
  • Gender:Male
  • Location:Spain

Posted 20 October 2017 - 19:34

I would say, for me, it becomes a bit more visually confusing this way (but I realize that perception is very individual - like synesthesia!). I would go for a left-right perspective as a compromise, making the sliders more intuitive even though they do not match the pattern flow.

 

Indeed I like your suggestion. Uni-polar sliders have been suggested in the API suggestion thread, but maybe not inverted ones.

 

From what I've seen so far, the current API for the "slider" or mini-slider only runs horizontally to the right or vertical to the up, but width and height do not accept negative values. I think implementing it in the API backwards should not be too costly. It would only reverse the color of the black bar and the blue bar (according to the screenshot) of the slider, and the buttons that always remain in the same place.

 

Most Renoise controls use the vertical sliders to the up (increases the value) and the horizontal sliders to the right (increases the value), which is the norm to control any value. But with delay, I think it looks more easily if the slider increases the value to the down. Some time ago I was asked if this tool was for touch screens. In the case of handling the delay, delaying the note would involve dragging down, so that it takes longer to reproduce.


:excl: Development of my tool: GT16-Colors

 

:excl: My API wishlist R3.1 (updated 24 July 2017):

Spoiler

 

:excl: My Renoise 3.1 wishlist (updated 26 September 2017):

Spoiler

#8 Raul (ulneiz)

Raul (ulneiz)

    Guruh Motha Fakka is Levitating and Knows Everything About Renoise Member

  • Normal Members
  • PipPipPipPipPipPipPipPipPipPipPipPipPip
  • 1040 posts
  • Gender:Male
  • Location:Spain

Posted 20 October 2017 - 19:45

Ok, then it seems reasonable that there could be 3 modes on the "slider" (or mini-slider):

 

mode = "normal"

mode = "inverse"

mode = "panning" (with center, right and left)

 

Like with the "rotary"...


:excl: Development of my tool: GT16-Colors

 

:excl: My API wishlist R3.1 (updated 24 July 2017):

Spoiler

 

:excl: My Renoise 3.1 wishlist (updated 26 September 2017):

Spoiler