【问题标题】:How to convert an image into a shape in Java?如何在Java中将图像转换为形状?
【发布时间】:2020-05-01 10:55:44
【问题描述】:

我目前正在从事一个股市项目,该项目教学生如何与股市互动。我现在正在研究的一个问题围绕着效率和内存问题。我在 adobe illustrator 中制作了所有 2D 图标(例如设置图标、投资组合图标等),我将这些文件导出为 png 文件,然后将它们放入我的程序中。我目前使用JavaFX,JavaFX的一个特性就是所谓的imageView,它是一种处理图像打开和查看的方法。

假设用户想在游戏中按下设置图标,我想在用户将鼠标悬停在该图标上时将设置图标更改为更深或更浅的颜色目前,为了给用户提供更好的用户体验(UX),我使用了两张不同的图片,将一张从框架中移除,并用另一张替换,效率非常低。

我知道JavaFX有一个Shape类,继承了很多方法如Fill,或者setFill,但是这些方法只能影响Shape 类。

我的问题是,“如何将导入到项目中的图像转换为可以使用 setFill 和 Fill on 等方法的图像”

【问题讨论】:

  • 图像分析是一个太宽泛的话题,无法在此向您完整介绍。 JavaFX 本身不提供这种功能。 Afaik Adob​​e Illustrator 允许您导出为 SVG。如果你这样做,你可以简单地将d元素的d属性值传递给SVGPath;还有其他加载 svg 的解决方案:stackoverflow.com/questions/12436274/svg-image-in-javafx-2-2 除了您可以通过使用适当的混合模式覆盖图像来实现类似的效果。例如multiply 将允许您通过覆盖 graysc 图像来使颜色变暗。
  • 考虑将图标放置在按钮中,而不是当前采用的方法。提供按钮以向单击和悬停的用户提供反馈。如果按钮的默认样式不是您想要的,您可以自定义按钮样式以更符合您的需要。
  • @jewelsea 我会看看 API 是否是我想要做的——谢谢!

标签: java eclipse image javafx shapes


【解决方案1】:

如果您只针对基本更改,例如使图标变暗或闪电,您可以查看 javaFx 的效果部分,您可以阅读它here,或者您可以按照建议将图像导入为 SVG在cmets中

如果您打算使用效果来实现,您可以使用 ColorAdjust 效果通过将亮度值设置为负值来实现悬停时变暗效果(ColorAdjust 中的亮度范围在 -1 和 +1 之间,其中 0是默认值),如下例所示

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.effect.ColorAdjust;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage s) {
        ImageView image = new ImageView(new Image("img.png"));

        ColorAdjust darker = new ColorAdjust();
        darker.setBrightness(-.3);

        image.setOnMouseEntered(e-> {
            image.setEffect(darker);
        });

        image.setOnMouseExited(e-> {
            image.setEffect(null);
        });

        s.setScene(new Scene(new StackPane(image)));
        s.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}    

更改图像的颜色可能涉及使用 ColorAdjust 通过设置色调值来调整色调

ColorAdjust hueShift = new ColorAdjust();
hueShift.setHue(-.3);

image.setOnMouseEntered(e-> {
    image.setEffect(hueShift);
});

image.setOnMouseExited(e-> {
    image.setEffect(null);
});

您可以通过将效果设置为其他效果的输入来组合效果,例如,如果您想使某个节点变暗并同时对其进行模糊,您可以将模糊效果设置为变暗颜色调整的输入

GaussianBlur blur = new GaussianBlur();
blur.setRadius(10);

ColorAdjust darker = new ColorAdjust();
darker.setBrightness(-.3);

darker.setInput(blur);

image.setOnMouseEntered(e-> {
    image.setEffect(darker);
});

image.setOnMouseExited(e-> {
    image.setEffect(null);
});

【讨论】:

    猜你喜欢
    • 2017-02-18
    • 2020-01-07
    • 1970-01-01
    • 2020-04-11
    • 1970-01-01
    • 2014-05-09
    • 2011-03-07
    • 1970-01-01
    • 2014-01-27
    相关资源
    最近更新 更多