Make a Gtk.Scale have the same value as a Gtk.Spin

Question

My objective is to make the slider in the scale be in sync with the value in the spin and vice-versa. I've tried some alternatives, but I am not finding a way of getting the value where the scale is so that I can set the new spin position.

The little exercise has a small check button that should sync both widgets. I am trying to do this sync through the toggled function, but I am stuck now.

Here is the code so far:

uses
    Gtk

class TestWindow:Window
    _spin:Gtk.SpinButton
    _scale:Gtk.Scale
    construct ()

        //General aspects of the window
        title = "Spin and scale"
        window_position = WindowPosition.CENTER
        destroy.connect( Gtk.main_quit )

        //create the spin button
        spinAdjustment:Gtk.Adjustment = new Gtk.Adjustment(50, 0, 100, 1, 5, 0)
        scaleAdjustment:Gtk.Adjustment = new Gtk.Adjustment(50, 0, 100, 1, 5, 0)
        _spin:SpinButton = new Gtk.SpinButton(spinAdjustment, 1.0,1)

        //create the horizontal scale
        _scale:Scale = new Gtk.Scale(Gtk.Orientation.HORIZONTAL, scaleAdjustment);

        //create the check button
        var check =  new Gtk.CheckButton.with_label ("Sync both scales!")
        check.toggled.connect(toggled)

        // organize it in a box
        var box = new Box( Orientation.VERTICAL, 0 )
        box.pack_start(_spin, true, true, 0 )
        box.pack_start(_scale, true, true, 0)
        box.pack_start(check, true, true, 0)
        add( box )

    def toggled ()
        message(_spin.get_value().to_string())
        //if _scale.get_value_pos() !=  _spin.get_value()
        //  _scale.set_value_pos(_spin.get_value())



init
    Gtk.init( ref args )
    var test = new TestWindow()
    test.show_all()
    Gtk.main()

Can anyone give me a little pointer on how to solve this?

Answer 1

This is a working example based on your code:

[indent=4]
uses
    Gtk

class TestWindow:Window

    _spin:SpinButton
    _scale:Scale

    construct ()
        //General aspects of the window
        title = "Spin and scale"
        window_position = WindowPosition.CENTER
        destroy.connect( main_quit )

        //create the spin button
        spinAdjustment:Adjustment = new Adjustment( 50, 0, 100, 1, 5, 0 )
        scaleAdjustment:Adjustment = new Adjustment( 50, 0, 100, 1, 5, 0 )
        _spin = new SpinButton( spinAdjustment, 1.0, 1 )

        //create the horizontal scale
        _scale = new Scale( Orientation.HORIZONTAL, scaleAdjustment );

        //create the check button
        var check =  new CheckButton.with_label ( "Sync both scales!" )
        check.toggled.connect( toggled )

        // organize it in a box
        var box = new Box( Orientation.VERTICAL, 0 )
        box.pack_start( _spin, true, true, 0 )
        box.pack_start( _scale, true, true, 0 )
        box.pack_start( check, true, true, 0 )
        add( box )

    def toggled ()
        message(_spin.get_value().to_string())
        if _scale.get_value() !=  _spin.get_value()
            _scale.set_value(_spin.get_value())

init
    Gtk.init( ref args )
    var test = new TestWindow()
    test.show_all()
    Gtk.main()

Your example is nice and obviously when you run it you will understand how the user interaction can be improved.

For the Genie code itself there are a couple of points:

• When you state a variable identifier and its type this is a new declaration of the variable. Often the Vala compiler will warn you, but it doesn't when a variable with the same name is declared in a class's method as well as the scope of the whole class. So _spin:SpinButton = new Gtk.SpinButton(spinAdjustment, 1.0,1) should just be _spin = new Gtk.SpinButton(spinAdjustment, 1.0,1) because you have already declared _spin. The same applies to _scale.
• You have used the get_value_pos method of Gtk.Scale and this causes a type mismatch error: Equality operation: 'double' and 'Gtk.PositionType' are incompatible. The Vala documentation for Gtk.Scale says "To use it, you’ll probably want to investigate the methods on its base class, Range, in addition to the methods for GtkScale itself." Under Gtk.Range there is a get_value method that returns a double, the same type you need to match the get_value from the SpinButton. This is the concept of inheritance, which is already being used for the Window