3

我尝试将浮雕效果(也称为凹凸贴图)添加到复杂的剪裁图像中。(就是一块拼图。)这可以通过每像素操作来完成,但它非常昂贵:裁剪的确切形式是运行时确定的,因此即使是凹凸贴图也必须在运行时生成。

JavaFX 的光照效果提供了类似的开箱即用效果:

// Create clipping
pieceClip = createPiece(topEdge, leftEdge, bottomEdge, rightEdge);
pieceClip.setFill(Color.WHITE);
pieceClip.setStroke(null);

// Create clipped image view
imageView.setImage(image);
imageView.setClip(pieceClip);

// Create ambient light
Light.Distant light = new Light.Distant();
light.setAzimuth(-135.0);

// Create lighting effect
Lighting lighting = new Lighting();
lighting.setLight(light);
lighting.setSurfaceScale(4.0);

// Create shape to apply lighting on (the shape is the same as the clipping)
Shape pieceStroke1 = createPiece(topEdge, leftEdge, bottomEdge, rightEdge);
pieceStroke1.setFill(new Color(1, 1, 1, 0.4));
pieceStroke1.setStroke(null);

// Apply lighting
pieceStroke1.setEffect(lighting);

// Add clipped image and lighting overlay to the shape
getChildren().addAll(imageView, pieceStroke1);

这几乎可以正常工作,照明效果:

然而,它有一个副作用:由于覆盖层是白色的并且只是半透明的,它会使图像变暗(使它有点模糊,不像以前那样生动)。

我尝试使用 Blend(COLOR_BURN、DARKEN 等)来恢复图像颜色,但对这些效果不太熟悉,我失败了。

我怎么能保留我的图像色彩饱和度,但应用浮雕效果?

我有几个想法如何做到这一点,但我不知道哪一个会起作用:

  1. 将照明直接应用于图像。 它失败了,因为光照被应用到未剪裁的图像上。
  2. 通过在图像或照明覆盖上应用混合效果来纠正色彩饱和度降低 由于我在这些效果方面的无能而失败。
  3. 剪裁覆盖形状以仅覆盖受照明影响的区域 这将需要偏移贝塞尔曲线,这很难且成本高昂。
  4. 更改覆盖形状 alpha 以遵循照明效果强度。

任何想法将不胜感激。

4

1 回答 1

3

解决方案

ColorAdjust效果应用到效果链中的Lighting效果。

无论您做什么,照明效果都会在一定程度上改变图像的外观和颜色(因为这就是照明所做的),但是通过应用额外的颜色调整,您可以获得可以识别的非常接近的图像原色。

如果您需要调整图像的形状,请对剪裁的图像进行快照并将效果应用于快照(如果这是您想要的),如对 ImageView 上的 Border-Radius 和阴影的回答中所述。

例子

// increase brightness and contrast.
ColorAdjust brightLight = new ColorAdjust(0, 0, .25, 0.25); 

// chain in your lighting effect.
brightLight.setInput(lighting);

// apply the chained effect to your image.
ImageView litAdjusted = new ImageView(image);
litAdjusted.setEffect(brightLight);

可执行样本

这里的龙

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.*;
import javafx.scene.control.*;
import javafx.scene.effect.*;
import javafx.scene.image.*;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.text.TextAlignment;
import javafx.stage.Stage;

// Java 8 code
public class HereBeDragons extends Application {

    @Override public void start(final Stage stage) {
        Image image     = new Image(imageLoc);
        Image clipImage = new Image(CLIP_IMAGE_LOC);

        ImageView plain = new ImageView(image);

        ImageView lit = new ImageView(image);
        Lighting lighting = createLighting();
        lit.setEffect(lighting);

        ImageView litAdjusted = new ImageView(image);
        ColorAdjust brightLight = new ColorAdjust(0, 0, .25, 0.25);
        brightLight.setInput(lighting);
        litAdjusted.setEffect(brightLight);

        plain.setClip(new ImageView(clipImage));
        SnapshotParameters params = new SnapshotParameters();
        params.setFill(Color.TRANSPARENT);
        WritableImage clippedImage = plain.snapshot(params, null);
        ImageView litAdjustedClip = new ImageView(clippedImage);
        litAdjustedClip.setEffect(brightLight);
        plain.setClip(null);

        HBox layout = new HBox(
                10,
                new CaptionedImage(plain,       "Plain"),
                new CaptionedImage(lit,         "Lit"),
                new CaptionedImage(litAdjusted, "Lit and Adjusted"),
                new CaptionedImage(litAdjustedClip, "Clipped,\nLit and Adjusted")
        );
        layout.setPadding(new Insets(20));
        layout.setStyle("-fx-background-color: lightblue;");

        stage.setTitle("Here be Dragons");
        stage.setScene(new Scene(layout, Color.LIGHTBLUE));
        stage.setResizable(false);
        stage.show();
    }

    private Lighting createLighting() {
        // Create ambient light
        Light.Distant light = new Light.Distant();
        light.setAzimuth(-135.0);

        // Create lighting effect
        Lighting lighting = new Lighting();
        lighting.setLight(light);
        lighting.setSurfaceScale(4.0);

        return lighting;
    }

    private class CaptionedImage extends Label {
        public CaptionedImage(ImageView imageView, String caption) {
            setText(caption);
            setGraphic(imageView);
            setContentDisplay(ContentDisplay.TOP);
            setTextAlignment(TextAlignment.CENTER);

            setStyle(
                    "-fx-text-fill: midnightblue; " +
                    "-fx-font-size: 16px; " +
                    "-fx-font-family: palatino; " +
                    "-fx-font-style: italic;"
            );
        }
    }

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

    private static final String imageLoc =
        "http://icons.iconarchive.com/icons/custom-icon-design/round-world-flags/128/Wales-icon.png";    
    // icon license: Free for non-commercial use. 
    // Buy commercial license here: 
    // http://www.customicondesign.com/free-icons/flag-icon-set/flat-round-world-flag-icon-set

    private static final String CLIP_IMAGE_LOC =
            "http://icons.iconarchive.com/icons/gpritiranjan/simple-christmas/128/star-icon.png";
    // star icon license: freeware, commercial usage allowed.
}
于 2014-06-03T10:25:48.027 回答