How to add button and lineedit in UI with ruby

Hey guys, i want to design UI for my ruby plugin and i need a button for user to choose folder. The whole UI is like this:


After i click the button, UI.select_directory pops up, and fill the lineedit with path. But i dont know how to connect the button in the interface.

You will need to use UI::HtmlDialog class.

In the HTML web page for the interface identify the path edit control with an ID ("path_edit_ID" for this example.)

<input type="button" value="Choose folder" onclick="getPath;"/>

Then add an onClick JS function for the button …
In JS …

<script=javascript>
function getPath () {
    sketchup.browse_for_path
}
</script>

… that makes a Ruby callback whose block makes the call to UI.select_directory().
In Ruby …

@dialog.add_action_callback("browse_for_path") { | action_context |
  path = UI.select_directory(
    title: "Select Image Directory",
    directory: "C:/images"
  )
  send_path_to_dialog(path) if path
}

If the return value from the call is a valid string (boolean true in Ruby) then make a call to the dialog sending over the path string to the path edit box by ID.

def send_path_to_dialog(path)
  @dialog.execute_script("path_edit_ID.value='#{path}';")
end

… or …

def send_path_to_dialog(path)
  @dialog.execute_script("document.getElementByID('path_edit_ID').value='#{path}';")
end

(Can’t remember if the former will work.)

We have some HtmlDialog example on GitHub you can look at for reference:

1 Like

This is so cool, can i find API of HtmlUI ?:grinning:

This works~ now i can write the core code of my plugin.:wink:

2 Likes

The SketchUp Ruby API is documented here: http://ruby.sketchup.com/

In addition to that key resources are:

This really helps a lot.
I have a question about Ruby API: after i install Thea for SketchUp, can i get it in my Ruby plugin to ‘Click’ the final submenu ‘Export Model as Thea Scene’.
Could I get the extension API to ‘Click’ the desired submenu?
Maybe it’s like simulate the mouse click, maybe not. I don’t know if i can implement via .rb.:face_with_monocle:

No way to drive menu clicks from the Ruby API. Instead you’d invoke the ruby methods the menu would invoke. When it’s not your own extension you try to invoke you can try to reach out to the developer and ask for details.

The easiest thing to do (if the Thea extension does not expose commands to other coders,) is to assign a shortcut keychord to the export menu item, and then use WIN32OLE and the SendKeys method call. (But this only MS Windows.)

See my response to your other post …
Use the ruby code to simulate a mouse click on the sub-menu in menu - #5 by DanRathbun

Wow, i can’t believe you can see that. After i posted that when i realized that it was posted ONE YEAR AGO in the first place! Thans you very much for your wonderful answer.:grinning:

Well your post revived the topic and brought it to the top of the Latest list, so everyone will “see” that the thread had “traffic”.

Glad ya’ liked the answer.