OnScreen GUI Toolkit

thomthom

Very nice! I got framework of my own for this - but I've never got around to release it for public consumption.

One thing to note - if you want to draw lines of odd size then you need to offset the co-ordinates by 0.5. (This is only on nVidia cards I think - ATI adjust to pixel grid automatically last time I checked on my very old Radeon 9800)

I'm building a wrapper to let me draw shapes that adjust correctly to the pixel grid. It's combined with a cache system - where it takes all the drawing call that View does. This means that you send drawing instructions to the cache when something changes and in the draw event it simply draws all the instructions which has been pre-processed. This easily avoids unnecessary calculations in the draw event which often slows down the refresh rate.

I'm also working on a GL vector image system, which you might find interesting. I'll see if I can extract tit to standalone code. It's a system mean for replacement of my GL bitmap drawing (which can only handle a handful of small bitmaps before things get to slow.). The GL vector image framework let you define shapes etc in a simple text file which then loaded is converted into GL drawing instructions. Nice for scalable vector images.
Just wish I had time for a simple drawing editor - or a converter from something like SVG to GL.

It'd be cool to consolidate some of this into a large framework.

driven

@aerilius said:

An easy way (without need for git) is to download a zip archive (top right corner "get source").

I don't see any source option, but I can at TT's repositry
on yours, it says

Repositories
Aerilius has no public repositories.

any clues or could you PM the zip file

cheers

john

Chris Fullmer

Well done. I had a pretty awesome RGB color selector box 90% made. But I never quite figured out one of the conversions that I needed, so I never finished. Maybe I should finish it and pass it on to you. I'd love to see it released finally.

thomthom

The source for GL_Image is here at the repo:
https://bitbucket.org/thomthom/tt-library-2/src/7462992bf4f3/TT_Lib2/gl_image.rb
Docs:
http://www.thomthom.net/software/sketchup/tt_lib2/doc/TT/GL_Image.html

@chris fullmer said:

Well done. I had a pretty awesome RGB color selector box 90% made. But I never quite figured out one of the conversions that I needed, so I never finished. Maybe I should finish it and pass it on to you. I'd love to see it released finally.

I was thinking of that one the other day. I way playing with the idea of a viewport on-screen sketching plugin. For when you make videos or make presentations. Needs a colour picker.

GL_Image Test

Aerilius

@driven said:

I don't see any source option

I didn't notice that it was not public (because of the auto-login I didn't see how it looks from outside). I made it downloadable now.

@chris fullmer said:

But I never quite figured out one of the conversions that I needed, so I never finished.

There are some color conversion methods in my color library.

driven

@aerilius said:

load "ae_OnScreenGUI.rb" # (which loads the other files)
Sketchup.active_model.select_tool(AE::GUI::OnScreen::TestTool.new)

Had to comment out protected line 128 in Window.rb for everything to work, and to stop error messages re. view being a protected method.

else, works a treat until I draw something, and I can only get it back by using Sketchup.active_model.select_tool(AE::GUI::OnScreen::TestTool.new)

is that right?

john

thomthom

Can we get a public Issue Tracker?

thomthom

My draw cache class. You create an instance of it and call the drawing methods you'd usually call on View to this. And in the tool's draw event to make it render out the cached drawing instructions.

Example:

<span class="syntaxdefault"><br />class MyTool<br />  def initialize<br />    </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">drawing_cache </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> DrawCache</span><span class="syntaxkeyword">.new(</span><span class="syntaxdefault"> Sketchup</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">active_model</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">active_view </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">  end<br />  def onLButtonUp</span><span class="syntaxkeyword">(</span><span class="syntaxdefault">flags</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> x</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> y</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> view</span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">drawing_cache</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">line_stipple </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> </span><span class="syntaxstring">'-'<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">drawing_cache</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">draw</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> GL_QUADS</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">...</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">drawing_cache</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">draw</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> GL_LINES</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">...</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">drawing_cache</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">draw_points</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> GL_QUADS</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">...</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">  end<br />  def draw</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> view </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">drawing_cache</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">render<br />  end<br />end </span><span class="syntaxcomment"># class<br /></span><span class="syntaxdefault"> </span>

DrawCache Class

<span class="syntaxdefault"><br /></span><span class="syntaxcomment">#-------------------------------------------------------------------------------<br />#<br /># Thomas Thomassen<br /># thomas[at]thomthom[dot]net<br />#<br />#-------------------------------------------------------------------------------<br /><br /><br /></span><span class="syntaxdefault">module TT</span><span class="syntaxkeyword">;;</span><span class="syntaxdefault">Plugins</span><span class="syntaxkeyword">;;</span><span class="syntaxdefault">BezierSurfaceTools<br />  <br />  </span><span class="syntaxcomment"># Caches drawing instructions so complex calculations for generating the<br /></span><span class="syntaxdefault">  </span><span class="syntaxcomment"># GL data can be reused.<br /></span><span class="syntaxdefault">  </span><span class="syntaxcomment">#<br /></span><span class="syntaxdefault">  </span><span class="syntaxcomment"># Redirect all Skethcup;;View commands to a DrawCache object and call<br /></span><span class="syntaxdefault">  </span><span class="syntaxcomment"># #render in a Tool's #draw event.<br /></span><span class="syntaxdefault">  </span><span class="syntaxcomment">#<br /></span><span class="syntaxdefault">  </span><span class="syntaxcomment"># @since 1.0.0<br /></span><span class="syntaxdefault">  class DrawCache<br />    </span><span class="syntaxcomment"># (?) Move to TT_Lib ?<br /></span><span class="syntaxdefault">    <br />    </span><span class="syntaxcomment"># @param [Sketchup;;View]<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment">#<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @since 1.0.0<br /></span><span class="syntaxdefault">    def initialize</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> view </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">view </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> view<br />      </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">commands </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">[]<br /></span><span class="syntaxdefault">    end<br />    <br />    </span><span class="syntaxcomment"># Clears the cache. All drawing instructions are removed.<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment">#<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @return [Nil]<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @since 1.0.0<br /></span><span class="syntaxdefault">    def clear<br />      </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">commands</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">clear<br />      nil<br />    end<br />    <br />    </span><span class="syntaxcomment"># Draws the cached drawing instructions.<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment">#<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @return [Sketchup;;View]<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @since 1.0.0<br /></span><span class="syntaxdefault">    def render<br />      view </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">view<br />      for command in </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">commands<br />        view</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">send</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">*</span><span class="syntaxdefault">command </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">      end<br />      view<br />    end<br />    <br />    </span><span class="syntaxcomment"># Cache drawing commands and data. These methods received the finsihed<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># processed drawing data that will be executed when #render is called.<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">[<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw2d</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw_line</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw_lines</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw_points</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw_polyline</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">draw_text</span><span class="syntaxkeyword">,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">drawing_color</span><span class="syntaxkeyword">=,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">line_stipple</span><span class="syntaxkeyword">=,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">line_width</span><span class="syntaxkeyword">=,<br /></span><span class="syntaxdefault">      </span><span class="syntaxkeyword">;</span><span class="syntaxdefault">set_color_from_line<br />    </span><span class="syntaxkeyword">].</span><span class="syntaxdefault">each </span><span class="syntaxkeyword">{</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">|</span><span class="syntaxdefault">symbol</span><span class="syntaxkeyword">|<br /></span><span class="syntaxdefault">      define_method</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> symbol </span><span class="syntaxkeyword">)</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">{</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">|*</span><span class="syntaxdefault">args</span><span class="syntaxkeyword">|<br /></span><span class="syntaxdefault">        </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">commands </span><span class="syntaxkeyword"><<</span><span class="syntaxdefault"> args</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">unshift</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> this_method </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">        </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">commands</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">size<br />      </span><span class="syntaxkeyword">}<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">}<br /></span><span class="syntaxdefault">    <br />    </span><span class="syntaxcomment"># Pass through methods to Sketchup;;View so that the drawing cache object<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># can easily replace Sketchup;;View objects in existing codes.<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment">#<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @since 1.0.0<br /></span><span class="syntaxdefault">    def method_missing</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">*</span><span class="syntaxdefault">args </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">      view </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">@</span><span class="syntaxdefault">view<br />      method </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> args</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">first<br />      if view</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">respond_to</span><span class="syntaxkeyword">?(</span><span class="syntaxdefault"> method </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">        view</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">send</span><span class="syntaxkeyword">(*</span><span class="syntaxdefault">args</span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">      else<br />        raise NoMethodError</span><span class="syntaxkeyword">,</span><span class="syntaxdefault"> </span><span class="syntaxstring">"undefined method `#{method}' for #{self.class.name}"<br /></span><span class="syntaxdefault">      end<br />    end<br />    <br />    </span><span class="syntaxcomment"># @return [String]<br /></span><span class="syntaxdefault">    </span><span class="syntaxcomment"># @since 1.0.0<br /></span><span class="syntaxdefault">    def inspect<br />      hex_id </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> TT</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">object_id_hex</span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> self </span><span class="syntaxkeyword">)<br /></span><span class="syntaxdefault">      </span><span class="syntaxstring">"#<#{self.class.name};#{hex_id} Commands;#{@commands.size}>"<br /></span><span class="syntaxdefault">    end<br />    <br />    private<br />    <br />    </span><span class="syntaxcomment"># http://www.ruby-forum.com/topic/75258#895569<br /></span><span class="syntaxdefault">    def this_method<br />      </span><span class="syntaxkeyword">(</span><span class="syntaxdefault"> caller</span><span class="syntaxkeyword">[</span><span class="syntaxdefault">0</span><span class="syntaxkeyword">]</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">=~</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">/`</span><span class="syntaxdefault">([^']*)'/ and $1 ).intern<br />    end<br />    <br />  end # class DrawCache<br />  <br /><br />end # module<br /></span>

Jim

Here's how it looks on my cheap laptop. Do the sliders work? They did not work for me. It was a little slow with all 3 themes shown. When I commented out all but the native theme, it was better. I wouldnt expect the average plugin to use anywhere close to the number of widgets in the test tool, so performance wouldn't be an issue.

OnScreen Example

sdmitch

When I try to test OnScreen GUI no errors are indicated but the window never appears.

Jim

Sam, you need to make it the active tool..

Sketchup.active_model.select_tool(TestTool.new)

And you may need to zoom a little to get it to activate - the tool may need a view.invalidate/view.refresh in there somewhere.

sdmitch

DOH!!!

edit:

Ok now how to use it. I have played around a bit with the testGUI.rb trying to figure out how to get the value from the widget. The slider example seems to emply that variable value should be the current value of the slider but it contains something like "pos(84.0,19.0,-1.0)flags0".

Aerilius

That's a bug! (the raw data of the event and where the slider was clicked)

tomasz

Thank you for sharing this! I want to revamp SU2KT when time permits.
I will report if I find any bugs.

kirill2008

I don't even know how to call this coincidence maybe a kind of synchronicity... I mean a few weeks ago the idea to make custom UI library based on view.draw method suddenly came to my mind. And I even started to code it Actually I needed a kind of adjustment curve editing control for one of my tools and since I didn't find any javascript ready made widget I decided to make my own control based on view.draw...
I think it would be interesting to take a look at the result in a video: http://youtu.be/QLfI1McLMa0?hd=1 (skip to 1:08 to view 'Control Curve' window).
In short, now I think there is no need to continue coding my own library since OnScreen GUI Toolkit is already exist . I'll try to adapt 'Control Curve' control in it and post result here if you don't mind.
Thanks for sharing your library

Aerilius

That looks cool!
This toolkit is in early development and it's possible that there will be soon bigger changes in the architecture of the underlying code.
Dialogs like yours don't exist yet at all, one would have to create a new Dialog class as subclass of Container and then create the dialog titlebar, close buttons etc. maybe border resizing...

Chris Fullmer

Ok, I uploaded my code for the RGB color picker. I'm sure there is lots of optimization that could be done. And its just wrapped in a class. As this development kit keeps improving and adding, maybe the RGB picker could get incorporated into it as well.

http://forums.sketchucation.com/viewtopic.php?f=180&t=47808

Chris

thomthom

Cool! It'd be really nice to see a unified framework here. We're clearly re-inventing each others work.
I have code that reads BMP files and let you draw it - but it's terrible slow.

dacastror

with this would it be possible to create a dialog that allows the user to enter a number?

(google translator)

Aerilius

Possibly, but it would not be ideal.
I also haven't yet got time to finalize this, but I might be able to finish it in future.