JavaFX 中的图像宽度绑定

Question

我有一个非常基本的应用程序，我相信它应该改变图像的宽度，但它什么也没做...任何人都可以告诉我为什么当我单击图像时，图像没有任何反应？

（注意，图像本身并不重要，我只是想弄清楚如何在 JavaFX 中缩小和放大图像）

import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.image.ImageView;
import javafx.scene.image.Image;
import javafx.input.MouseEvent;

var w:Number = 250;

Frame {
    title: "Image View Sample"
    width: 500
    height: 500
    closeAction: function() { 
        java.lang.System.exit( 0 ); 
    }
    visible: true

    stage: Stage {
        content: [
            ImageView {
                x: 200;
                y: 200;
                image: Image {
                    url: "{__DIR__}/c1.png"
                    width: bind w;
                }

                onMouseClicked: function( e: MouseEvent ):Void {
                    w = 100;
                }
            }
        ]
    }
}

谢谢！

Answer 1

尝试绑定比例属性：

import java.lang.System;
import javafx.application.Frame;
import javafx.application.Stage;
import javafx.scene.image.ImageView;
import javafx.scene.image.Image;
import javafx.input.MouseEvent;

var w:Number = 1;

Frame {
    title: "Image View Sample"
    width: 500
    height: 500
    closeAction: function() { 
        java.lang.System.exit( 0 ); 
    }
    visible: true

    stage: Stage {
        content: [
            ImageView {
                x: 200
                y: 200
                anchorX:200 
                anchorY:200
                scaleX:bind w
                scaleY:bind w
                image: Image {
                    url: "{__DIR__}/time.png"                    
                }

                onMouseClicked: function( e: MouseEvent ):Void {
                    w += 0.1;                    
                }
            }
        ]
    }
}

Answer 2

感谢您的回复，很抱歉延迟回复您，但事实证明您所需要做的就是绑定图像本身：

image: bind Image {
    url: "{__DIR__}/time.png"
    width: w;
}

这似乎可以解决问题，我个人认为这有点误导，但是嘿，有用