JavaFX - How to create simple user controls?

Question

I have a task to program a graphical network editor application as a university project. For this, I need three types of elements / controls. The shape of a circle, a rectangular shape and arrows to connect other shapes (all this is somewhat similar to MS Visio). Forms / controls need additional functions, such as moving, scaling the context menu, etc. I also need to have full control over the graphical representation of these objects, i.e. I want to "draw" them myself or, at least, be able to modify them as necessary.

I use JavaFX and have almost no experience. So I was wondering what would be the best way to implement these user controls. SkinBase use JDK 7, so using SkinBase and BehaviourBase not an option, as they are closed before JDK 8.

I was thinking of subclassing Path or Canvas for use as my controls. But I know too little about the implications for making an informed decision.

Can someone give me some advice on which base classes to consider and what consequences they might have?

thanks alot.

Answer 1

This answer will be just advice, there is no real right or wrong answer. Advice is necessarily stubborn and not applicable to all situations, if you do not agree with it, or it does not apply to your situation, just ignore it.

Sorry for the length, but the question is open and the potential answer is complex.

I was thinking of subclassing Path or Canvas to use as my controls.

not to do. Enjoy composition over inheritance . Have a control class that implements the functional interface of the control and works regardless of which interface technology is behind it. Provide the control class with a reference to the skin class, which is the control's user interface representation. The skin will indicate how to visualize the control in a given state (getting the control state from the associated control object). In addition, the skin will be what responds to manipulations with the user, for example, a mouse click, and instructs the control to change its state based on the mouse click - so that the skin knows what control it is associated with, and vice versa. The management class has related properties to represent the management state.

A simple example of this is Square and SquareSkin from this tic-tac-toe game.

For example, imagine a checkbox control. A binding property of a control can be an enumeration with states (checked, unchecked, undefined). The skin can display a checkmark in the form of a square square with a check mark to represent the status of the check. Or maybe the skin will display a rounded edge with X. The skin can use any technology that you want to display, such as a canvas or a set of nodes. The skin registers listeners for mouse clicks, keystrokes, etc. And tells the control to set the check state for it. It also has a listener in check state and will choose whether to display a control tick based on this state.

The main thing is that the API for this flag is only a flag management class with a validation state. The way the user interface is handled is abstracted from the checkbox API, so you can change the implementation of the user interface, but you want without changing any other code.

The subclass path is very different from the Canvas subclass. To subscribe to this situation, I would definitely like to subclass Shape node (or Region), not Canvas. Using nodes, you automatically get a truly rich visualization of the interface and event model, a set of bindable properties, and drawing frames that you won’t get with Canvas. If you are not using Nodes, you will probably end up trying to recreate and build some parts of the node functions in some non-standard way. The canvas is great for things like porting 2D games or graphics engines from other frameworks or creating objects that are pixel manipulators, such as a particle system, but avoid them otherwise.

Consider using the layout panel for your control skin, for example. StackPane or something like that. Layout panels are containers, so you can place them inside and use aggregation and composition to create more complex controls. Layout panels can also help plan your sites.

Anything that subclasses an area, such as a panel, can be styled using CSS into arbitrary shapes and colors. This actually works as a built-in checkbox (and other controls) in JavaFX. A checkmark is a stack of two regions, one is a box and the other is a check. Both styles are written in CSS - find it . Check-box in the modena.css stylesheet for JavaFX. Notice how -fx-shape used to get the shape of the checkmark by specifying the svg path (which you can create in an svg editor such as inkscape). Also pay attention to how background layers are used to get things like focus rings. The advantage of using CSS for style is that you can stylistically change your controls without touching the Java code.

therefore using SkinBase and BehaviourBase is not an option

Despite the fact that you decide not to use these base classes (which, I think, is an OK solution, even if you are targeting only Java 8+), I think it's worth exploring the design of the controls in JavaFX Source . Examine the button or checkbox so you can see how experts do such things. Also note that such implementations may be excessive for your application because you are not creating a reusable management library. You just need something that will work well and just within your application (for this reason, I do not necessarily recommend extending SkinBase for all applications).

At least read in the controls on the open-jfx wiki page .

Requires JDK 7

IMO, it makes no sense to develop a new JavaFX targeting application for Java 7. Many bugs have been fixed for Java 8, new and useful features have been added. In general, Java 7 is a suboptimal target platform for JavaFX applications. If you pack the application as a standalone application, then you can send any Java platform with your application, so the target platform will not matter.

IMO deployment technologies, such as WebStart or embedded browser applications (applets) that can use pre-installed Java environments on the system, are deprecated deployment modes that are best avoided for most applications.

However, a situation may arise where you must have Java 7 due to some restrictions outside of your control, so I think that you just carefully evaluate your situation. If you have such limitations and you must rely on a stable, outdated set of user interface tools that work with versions released many years ago, you can always use Swing.

Answer 2

From oracle, the Path class is a simple form and provides the tools necessary for basic design and geometric path management, while Canvas is an image that can be drawn using the set of graphics commands provided by GraphicsContext.

This means that the user can use the canvas to draw the desired shapes at the request of the user.

Of the main ways that I can say, it would be the following:

• Use the canvas, as this will help and allow you to customize the "drawing". Creating menu buttons for circles, rectangles, arrows, etc., Like in MS Paint. The "Onclick drag" function on the canvas can be used to "draw."

• Circle and rectangle are available in libraries you can use.

• You can use arrows, for example, the method here . I think the same example you want to create.

• Custom controllers and context menus can be created too docs.oracle.com

• Scaling and moving can be done by linking the drag and drop function to the scale or translating the animation. Mousepressed and Mousereleased can be used to track coordinates for drawing a shape.

Answer 3

This is my advice, you can use a control prototype. Or an application or design tool that can provide you with targeted control or an icon with a circle shape, rectangular shape and arrows. I do not know how my advice works. You can try.