Hi,
I’m kind of new to the User Interface Design within Rhino. And I was wondering, how you guys approaching this.
To me, there are basically two apporaches, that I can make out from the discussion.
ETO Controls
In terms of design, I have trouble making Eto do what I want visually. For example, if I set up a button, I have no control on the “edge fillets” to determine how a button should be displayed.
Also the visual beaviour when resizing a window seems harder to control.
This is possible with Eto
This is not possible with “plain” Eto
ETO Webview Control
As I understand, If I want to go for more sophisticated designs I can realize this with WebView controls
though HTML, CSS and JS. I can pretty much create everything visually I can think of and link it to events in C# Code. I believe the Grasshopper Remote Control is realized with this technology. (Correct?)
So here are my questions:
When using the WebView, do you use for the “master” layout, or do you just use it “per component” and organize your controls in Eto Layouts?
Do you use any frameworks to generate HTML, or do you use a straight forward apporach with stringbuilders?
Is there any known issues with the WebView approach, when using it on MAC?
The GH Remote control panel is not using a WebView.
As someone who’s made Rhino UIs with WebViews (and like doing so) if you are only targeting Rhino for Mac and Windows, I would strongly suggest using ETO. If you look at David’s videos on YouTube, GH2 is using ETO controls for everything. This isn’t to say there isn’t a lot of customization, but you can get your fillet corner buttons in there somehow.
@MartinIC,
I’ve experimented with both approaches recently and here is a summary of my findings so far:
WebView works quite nicely, but the version of Eto embedded in Rhino by default relies on IE under the hood. This makes things a bit more cumbersome to set up and requires a few hacks to get things to display properly. Having said that, you have ultimate control over the UI with JS/CSS:
More details here:
While working with pure Eto, you can try the approach linked to by @fraguada. It allows for some basic style overrides. If you want more flexibility, you’ll need to derive from a Drawable and paint your own controls with custom functionality. I suspect, that this is how @DavidRutten created the entire GH2 UI Here is my take on a Slider/Stepper/Text Box combo:
Hi Luis, could you please elaborate on why you strongly suggest using Eto instead of WebView? I’m planning to use WebView to have a consistent look between web and rhino interfaces in my app. But after your suggestion I’m a bit worried. Are there any limitaions or caveats we should be aware about before diving in to WebView?
