In a tool such as Photoshop, there is a selection of tools you can click on (e.g. pen, brush etc). Once you click on a tool, you can use that tool to paint, erase etc depending on what tool is selected.
I'm wondering how that would be best implemented in an OO design. I could only think of having a GUIManager that always knows which tool is selected, then when the Canvas (drawing area) detects a mouse click or mouse drag it asks GUIManager which tool is selected and applies that tool's behavior.
Does anyone describe a possible solution in class level detail (or in any detail if you don't have time).
Take a look at the State Pattern which has exactly your example.
However, it's not actually a GUI question but more to an object-oriented approach to how to model this problem. The GUI doesn't really play into this.
I'm not sure OO principles really play into this except in the sense that all graphic elements are probably derived from common base classes in your GUI of choice.
The amount of complexity in an application that needs a hierarchy of screen menus à la photoshop would presumably dwarf the difference between composition vs inheritance vs functional-style vs whatever-you-want.
Although, should you be motivated to write the program twice using different styles, it might be interesting to see the results. The ranking of various programming styles is an open question without real answers at this point, although we think that OO-styles are important in a way we haven't yet completely quantified.
One idea for this would be to have a tool class. Just sketching this in C++-like pseudocode:
class Tool
{
public:
// Keep a pointer to the "document", i.e. some representation of the
// image you are editing
Tool(Document *pDoc);
// Process mouse events -- this need to be overridden to execute
// the appropriate behaviour depending on the concrete type of tool
virtual void OnMouseEvent(const MouseEvent &e) = 0;
// and so on
};
You then inherit from this abstract tool class to provide the concrete tools your application needs. When a certain tool is selected, you instantiate a corresponding tool object and remember it somewhere. The window forwards mouse events to the currently active tool object, which then does the appropriate thing for the tool that was selected.
This is an implementation of the State pattern that Johannes refers to.
Related
I'd like to obtain a reference to underlying java components for the controls I have in my GUI so as to customize their appearance.
I know about findjobj from Yair Altman which works really well:
myLink = uicontrol('String', '<html><u>Button that looks like a link.</u></html>');
jObj = findjobj(myLink);
jObj.setContentAreaFilled(0);
Unfortunately this solution is quite slow when there are a "lot" of controls to customize (because it has to parse the full hierarchy of objects in the figure and this for each control to customize).
Moreover the figure must be visible (else controls are not instantiated and java references cannot be found). Plus it must be moved of screen to avoid users to touch it while findjobj is running (sometimes make things crash because findjobj somehow relies on position of controls to find them while internally calling also drawnow which updates positions) ...
On some machines, even with only a few controls to customize, it can be up to 10 seconds before to have the figure to appear (most of the time is spent in findjobj).
I also know about uicomponent again from Yair Altman to directly create controls and get the handle to the underlying java component in one shot:
[myLink, jObj] = uicomponent('Style', 'JButton', 'String', '<html><u>Button that looks like a link.</u></html>');
jObj.setContentAreaFilled(0);
Unfortunately here the parent property can only be a figure and of course my controls are placed in gui layout containers to handle resizing and many other things nicely (and gui layout containter are not valid hg-handles for uicomponent to work)...
So was wondering if there could be any other fast solution to get underlying java components for controls in my GUI ? ... NB: I mainly only need to have buttons that looks like hyperlinks or animated gif (i.e. borderless buttons with htlm text/img inside).
This isn't a direct answer to your question, but I've built several GUIs that are based around GUI Layout Toolbox and that contain Java swing components. I typically arrange things so that the GUI Layout container (HBox, VBox, Grid etc) has a uipanel as a child, and then the uipanel has the Java swing component as a child.
You can typically parent a Java component to the uipanel in exactly the same way as parenting it to a figure (unlike a GUI Layout container), and it's no problem to parent a uipanel to a GUI Layout container.
So, for example, to add a button with a dropdown menu (no menu items, so it won't do anything, but just to illustrate):
>> u = uipanel;
>> ddbuttonclass = 'com.mathworks.widgets.DropdownButton';
>> ddbutton = javaObjectEDT(ddbuttonclass);
>> [jddbutton, hjddbutton] = javacomponent(ddbutton, [30,30, 60, 30], u);
Now you can parent u to a GUI Layout container, and you get all the nice resizing.
I'm not that familiar with Yair's uicomponent, but if you can get the handle of the java component somehow, you should be able to use something like the above.
PS If you want his direct input, #Yair is sometimes active on SO - he may get notified if I mention his name. If you're doing a lot of Java/MATLAB GUI work, I'd also recommend buying his book.
UICOMPONENT was designed to be a direct replacement of both Matlab's built-in UICONTROL and JAVACOMPONENT functions. This means that you can directly place a UICOMPONENT within panels, even those created by the GUI Layout toolbox.
You might need to cast the layout panel's handle to double (double(hPanel)) on some Matlab releases but that's about it:
[myLink, jObj] = uicomponent('Parent',hPanel, ...);
[myLink, jObj] = uicomponent('Parent',double(hPanel), ...); % on some Matlab releases
You could also use JAVACOMPONENT directly, but it doesn't really give you any benefits over UICOMPONENT, since UICOMPONENT uses JAVACOMPONENT under the hood and also adds important functionality (such as ensuring the component is placed on the EDT, and merging important properties from the Matlab wrapper).
As for FINDJOBJ, you can speed it up a bit by specifying the target object class using the 'class' parameter. But if your figure contains hundreds of controls it might still be slow. To this day, close to 10 years after my first version of FINDJOBJ, I still do not know of a direct way to get the underlying Java object. I assume there is one that is used internally by MathWorks, but I do not know it.
As #SamRoberts mentioned, this is all discussed in my book...
I use the MVC programming model. I am running into a problem using Unity's hierarchy inspector. Say I have a Controller script: C_CardDrag. Now, because this drags a UI item thats nested several layers deep, it won't be readily apparenty that this C_CardDrag script is attached to an icon within in the card, and NOT the root object. You see what I mean in the image below (the blue highlight is where the C_Drag needs to be attached, NOT the top level object, otherwise the whole thing gets dragged when I only want the icon in the middle dragged).
I feel that it can be VERY confusing to design and name classes when they need to appear on nested objects.
Do you have any design practices I can follow to make script names clearer to where they are attached?
For example say I have a Tree object, and it has several brances. And lets say I have a C_Tree script, and a C_Branch script. How would you handle making it clear that C_Tree goes on a Tree, a TOP level object, where as C_Branch goes on a nested UI object?
Update:
Found a good resource here: Component based game engine design
Like any software that is being developed, you should only apply the appropriate Architectural and Design patterns that fit that project.
For example:
I was building a game that would be used for different devices. Although Unity lets you switch from Android to iOS seemingly easy. This game could be played completely differently on different devices, so I wen't with MVC.
Another game was built around Peer to Peer.
So overall you have a lot of options.
The way you can organize your files is by folders in the Project section of the Editor. I like to use something like this:
You will notice the Model is not in the Hierarchy. I don't use MonoBehaviours for models. In some cases, even the Controller could be non-MonoBehaviour code. That is why I prefer to have all the organization happen in the Project not the Hierarchy.
I'm working on a project where they essentially used TPanel for the only purpose of displaying a bevel (And maybe the design time convenience Panel have over Bevels).
Ok, I know TPanel is heavier than TBevel. Amongs other things, each TPanel create a user objects, which is a limited resource.
What I would like to know, beyond user objects, what's the overhead of TPanel? Is it next to non-existent (Especially on modern day machines).
If you were working on such a system, would you suggest :
Going back and changing all TPanel to TBevel.
Say "Ok it was bad. Lets not do it again in the future"
or
it's too small a concern and the design time convenience is well
worth it.
I wouldn't know if this design is intentional but, there's a slight navigational behavior difference when controls are grouped together in a window. If the focus is changed by arrow keys, after the one having the last tab order the first control will be focused (down/right), or vice-versa (up/left). IOW the focus will be wrapped in the parent. That's of course if any of the controls do not need the arrow keys.
Regarding the question, as it is already stated in the comments, apart from using up a count in an object pool, there're other resources associated with a window. It will also waste a few CPU cycles. There'll be one more level in the clipping chain or the messaging or keeping one more z-order list etc.. MSDN puts it as (I guess navigational aspect is being referred rather than visual partitioning):
For best performance, an application that needs to logically divide its main window should do so in the window procedure of the main window rather than by using child windows.
Nevertheless, as again already stated in the comments, most probably, no one will be able to tell the performance or resource difference caused by a few panels..
The correct answer is choice #3, so if that's the project's design approach, don't change it.
This question arises because I want to capture LostFocusEvent from Dialog. Unfortunately, this event is not fired for non Component derived components. What I want to ask is what is the aim of Dialog not derived from Component, but RichWindow, as compared to the Swing library?
I think really the best way to get the answer is to contact Ingo Maier directly, but you may be able to deduce the some of the thinking behind from his blog article The scala.swing package in 2.8 and beyond:
Window hierarchy
This is how the Java AWT/Swing window hierarchy looks like:
While AWT's Frame and Dialog share the common base class Window, the Swing extensions have no subclass relationship or extend a common interface even though they share common functionality not present in AWT. In an attempt to straighten things up a little, we redesigned the window base hierarchy in scala.swing which now looks as follows:
[...]
This design lets us factor common wrapper code into class RichWindow.
So I am guessing that this is a deliberate design by the author stating that Windows are in fact not components in the same way frames and buttons are, and can be dropped on to other containers.
How would I go about implementing something along the lines of "scrubby sliders", like in Photoshop and quite a few other image-processing applications?
They are slightly hard to describe.. basically you have a regular numeric input-box, but you can click-and-hold the mouse button, and it functions like a slider (until you release). If you click in the box, you can select text, edit/paste/etc as usual.
The Photoshop docs describe it, and I put together a quick example video (an example of the sliders in Shake)
Another similar implementation would be the jog-wheel in Final Cut Pro, which functions similarly, without the numeric readout being underneath.
I can't seem to find any mention of implementing these, although there is probably alternative names for this. It is for a OS X 10.5 Cocoa application.
It is for a colour-grading application, where a user might need to make tiny adjustments (0.001, for example), to huge adjustments (say, -100 +100) on the same control. A regular slider isn't accurate enough over that range of value.
Copy-and-pasting values into the box would be a secondary concern to scrubbing the values, and the Photoshop/Shake setup really well. The unobviousness of the control is also of a low concern, as it's not a "regular desktop application"
I've encountered those. They suck, because they prevent the user from dragging to select the text of the number.
A better idea would be a miniature slider beneath the field that expands to a full-size slider when the user holds down the mouse button on it and collapses back to its miniature size when the user releases the mouse button. This way, the selection behavior is still available, but you also provide the slider—and in a more obvious way.
There's no built-in class in Cocoa for either one. You'll have to implement your own.
I doubt that this exists in Cocoa framework. As far as I remember it is not mentioned in the Apple Human Interface Guidelines.
You can develop one yourself by using a custom view and tracking mouse events (-mouseDown:, mouseUp:, -mouseDragged:).