I realize that in of TOAD books right, it justifies the reaons on why it uses tabbed pane is that tree view involves too much scrolling.
But for me i like tree view better. As it only shows you the top level.
I see TOAD user interface. i thought the tabbed panels was very confusing for me to switch around.
What are your opinions regarding this?
I think in general if you are designing the interface, I think it depends on the number of items you are trying to display.
in your TOAD example. (which i am assuming is Toad from www.quest.com) the tabs only serve to remove 1 level (the top level) from your tree.
The advantage the tree structure has is that you can 'drill down' from scheme to table to trigger, etc..
so it really depends on what you are trying to achieve, or the style you want to work with.
Related
Summary: I have seemingly hit a limitation in Figma when trying to make the columns behave akin to a CSS grid system. I would like to know if I have misunderstood Figma's built in capabilities, if there is a plug-in that solves the problem, if I have to create one Figma frame per CSS breakpoint (undesirable), or if there are other solutions.
Background: As an interaction/ UX designer, I would like to specify the responsiveness of a web based application, so that the front end developers know how the interface should appear at all browser widths. They implement in a CSS-based grid system similar to Bootstrap
So far, I failed in achieving what I want, and the most knowledgeable UX'ers in the company think I have hit a limitation in Figma's capabilities, but they are not certain.
Basically, what I want is this basic responsiveness, but column based. But as shown in this video, none of my experiments work.
I wonder if it boils down to this: If a Figma child element has:
horisontal constraint set to “Scale” and
vertical constraint set to “Hug contents”
Then the parent element cannot have:
vertical constraint set to “Hug contents”
Is this is a known limitation in Figma? If yes, are there plugins that solve this problem, or is it outside Figma's scope to offer this type of alignment with CSS-based grid systems? Obviously, it would be very beneficial if the solution also supports breakpoints.
P.S. I have asked which SE site that was most suitable for this question, and SO was the suggested site. The question was closed on UX.SE.
No, according to an answer on Figma's own forum, Figma's columns cannot behave akin to a CSS grid system, even though “several threads [have] requested [this] evolution”.
I've searched the web using all the search terms that my mind could come up with but all to no avail. I guess it's mainly because I can't explain my question with a couple of keywords. Anyway, here is my question:
You know how in games that use consoles you can navigate through the menu using the game pad buttons? And when you press right, it automatically selects the nearest control on the right of the current control. Likewise with up and down. And when you press a certain control and another list of menu unfolds on top the original control, and you are limited to select one of the new controls and can't select the other older controls even though they still appear on the screen? Well, how is that created programmatically? I'd love it if you can provide obj-c code of an implementation but any language would be fine. If not possible, then a pseudo code would also work fine with me. Even plain text would work with me but I wouldn't recommend it since I'm not a native speaker and may have issues understanding...
Basically, here is my question in bullet points in case I wasn't clear above due to my weak English:
1- How to move through a menu using a game pad.
2- Once a drop down list is selected, how to lock the contrils that can be selected to the controls that unfold from the drop down list.
And that's pretty much all of it. Thanks a lot for the help!
Make a collection of buttons
For each button, make each dpad direction optionally map to a new button
Make each button selection optionally map to a new collection
Done
Hard-coding is one way to map one piece of data to another. Or a file that describes it. Or static data. Or calculated algorithmically.
I'm trying to design a desktop UI for schematics, layout, drawing stuff. Just looking for high level advice from actual software designers.
Assuming an in-memory "database", (clojure map of arbitrary depth for all user data, and possibly another one for application preferences, etc.), I'm examining how to do the model-view-controller thing on these, where the data may be rendered and modified by any one or more of:
A standalone text field that shows a single parameter, such as box width.
An "inspector" type of view that shows multiple parameters of a selected object, such as box width, height, color, checkboxes, etc.
A table/spreadsheet type of view that shows multiple parameters of multiple objects, potentially the whole database
A graphical rendering of the whole thing, such as both schematic and layout view.
Modifying any one of these should show up immediately in every other active view, both text and graphical, not after clicking "ok"... so no modal boxes allowed. If for some reason the table view, an inspector view, and a graphical rendering are all in view, dragging the corner of the box graphically should immediately show up in the text, etc.
The platform in question is JavaFX, but I'd like a clean separation between UI and everything else, so I want to avoid binding in the JFX sense, as that ties my design data very tightly to JFX Properties, increases the graininess of the model, and forces me to work outside the standard clojure functions for dealing with data, and/or deal heavily with the whole getValue/setValue world.
I'm still assuming at least some statefulness/mutability, and the use of built-in Clojure functionality such as the ability to add-watch on an atom/var/ref and let the runtime signal dependent functions.
Platform-specific interaction will rest tightly with the actual UI, such as reifying ActionListeners, and dealing with ObservableValues etc., and will attempt to minimize the reliance on things like JavaFX Property for actual application data. I'm not entertaining FRP for this.
I don't mind extending JFX interfaces or making up my own protocols to use application-specific defrecords, but I'd prefer for the application data to remain as straight Clojure data, unsullied by the platform.
The question is how to set this all up, with closest adherence to the immutable model. I see a few options:
Fine-grain: Each parameter value/primitive (ie Long, Double, Boolean, or String) is an atom, and each view which can modify the value "reaches in" as far as it needs to in the database to change the value. This could suck as there could potentially be thousands of individual values (for example points on a hand-drawn curve), and will require lots of (deref...) junk. I believe this is how JFX would want to do this, with giant arrays of Properties at the leaf nodes, etc., which feels bloated. With this approach it doesn't seem much better than just coding it up in Java/C++.
Medium-grain: Each object/record in the database is an atom of a Clojure map. The entire map is replaced when any one of its values changes. Fewer total atoms to deal with, and allows for example long arrays of straight-up numbers for various things. But this gets complicated when some objects in the database require more nesting than others.
Coarse-grain: There is just one atom: the database. Any time anything changes, the entire database is replaced, and every view needs to re-render its particular portion. This feels a bit like using a hammer to swat a fly, and a naive implementation would require everything to re-render all the time. But I still think this is the best trade off, as any primitive has a clear access path from the root node, whether it is accessed on a per-primitive level or per-record level.
I also need the ability for one data template to be instantiated many times. So for example if the user changes a symbol or shape which is used in multiple places, a single edit will apply everywhere. I believe this also requires some type of "pointer"-like behavior. I think I can store a atom to the model, then instantiate as needed, and it can work in any of the above grain models.
Any other approaches? Is trying to do a GUI editor-like tool in a functional language just stupid?
Thanks
I don't think is stupid to use a functional language to do a GUI editor-like tool. But I can't claim to have an answer to your question. Here are some links that might help you in your journey:
Stuart Sierra - Components Just Enough Structure
Chris Granger - Light Table: Explains how Light Table (source) is structured.
Chris Granger - The IDE as a Value: blog post related to the video above
Conal Elliott - Tangible Functional Programming: Using Functional Reactive Programming to create a composable UI, but his code is in Haskell.
Nathan Herzing & Chris Shea - Helping voters with Pedestal, Datomic, Om and core.async
David Nolen - Comparative Literate Programming: Shows all to use core.async to simplify UI programming in ClojureScript. The ideas here can be used in a desktop UI.
Rich Hickey - The Language of the System: Amazing talk about system programming by the creator of Clojure.
Erik Meijer has a good quote about functional vs imperative code:
...no matter whether it's Haskell, C# Java, F#, Scala, Python, PHP think about the idea of having a sea of imperative code that interacts with the outside world and in there have islands of pure code where you write your functions in a pure way.
But you have to decide how big the islands are and how big the sea is. But the answer is never that there are only islands or only sea. A good programmer knows exactly the right balance.
I am working with MFC code that I believe was developed in the early 90's. I've been given the great task of bringing the software into the 21st century, getting it to work on the likes of Windows 7/8. The application targets numerous platforms, of which one is Windows XP. The original software had a fixed window size and looks terrible on certain OS. I have managed to overcome this but sizing the dialog leaves a lot of grey space. I need to incorporate anchors and docking, similar to .NET.
As always, time is limited, so I need quick, "dirty" solutions, until I get time to rewrite the UI layer. The application contains a number of "screens", each following a similar format. Banner at the top, content consisting of copyright, help on the LHS and task buttons on the RHS and a kind of footer control containing "hotkeys".
As a quick fix, I am thinking that resizing the dialog should cause the following.
Banner is anchored left and right
LHS/RHS content is split say 60/40
Footer is as per the banner
This is made more difficult as different controls are used for different target operating systems/platforms. Basically, the OnInitDialog, uses conditional compilation to to add controls, dynamically, depending on the platform.
To implement this I am guessing I need something like the following...
Each control "remembers" its bounds
I expect this to be tricky as no WM_CREATE message for dialog child controls.
Possibly use OnParentNotify.
Sizing the dialog "remembers" its last size and calculates differences in width and height.
The dialog sends a parent resize message to its immediate children so they can re-calculate layout.
My question, finally, is what is the best way to approach this?
One idea I have...
Introduce a new Widget class that extends CWnd and returns anchor details via a virtual method.
Create controls such as CBanner, CCopyright, CFooter etc that implement Widget
Create a RowWidget for content that sizes LHS and RHS content appropriately.
Now that was hard to put into words!
Any help appreciated.
Thanks
Karl
Actually a very common question and your reasoning is sound, but rather than reinventing the wheel, it might be better to first look at some freely available implementations along the lines you describe.
For example this CodeProject article does what I think you need.
I build tree with Hierarchical datatemplate (with button beside each node) loaded from xml file.
What I want to do is when i press the button beside the node it will open node details in a popup inside the tree (Like tree sub node)
Any ideas ????
I'm using Silverlight 4
Determine if you want type of layout control you want to use (Canvas, Grid, Stackpanel).
Each has their strengths and weaknesses.
Once you decide on this, start designing the logic... then you start coding.
If you're too lazy and want a control/solution that's alreayd built for you, you can try googling it... which i'm pretty sure you'll find samples/demos/source-code for.
Personally i do recommend you spend time looking for samples and source-code, because a hierarchical treeview is a bit more complex than you might think. In particular, the logic for your node placements so that they never collide with each other could be complex (depending on your level of experience).
If you DO decide to write your own, I applaud you, and you will surely learn way more this way.
Oh by the way, not sure what you mean by hierarchical datatemplate. I suggest you write a usercontrol for a single Node. then maybe write another control (treeview control) that manages all the nodes to present the hierarchy tree.