Eclipse Community Forums: Standard Widget Toolkit (SWT) » Draw2D Spike in Glimmer DSL for SWT

Home » Eclipse Projects » Standard Widget Toolkit (SWT) » Draw2D Spike in Glimmer DSL for SWT(Created a Rough DSL for the GEF Draw2D Library in Glimmer)

Show: Today's Messages :: Show Polls :: Message Navigator

Draw2D Spike in Glimmer DSL for SWT [message #1839058]

Fri, 12 March 2021 05:18

Andy Maleh

Messages: 75
Registered: March 2020
Location: Montreal, Quebec, Canada

Member

The Eclipse ecosystem includes a highly advanced 2D graphics library called Draw2D (comes as part of GEF), which rests on top of the SWT Canvas widget.

I got a chance to play around with it today and even do a spike in Glimmer DSL for SWT for supporting a Draw2D DSL. I finished a rough version in about an hour or two. Check out the samples I created below.

Spike 1 (Rectangle and contained Polygon + Drag & Drop Movement):

# This is just a draw2d spike from the draw2d-spike branch 2021-03-12 (does not work in standard Glimmer DSL for SWT)

require 'glimmer-dsl-swt'

include Glimmer

shell {
  minimum_size 200, 200
  canvas {
    fill_layout;
    
    rectangle_figure {|proxy|
      bounds org.eclipse.draw2d.geometry.Rectangle.new(0, 0, 50, 50)
      background_color color(:cyan).swt_color
      opaque true
      
      on_mouse_dragged { |event|
        old_x = proxy.draw2d_figure.location.x
        old_y = proxy.draw2d_figure.location.y
        proxy.draw2d_figure.setLocation(org.eclipse.draw2d.geometry.Point.new(old_x + event.x - @last_x, old_y + event.y - @last_y)) if @last_x && @last_y
        @last_x = event.x
        @last_y = event.y
      }
      on_mouse_released {
        proxy.draw2d_figure.background_color = color([:green, :red, :blue].sample).swt_color
        @last_x = nil
        @last_y = nil
      }
      
      polygon {|proxy|
        fill true
        background_color color(:red).swt_color
        points org.eclipse.draw2d.geometry.PointList.new([13, 13, 50, 30, 40, 4].to_java(:int))
        
        on_mouse_dragged { |event|
          old_x = proxy.draw2d_figure.location.x
          old_y = proxy.draw2d_figure.location.y
          proxy.draw2d_figure.setLocation(org.eclipse.draw2d.geometry.Point.new(old_x + event.x - @last_x, old_y + event.y - @last_y)) if @last_x && @last_y
          @last_x = event.x
          @last_y = event.y
        }
        on_mouse_released {
          proxy.draw2d_figure.background_color = color([:green, :red, :blue].sample).swt_color
          @last_x = nil
          @last_y = nil
        }
      }
    }
  }
}.open

Screenshot:

https://lh3.googleusercontent.com/-IBRQiQKocYo/YEr4REELaNI/AAAAAAAABsE/hL8g1JiYpDECESJop-z1WKjOuA5ySvhfACLcBGAsYHQ/s16000/Screen%2BShot%2B2021-03-11%2Bat%2B10.52.06%2BPM.png"

Spike 2 (Rectangle and contained Ellipse + Drag & Drop Movement):

# This is just a draw2d spike from the draw2d-spike branch 2021-03-12 (does not work in standard Glimmer DSL for SWT)

require 'glimmer-dsl-swt'

include Glimmer

shell {
  minimum_size 300, 300
  text 'Hello, Draw2d!'
  canvas { |canvas_proxy|
    fill_layout;
    
    on_mouse_down { |event|
      @last_x = event.x
      @last_y = event.y
    }
    on_mouse_move { |event|
      if @shape_to_move
        old_x = @shape_to_move.location.x
        old_y = @shape_to_move.location.y
        new_x = old_x + event.x - @last_x
        new_y = old_y + event.y - @last_y
        @shape_to_move.setLocation(org.eclipse.draw2d.geometry.Point.new(new_x, new_y)) if @last_x && @last_y
        @last_x = event.x
        @last_y = event.y
      end
    }
    on_mouse_up { |event|
      @last_x = nil
      @last_y = nil
      @shape_to_move = nil
    }
    rectangle_figure {|proxy|
      focus_traversable true
      bounds org.eclipse.draw2d.geometry.Rectangle.new(10, 10, 180, 180)
      background_color color(:cyan).swt_color
      clipping_strategy(lambda {|child_figure| [org.eclipse.draw2d.geometry.Rectangle.new(0, 0, 5000, 5000)].to_java(org.eclipse.draw2d.geometry.Rectangle)})
      
      on_mouse_pressed { |event|
        @last_x = event.x
        @last_y = event.y
        @shape_to_move = canvas_proxy.top_level_figure.find_figure_at(event.x, event.y)
      }
      on_mouse_dragged { |event|
        old_x = proxy.draw2d_figure.location.x
        old_y = proxy.draw2d_figure.location.y
        proxy.draw2d_figure.setLocation(org.eclipse.draw2d.geometry.Point.new(old_x + event.x - @last_x, old_y + event.y - @last_y)) if @last_x && @last_y
        @last_x = event.x
        @last_y = event.y
      }
      on_mouse_released {
        proxy.draw2d_figure.background_color = color([:green, :red, :blue].sample).swt_color
        @last_x = nil
        @last_y = nil
        @shape_to_move = nil
      }
      
      ellipse {|proxy|
        focus_traversable true
        fill true
        opaque true
        bounds org.eclipse.draw2d.geometry.Rectangle.new(50, 50, 100, 100)
        background_color color(:red).swt_color
        
        on_mouse_pressed { |event|
          @last_x = event.x
          @last_y = event.y
          @shape_to_move = canvas_proxy.top_level_figure.find_figure_at(event.x, event.y)
        }
        on_mouse_dragged { |event|
          old_x = proxy.draw2d_figure.location.x
          old_y = proxy.draw2d_figure.location.y
          proxy.draw2d_figure.setLocation(org.eclipse.draw2d.geometry.Point.new(old_x + event.x - @last_x, old_y + event.y - @last_y)) if @last_x && @last_y
          @last_x = event.x
          @last_y = event.y
        }
        on_mouse_released {
          proxy.draw2d_figure.background_color = color([:green, :red, :blue].sample).swt_color
          @last_x = nil
          @last_y = nil
          @shape_to_move = nil
        }
      }
    }
  }
}.open

Screenshot:

https://lh3.googleusercontent.com/-za9zaUD98tU/YEr4POqT2KI/AAAAAAAABsA/ZXqQ5QftcOoL-pSUYR_BJT07qe9_q7wngCLcBGAsYHQ/s16000/Screen%2BShot%2B2021-03-11%2Bat%2B11.35.24%2BPM.png

Spike 3 (Multiple Rectangles and Ellipses within a GridLayout of 8 columns + Drag & Drop Movement):

# This is just a draw2d spike from the draw2d-spike branch 2021-03-12 (does not work in standard Glimmer DSL for SWT)

require 'glimmer-dsl-swt'

include Glimmer

shell {
  minimum_size 300, 300
  text 'Hello, Draw2d!'
  canvas { |canvas_proxy|
    fill_layout;
    
    on_mouse_down { |event|
      @last_x = event.x
      @last_y = event.y
    }
    on_mouse_move { |event|
      if @shape_to_move
        old_x = @shape_to_move.location.x
        old_y = @shape_to_move.location.y
        new_x = old_x + event.x - @last_x
        new_y = old_y + event.y - @last_y
        @shape_to_move.setLocation(org.eclipse.draw2d.geometry.Point.new(new_x, new_y)) if @last_x && @last_y
        @last_x = event.x
        @last_y = event.y
      end
    }
    on_mouse_up { |event|
      @last_x = nil
      @last_y = nil
      @shape_to_move = nil
    }
    
    16.times {
      rectangle_figure {|proxy|
        focus_traversable true
        bounds org.eclipse.draw2d.geometry.Rectangle.new(10, 10, 80, 80)
        background_color color(:cyan).swt_color
        clipping_strategy(lambda {|child_figure| [org.eclipse.draw2d.geometry.Rectangle.new(0, 0, 5000, 5000)].to_java(org.eclipse.draw2d.geometry.Rectangle)})
        
        on_mouse_pressed { |event|
          @last_x = event.x
          @last_y = event.y
          @shape_to_move = canvas_proxy.top_level_figure.find_figure_at(event.x, event.y)
        }
        on_mouse_dragged { |event|
          old_x = proxy.draw2d_figure.location.x
          old_y = proxy.draw2d_figure.location.y
          proxy.draw2d_figure.setLocation(org.eclipse.draw2d.geometry.Point.new(old_x + event.x - @last_x, old_y + event.y - @last_y)) if @last_x && @last_y
          @last_x = event.x
          @last_y = event.y
        }
        on_mouse_released {
          proxy.draw2d_figure.background_color = color([:green, :red, :blue].sample).swt_color
          @last_x = nil
          @last_y = nil
          @shape_to_move = nil
        }
      }
      ellipse {|proxy|
        focus_traversable true
        fill true
        opaque true
        minimum_size org.eclipse.draw2d.geometry.Dimension.new(100, 100)
        preferred_size 100, 100
        background_color color(:red).swt_color
#         points org.eclipse.draw2d.geometry.PointList.new([13, 13, 50, 30, 40, 4].to_java(:int)) # points for a polygon alternative figure
        
        on_mouse_pressed { |event|
          @last_x = event.x
          @last_y = event.y
          @shape_to_move = canvas_proxy.top_level_figure.find_figure_at(event.x, event.y)
        }
        on_mouse_dragged { |event|
          old_x = proxy.draw2d_figure.location.x
          old_y = proxy.draw2d_figure.location.y
          proxy.draw2d_figure.setLocation(org.eclipse.draw2d.geometry.Point.new(old_x + event.x - @last_x, old_y + event.y - @last_y)) if @last_x && @last_y
          @last_x = event.x
          @last_y = event.y
        }
        on_mouse_released {
          proxy.draw2d_figure.background_color = color([:green, :red, :blue].sample).swt_color
          @last_x = nil
          @last_y = nil
          @shape_to_move = nil
        }
      }
    }
  }
}.open

Screenshot: