OnScreen GUI Toolkit

OnScreen GUI Toolkit

Postby Aerilius » Wed Sep 05, 2012 11:37 pm

In some situations the possibilities with SketchUp's built-in UI elements are easily exhausted, they are either too obtrusive (UI.inputbox), too hidden (VCB) or not flexible enough (Toolbar).
In my case I needed only a few tool options that were not worth to have a webdialog or that would be rather confusing on a toolbar (where users expect tools).
So I created these UI elements using the View.draw methods, nothing new, except that I made some sort of toolkit that can be implemented with only a few lines (example):

Code: Select all
class TestTool

  include AE::GUI::OnScreen

  def initialize

    window.layout=({:margin=>5, :orientation=>:horizontal, :align=>:center, :valign=>:top})

    button = Button.new("Click Me"){
      UI.messagebox("Clicked!")
    }

    slider = Slider.new("Radius", [0,100]){|value|
      @@radius = value
    }

    window.add(button, slider)

  end

end


https://bitbucket.org/Aerilius/onscreen-gui/wiki/Home
More widgets can be added and the style can be changed with a CSS-like syntax.
sketchup_css.png
0

Aerilius 
PluginStore Author
PluginStore Author
 

Re: OnScreen GUI Toolkit

Postby driven » Thu Sep 06, 2012 12:40 am

Excellent,

I'll give it a spin on my mac... if I can clone the source for AE::GUI::OnScreen ??

john
0
Last edited by driven on Thu Sep 06, 2012 12:58 am, edited 1 time in total.
learn from the mistakes of others, you may not live long enough to make them all yourself...

driven 
PluginStore Author
PluginStore Author
 

Re: OnScreen GUI Toolkit

Postby Jim » Thu Sep 06, 2012 12:55 am

Nice idea. It definitely fills a niche for some types of plugins. :thumb:
0
Hi

Jim 
Global Moderator
 

Re: OnScreen GUI Toolkit

Postby Dan Rathbun » Thu Sep 06, 2012 1:51 am

interesting!
0
    I'm not here much anymore. But a PM will fire email notifications.
    User avatar
    Dan Rathbun 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Aerilius » Thu Sep 06, 2012 4:02 am

    driven wrote:if I can clone the source for AE::GUI::OnScreen ??

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

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

    Aerilius 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Anton_S » Thu Sep 06, 2012 7:06 am

    Just, Spectacular, just Spectacular!!!
    :!: :!: :!: :!:
    0

    Anton_S 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby thomthom » Thu Sep 06, 2012 8:35 am

    :thumb: :thumb: :thumb:

    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.
    0
    Thomas Thomassen — SketchUp Monkey & Coding addict
    List of my plugins and link to the CookieWare fund
    User avatar
    thomthom 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby driven » Fri Sep 07, 2012 2:44 am

    Aerilius wrote: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
    0
    learn from the mistakes of others, you may not live long enough to make them all yourself...

    driven 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Chris Fullmer » Fri Sep 07, 2012 4:40 am

    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.
    0
    Lately you've been tan, suspicious for the winter.
    All my Plugins I've written
    User avatar
    Chris Fullmer 
    SketchUp Team
    SketchUp Team
     

    Re: OnScreen GUI Toolkit

    Postby thomthom » Fri Sep 07, 2012 9:14 am

    The source for GL_Image is here at the repo:
    https://bitbucket.org/thomthom/tt-libra ... l_image.rb
    Docs:
    http://www.thomthom.net/software/sketch ... Image.html


    Chris Fullmer wrote: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.
    0
    Thomas Thomassen — SketchUp Monkey & Coding addict
    List of my plugins and link to the CookieWare fund
    User avatar
    thomthom 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Aerilius » Fri Sep 07, 2012 9:44 am

    driven wrote: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 wrote: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.
    0

    Aerilius 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby driven » Fri Sep 07, 2012 11:39 am

    Aerilius wrote: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
    0
    learn from the mistakes of others, you may not live long enough to make them all yourself...

    driven 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby thomthom » Fri Sep 07, 2012 11:43 am

    Can we get a public Issue Tracker?
    0
    Thomas Thomassen — SketchUp Monkey & Coding addict
    List of my plugins and link to the CookieWare fund
    User avatar
    thomthom 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby thomthom » Fri Sep 07, 2012 11:56 am

    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:
    Code: Select all

    class MyTool
      def initialize
        
    @drawing_cache = DrawCache.new( Sketchup.active_model.active_view )
      end
      def onLButtonUp
    (flags, x, y, view)
        @drawing_cache.line_stipple = '-'
        @drawing_cache.draw( GL_QUADS, ... )
        @drawing_cache.draw( GL_LINES, ... )
        @drawing_cache.draw_points( GL_QUADS, ... )
      end
      def draw
    ( view )
        @drawing_cache.render
      end
    end 
    # class
     


    DrawCache Class
    Code: Select all
    #-------------------------------------------------------------------------------
    #
    # Thomas Thomassen
    # thomas[at]thomthom[dot]net
    #
    #-------------------------------------------------------------------------------


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

    end # module
    0
    Thomas Thomassen — SketchUp Monkey & Coding addict
    List of my plugins and link to the CookieWare fund
    User avatar
    thomthom 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Jim » Sat Sep 08, 2012 3:50 pm

    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.

    2012-09-08_103757.png
    0
    Hi

    Jim 
    Global Moderator
     

    Re: OnScreen GUI Toolkit

    Postby sdmitch » Sat Sep 08, 2012 6:09 pm

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

    OnScreenGUI.png
    0
    Nothing is worthless, it can always be used as a bad example.

    http://sdmitch.blogspot.com/
    User avatar
    sdmitch 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Jim » Sat Sep 08, 2012 6:21 pm

    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.
    0
    Hi

    Jim 
    Global Moderator
     

    Re: OnScreen GUI Toolkit

    Postby sdmitch » Sat Sep 08, 2012 6:32 pm

    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".
    0
    Nothing is worthless, it can always be used as a bad example.

    http://sdmitch.blogspot.com/
    User avatar
    sdmitch 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Aerilius » Sun Sep 09, 2012 6:34 pm

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

    Aerilius 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby tomasz » Wed Sep 12, 2012 11:35 am

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

    tomasz 
    SU2TH & SU2KT Developer
     

    Re: OnScreen GUI Toolkit

    Postby kirill2008 » Fri Sep 14, 2012 10:38 am

    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 :thumb: . I'll try to adapt 'Control Curve' control in it and post result here if you don't mind.
    Thanks for sharing your library :thumb:
    0

    kirill2008 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Aerilius » Fri Sep 14, 2012 11:04 am

    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...
    0

    Aerilius 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby Chris Fullmer » Sat Sep 15, 2012 2:09 am

    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.

    viewtopic.php?f=180&t=47808

    Chris
    0
    Lately you've been tan, suspicious for the winter.
    All my Plugins I've written
    User avatar
    Chris Fullmer 
    SketchUp Team
    SketchUp Team
     

    Re: OnScreen GUI Toolkit

    Postby thomthom » Sat Sep 15, 2012 10:31 am

    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.
    0
    Thomas Thomassen — SketchUp Monkey & Coding addict
    List of my plugins and link to the CookieWare fund
    User avatar
    thomthom 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby dacastror » Sat Feb 02, 2013 7:22 pm

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

    (google translator)
    0

    dacastror 
     

    Re: OnScreen GUI Toolkit

    Postby Aerilius » Sun Feb 03, 2013 12:33 am

    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.
    0

    Aerilius 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby driven » Sun Feb 03, 2013 12:59 am

    Has everyone else seen this one?
    http://sketchucation.com/forums/viewtopic.php?f=323&t=41982&start=45#p406363
    it is in the other thread but thought it was easier to ask about if it's here...

    is it the same concept?
    john
    0
    learn from the mistakes of others, you may not live long enough to make them all yourself...

    driven 
    PluginStore Author
    PluginStore Author
     

    Re: OnScreen GUI Toolkit

    Postby dacastror » Sun Feb 03, 2013 5:38 pm

    I would like to do this, to make a inputbox made with OpenGL, could you please show an example of how to do this?
    0

    dacastror 
     

    SketchUcation One-Liner Adverts

    by Ad Machine » 5 minutes ago



    Ad Machine 
    Robot
     



     

    Return to Developers' Forum

    Who is online

    Users browsing this forum: No registered users and 5 guests

    Visit our sponsors: