How to resize window when stage style is undecorated ?

Question

Hi,
I have one undecorated window and I want to make it resizable by using mouse.
How can I do it ?
If I use decorated window then it allows me to resize it.
Thanks.

Answer 1

Just make a draggable shape and resize the stage depending on the drag action.
Here is a simple stage illustrating that and moving the window too.
Note an old bug already seen in 1.1 at least: when dragging such window, on WinXP, sometime it seems to "jump" to one bound of the screen, then it goes back (in a flicker) to current position. Strange and annoying.
def resizeHandle: Path = Path
    var origX = bind scene.width
    var origY = bind scene.height
    var startW: Number; var startH: Number;
    elements:
        MoveTo { x: bind origX, y: bind origY }
        LineTo { x: bind origX - 50, y: bind origY - 30 }
        LineTo { x: bind origX - 30, y: bind origY - 50 }
    fill: Color.CORAL
    stroke: null
    blocksMouse: true
    // Resize with the arrow
    onMousePressed: function (evt: MouseEvent): Void
        startW = stage.width;
        startH = stage.height;
    onMouseDragged: function (evt: MouseEvent): Void
        stage.width = startW + evt.dragX;
        stage.height = startH + evt.dragY;
var keyHandler: Rectangle;
def titleBar: Stack = Stack
    var title: Text;
    content:
        keyHandler = Rectangle
            width: bind title.layoutBounds.width * 1.2
            height: bind title.layoutBounds.height * 1.3
            fill: Color.web('#33FF55')
            blocksMouse: true
            // We can drag the stage by dragging the title bar
            onMouseDragged: function (evt: MouseEvent): Void
                stage.x += evt.dragX;
                stage.y += evt.dragY;
            onKeyReleased: function (evt: KeyEvent): Void
                if (evt.code == KeyCode.VK_ESCAPE)
                    FX.exit();
                println(evt);
        title = Text
            content: "Resizable and Draggable Window"
            font: Font { name: "Arial Bold", size: 24 }
            fill: Color.web('#331122')
var scene: Scene;
def stage: Stage = Stage
    title: "Undecorated Stage"
    style: StageStyle.UNDECORATED
    scene: scene = Scene
        width: 500
        height: 500
        fill: Color.GOLD
        content:
            Ellipse
                centerX: bind scene.width / 2
                centerY: bind scene.height / 2
                radiusX: bind 0.45 * scene.width
                radiusY: bind 0.45 * scene.height
                fill: Color.AQUA
            Circle
                centerX: bind scene.width - 55
                centerY: bind scene.height - 55
                radius: 50
                fill: Color.PURPLE
            titleBar,
            resizeHandle
keyHandler.requestFocus();