0

For my university project, I have to implement a simple GUI programme where I have to build shapes like (rectangle, square, circle etc) and do some basic operations on them ( group, move etc).

I have two layout Architecture, as shown in the image attached, where the left one will display the shapes created. However, how can I make this zoomable?

For example, if a user creates a rectangle that’s too big , in order to fit in the current dimensions, my programme needs to be able to zoom out to view it properly. But my right layout will stay fixed as is.

Any idea on what exactly from JavaFX I’d need to implement this?

screenshot

jewelsea
  • 150,031
  • 14
  • 366
  • 406
kibz
  • 1
  • 1
  • Related: [JavaFX correct scaling](https://stackoverflow.com/questions/16680295/javafx-correct-scaling). There are (probably) other questions on StackOverflow that might help you with this if you are good at searching for what you need. – jewelsea Nov 06 '21 at 09:02
  • Get everything working perfectly *without* the scaling function, and then try to add the scaling function later (that is just my advice), or you may spend so much of your time trying to get your scaling to work that the quality of the rest of the app suffers. – jewelsea Nov 06 '21 at 09:04
  • Also, zooming and panning are different things. Panning without zooming is likely easier and allowing for both together is more difficult. Do you really need both (you might) or is just panning enough? – jewelsea Nov 06 '21 at 09:06
  • This question will almost certainly get closed as not focused, just the way StackOverflow works. If that happens review, the close reason. It is OK to ask a more focused question after the original has been closed. – jewelsea Nov 06 '21 at 09:07

1 Answers1

4

This is actually quite simple if you use the scene graph. Make the left part a Pane. Add a Group node at its root and then add all your shapes to that Group node. You can then pan and zoom by just applying a single transform to this Group node.

mipa
  • 10,369
  • 2
  • 16
  • 35