閱讀(11.2k) 書簽贊(0) 我要糾錯(cuò)

JavaFX 效果

2018-03-13 00:28 更新

JavaFX教程 - JavaFX效果

混合效果

混合是將兩個(gè)輸入組合在一起的效果使用預(yù)定義的混合模式之一。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.BlendMode;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class Main extends Application {
  public static void main(String[] args) throws Exception {
    launch(args);
  }

  @Override
  public void start(final Stage stage) throws Exception {

    Rectangle r = new Rectangle();
    r.setX(590);
    r.setY(50);
    r.setWidth(50);
    r.setHeight(50);
    r.setFill(Color.BLUE);

    Circle c = new Circle();
    c.setFill(Color.RED);
    c.setCenterX(590);
    c.setCenterY(50);
    c.setRadius(25);
    c.setBlendMode(BlendMode.SRC_ATOP);

    Group g = new Group();
    g.setBlendMode(BlendMode.SRC_OVER);
    g.getChildren().add(r);
    g.getChildren().add(c);

    HBox box = new HBox();
    box.getChildren().add(g);

    Scene scene = new Scene(box, 400, 450);
    stage.setScene(scene);
    stage.show();
  }
}

以下代碼使用COLOR_BURN混合模式。

Text text1 = new Text(25, 25, "o2fo.com");
text1.setFill(Color.CHOCOLATE);
text1.setFont(Font.font(java.awt.Font.MONOSPACED, 35));
      
text1.setBlendMode(BlendMode.COLOR_BURN);

上面的代碼生成以下結(jié)果。

BlendMode.MULTIPLY

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.BlendMode;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class Main extends Application {
  public static void main(String[] args) {
    Application.launch(args);
  }

  @Override
  public void start(Stage primaryStage) {
    primaryStage.setTitle("Text Fonts");

    Group g = new Group();
    Scene scene = new Scene(g, 550, 250);

    Rectangle r = new Rectangle();
    r.setX(50);
    r.setY(50);
    r.setWidth(50);
    r.setHeight(50);
    r.setFill(Color.BLUE);

    Circle c = new Circle();
    c.setFill(Color.rgb(255, 0, 0, 0.5));
    c.setCenterX(50);
    c.setCenterY(50);
    c.setRadius(25);
    c.setBlendMode(BlendMode.MULTIPLY);

    g.getChildren().add(r);
    g.getChildren().add(c);

    primaryStage.setScene(scene);
    primaryStage.show();
  }
}

上面的代碼生成以下結(jié)果。

模糊效果高斯模糊

JavaFX支持boxblur，運(yùn)動(dòng)模糊或高斯模糊。文本與GaussianBlur。

高斯模糊使用具有可配置半徑的高斯算法來模糊對(duì)象。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.GaussianBlur;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
  public static void main(String[] args) {
    Application.launch(args);
  }

  @Override
  public void start(Stage primaryStage) {
    primaryStage.setTitle("");
    Group root = new Group();
    Scene scene = new Scene(root, 300, 250, Color.WHITE);

    Group g = new Group();

    Text t = new Text();
    t.setX(10.0);
    t.setY(40.0);
    t.setCache(true);
    t.setText("Blurry Text");
    t.setFill(Color.RED);
    t.setFont(Font.font(null, FontWeight.BOLD, 36));

    t.setEffect(new GaussianBlur());
    
    g.getChildren().add(t);

    root.getChildren().add(g);
    primaryStage.setScene(scene);
    primaryStage.show();
  }
}

上面的代碼生成以下結(jié)果。

BoxBlur效果

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.BoxBlur;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
    public static void main(String[] args) {
        Application.launch(args);
    }
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Text Fonts");
        Group root = new Group();
        Scene scene = new Scene(root, 550, 250,Color.web("0x0000FF",1.0));

        Text text = new Text(50, 100, "JavaFX 2.0 from Java2s.com");
        Font sanSerif = Font.font("Dialog", 30);
        text.setFont(sanSerif);
        text.setFill(Color.RED);
        root.getChildren().add(text);

        BoxBlur bb = new BoxBlur();
        bb.setWidth(15);
        bb.setHeight(15);
        bb.setIterations(3);

        text.setEffect(bb);
        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

上面的代碼生成以下結(jié)果。

運(yùn)動(dòng)模糊

使用運(yùn)動(dòng)模糊，我們可以配置半徑和角度來創(chuàng)建移動(dòng)對(duì)象的效果。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.effect.MotionBlur;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
  public static void main(String[] args) throws Exception {
    launch(args);
  }
  @Override
  public void start(final Stage stage) throws Exception {

    Text t = new Text();
    t.setX(20.0f);
    t.setY(80.0f);
    t.setText("Motion Blur");
    t.setFill(Color.RED);
    t.setFont(Font.font("Arial", FontWeight.BOLD, 60));

    MotionBlur mb = new MotionBlur();
    mb.setRadius(15.0f);
    mb.setAngle(45.0f);

    t.setEffect(mb);

    t.setTranslateX(10);
    t.setTranslateY(150);

    HBox box = new HBox();
    box.getChildren().add(t);

    Scene scene = new Scene(box, 400, 450);
    stage.setScene(scene);
    stage.show();
  }
}

上面的代碼生成以下結(jié)果。

綻放效果

基于可配置的閾值，bloom效果使得較亮的部分看起來發(fā)光。

閾值在0.0到1.0之間。默認(rèn)情況下，閾值設(shè)置為0.3。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.Bloom;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
    public static void main(String[] args) {
        Application.launch(args);
    }
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Text Fonts");

        Group g = new Group();
        Scene scene = new Scene(g, 550, 250,Color.web("0x0000FF",1.0));

        Rectangle r = new Rectangle();
        r.setX(10);
        r.setY(10);
        r.setWidth(160);
        r.setHeight(80);
        r.setFill(Color.DARKBLUE);

        Text t = new Text();
        t.setText("Bloom!");
        t.setFill(Color.YELLOW);
        t.setFont(Font.font(null, FontWeight.BOLD, 36));
        t.setX(25);
        t.setY(65);

        g.setCache(true);
        g.setEffect(new Bloom());
        g.getChildren().add(r);
        g.getChildren().add(t);
        

        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

上面的代碼生成以下結(jié)果。

下降陰影效果

陰影效果呈現(xiàn)內(nèi)容的陰影。我們可以配置陰影的顏色，半徑，偏移和其他參數(shù)。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.DropShadow;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
    public static void main(String[] args) {
        Application.launch(args);
    }
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Text Fonts");
        Group root = new Group();
        Scene scene = new Scene(root, 550, 250, Color.WHITE);

        Text text = new Text(150, 50, "JavaFX from Java2s.com");
        text.setFill(Color.BLUE);
        DropShadow dropShadow = new DropShadow();
        dropShadow.setOffsetX(2.0f);
        dropShadow.setOffsetY(4.0f);
        dropShadow.setColor(Color.rgb(150, 50, 50, .688));
        text.setEffect(dropShadow);
        
        root.getChildren().add(text);

        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

上面的代碼生成以下結(jié)果。

內(nèi)部陰影效果

內(nèi)部陰影效果在具有指定顏色，半徑和偏移的內(nèi)容內(nèi)繪制陰影。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.effect.InnerShadow;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
  public static void main(String[] args) throws Exception {
    launch(args);
  }
  @Override
  public void start(final Stage stage) throws Exception {
    Text t = new Text();
    t.setX(20.0f);
    t.setY(80.0f);
    t.setText("o2fo.com");
    t.setFill(Color.RED);
    t.setFont(Font.font("Arial", FontWeight.BOLD, 60));
    
    InnerShadow is = new InnerShadow();
    is.setOffsetX(2.0f);
    is.setOffsetY(2.0f);
    
    t.setEffect(is);

    t.setTranslateX(10);
    t.setTranslateY(150);

    HBox box = new HBox();
    box.getChildren().add(t);

    Scene scene = new Scene(box, 400, 450);
    stage.setScene(scene);
    stage.show();
  }
}

上面的代碼生成以下結(jié)果。

反射

反射效果將對(duì)象的反射版本渲染到實(shí)際對(duì)象下面。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.Reflection;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
    public static void main(String[] args) {
        Application.launch(args);
    }
    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Text Fonts");
        Group root = new Group();
        Scene scene = new Scene(root, 550, 250, Color.WHITE);

        Text text = new Text(50, 50, "JavaFX 2.0 from Java2s.com");
        Font monoFont = Font.font("Dialog", 30);
        text.setFont(monoFont);
        text.setFill(Color.BLACK);
        root.getChildren().add(text);

        Reflection refl = new Reflection();
        refl.setFraction(0.8f);
        text.setEffect(refl);

        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

上面的代碼生成以下結(jié)果。

照明效果

照明效果產(chǎn)生照射給定內(nèi)容的光源。它可以給平面物體更逼真的三維外觀。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.Effect;
import javafx.scene.effect.Glow;
import javafx.scene.effect.Light;
import javafx.scene.effect.Lighting;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application
{
   @Override
   public void start(final Stage stage) throws Exception
   {
      Group rootGroup = new Group();
      Scene scene =new Scene(rootGroup, 800, 400);
 
      Text text1 = new Text(25, 25, "o2fo.com");
      text1.setFill(Color.CHOCOLATE);
      text1.setFont(Font.font(java.awt.Font.MONOSPACED, 35));
      
      final Light.Distant light = new Light.Distant();
      light.setAzimuth(-135.0);
      final Lighting lighting = new Lighting();
      lighting.setLight(light);
      lighting.setSurfaceScale(9.0);
      text1.setEffect(lighting);

      
      
      rootGroup.getChildren().add(text1);

      stage.setScene(scene);
      stage.show();
   }
   public static void main(final String[] arguments)
   {
      Application.launch(arguments);
   }
}

上面的代碼生成以下結(jié)果。

發(fā)光的文本

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.Effect;
import javafx.scene.effect.Glow;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application
{
   @Override
   public void start(final Stage stage) throws Exception
   {
      Group rootGroup = new Group();
      Scene scene =new Scene(rootGroup, 800, 400);
 
      Text text1 = new Text(25, 25, "o2fo.com");
      text1.setFill(Color.CHOCOLATE);
      text1.setFont(Font.font(java.awt.Font.MONOSPACED, 35));
      
      Effect glow = new Glow(1.0);
      text1.setEffect(glow);
      
      rootGroup.getChildren().add(text1);

      stage.setScene(scene);
      stage.show();
   }
   public static void main(final String[] arguments)
   {
      Application.launch(arguments);
   }
}

上面的代碼生成以下結(jié)果。

透視效果

透視效果從二維對(duì)象產(chǎn)生三維效果。

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.effect.PerspectiveTransform;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {

  @Override
  public void start(Stage stage) {
    Group root = new Group();
    Scene scene = new Scene(root, 260, 80);
    stage.setScene(scene);

    
    Group g = new Group();
    PerspectiveTransform pt = new PerspectiveTransform();
    pt.setUlx(10.0);
    pt.setUly(10.0);
    pt.setUrx(310.0);
    pt.setUry(40.0);
    pt.setLrx(310.0);
    pt.setLry(60.0);
    pt.setLlx(10.0);
    pt.setLly(90.0);

    g.setEffect(pt);
    g.setCache(true);

    Rectangle r = new Rectangle();
    r.setX(10.0);
    r.setY(10.0);
    r.setWidth(280.0);
    r.setHeight(80.0);
    r.setFill(Color.BLUE);

    Text t = new Text();
    t.setX(20.0);
    t.setY(65.0);
    t.setText("JavaFX");
    t.setFill(Color.YELLOW);
    t.setFont(Font.font(null, FontWeight.BOLD, 36));

    g.getChildren().add(r);
    g.getChildren().add(t);
    
    scene.setRoot(g);
    stage.show();
  }

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

上面的代碼生成以下結(jié)果。

創(chuàng)建效果鏈

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.effect.DropShadow;
import javafx.scene.effect.Reflection;
import javafx.scene.layout.HBox;
import javafx.scene.paint.Color;
import javafx.scene.text.Font;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Main extends Application {
  public static void main(String[] args) throws Exception {
    launch(args);
  }
  @Override
  public void start(final Stage stage) throws Exception {
    Text t = new Text();
    t.setX(20.0f);
    t.setY(80.0f);
    t.setText("o2fo.com");
    t.setFill(Color.RED);
    t.setFont(Font.font("Arial", FontWeight.BOLD, 60));
    
    DropShadow ds = new DropShadow();
    ds.setOffsetY(5.0);
    ds.setOffsetX(5.0);
    ds.setColor(Color.GRAY);
    
    Reflection reflection = new Reflection();

    ds.setInput(reflection);   
    
    t.setEffect(ds);

    t.setTranslateX(10);
    t.setTranslateY(150);

    HBox box = new HBox();
    box.getChildren().add(t);

    Scene scene = new Scene(box, 400, 450);
    stage.setScene(scene);
    stage.show();
  }
}

上面的代碼生成以下結(jié)果。

以上內(nèi)容是否對(duì)您有幫助：

← JavaFX 散點(diǎn)圖

JavaFX 過渡 →

寫筆記

我要補(bǔ)充

JavaFX 效果

JavaFX教程 - JavaFX效果

混合效果

BlendMode.MULTIPLY

模糊效果高斯模糊

BoxBlur效果

運(yùn)動(dòng)模糊

綻放效果

下降陰影效果

內(nèi)部陰影效果

反射

照明效果

發(fā)光的文本

透視效果

創(chuàng)建效果鏈

推薦文章

推薦教程

推薦課程