How to Make a rotary knob control ?

urieluriel Posts: 59Member

Hi guys, i am looking for some doc or anything that can help me to get this control for our GUI, yes, a rotary knob, like a slider, but circular !

i tried many things, without success... anyone ?
Thanks a lot, have a nice day

Comments

  • Ackman6Ackman6 Posts: 3Member
    edited September 2019

    I made a script that should work for an Control inherited node. two signals must be connected to it.

    extends TextureRect
    
    var hover : bool = false
    var hold : bool = false
    var relative_cursor_pos : Vector2
    var static_cursor_pos : Vector2
    var knob_value : float
    var knob_static : float
    var knob_change : float
    export(float) var sensitivity : float = 2
    
    func _process(delta): # just testing to make sure the code works
        rect_rotation = knob_value*360
    
    func _input(event):
        if Input.is_action_just_pressed("custom_mouse"):
            if hover: # if the cursor is hovering over the knob get the mouse position and set hold to true
                static_cursor_pos = get_global_mouse_position()
                hold = true
        if Input.is_action_pressed("custom_mouse"):
            if hold: # if the mouse is still being held down after clicking on the knob
                relative_cursor_pos = get_global_mouse_position()-static_cursor_pos # get the change in location of the mouse since first clicked
    
                knob_change = relative_cursor_pos.dot(Vector2(1, -1))/1000 * sensitivity # calculate the amount the knob should be turned using the change in location of the mouse
    
                knob_value = knob_static + knob_change # set the final knob value to the value of the knob before it was changed + the value of change
                if knob_value < 0 or knob_value > 1: # if the knob exceeds its bounds get a new reference point and clamp the bounds
                    static_cursor_pos = get_global_mouse_position()
                    knob_value = clamp(knob_value, 0, 1)
                    knob_static = knob_value
                    knob_change = 0
        else:
            knob_static = knob_value
            knob_change = 0
            hold = false
    
    # recieve signal when mouse enters area
    func _on_Knob_mouse_entered():
        hover = true
    
    # recieve signal when mouse exits area
    func _on_Knob_mouse_exited():
        hover = false
    
  • urieluriel Posts: 59Member

    Hi Ackman, thx for your answer... i see here the point of building a control from a texture rect.. i will try to apply this to a demop project to see how it goes, i will comeback to share the result :) have a great day

Leave a Comment

BoldItalicStrikethroughOrdered listUnordered list
Emoji
Image
Align leftAlign centerAlign rightToggle HTML viewToggle full pageToggle lights
Drop image/file