javafx-2 – JavaFX全屏 – 基于屏幕大小调整元素大小

有没有办法使全屏(如果可能调整大小),而不是重新排列所有的东西(实际上它是重新排列元素,如调整大小,但整个屏幕),以实现全屏幕模式？ (如通常所做的游戏,改变屏幕分辨率),以便按钮和文本相应地增加到屏幕/窗口的大小

还如何删除消息和效果点击“esc”键退出全屏模式？

编辑：用这种方法来调整大小

@Override public void start(Stage stage) throws Exception{
    final int initWidth = 720;      //initial width
    final int initHeight = 1080;    //initial height
    final Pane root = new Pane();   //necessary evil

    Pane controller = new CtrlMainMenu();   //initial view
    controller.setPrefWidth(initWidth);     //if not initialized
    controller.setPrefheight(initHeight);   //if not initialized
    root.getChildren().add(controller);     //necessary evil

    Scale scale = new Scale(1,1,0);
    scale.xproperty().bind(root.widthproperty().divide(initWidth));     //must match with the one in the controller
    scale.yproperty().bind(root.heightproperty().divide(initHeight));   //must match with the one in the controller
    root.getTransforms().add(scale);

    final Scene scene = new Scene(root,initWidth,initHeight);
    stage.setScene(scene);
    stage.setResizable(true);
    stage.show();

    //add listener for the use of scene.setRoot()
    scene.rootproperty().addListener(new changelistener<Parent>(){
        @Override public void changed(ObservableValue<? extends Parent> arg0,Parent oldValue,Parent newValue){
            scene.rootproperty().removeListener(this);
            scene.setRoot(root);
            ((Region)newValue).setPrefWidth(initWidth);     //make sure is a Region!
            ((Region)newValue).setPrefheight(initHeight);   //make sure is a Region!
            root.getChildren().clear();
            root.getChildren().add(newValue);
            scene.rootproperty().addListener(this);
        }
    });
}

解决方法

有几种方法来调整UI的大小.

按字体大小缩放

您可以通过在场景样式表的.root中设置-fx-font-size来缩放所有控件.

例如,如果您将以下样式表应用于场景,则所有控件的大小将增加一倍(因为默认字体大小为13px).

.根 {
-fx-font-size：26px;
}

以上的工作是缩放控件,这对于完全基于控制的东西而言是不错的,但对于基于图形和形状的东西来说并不是那么好.

按变换缩放

应用一个在(0,0)摆动的Scale变换到你的场景的根节点.

Scale scale = new Scale(scaleFactor,scaleFactor);
scale.setPivotX(0);
scale.setPivotY(0);
scene.getRoot().getTransforms().setAll(scale);

为了扩展我开发的包含图形和各种形状的游戏,我使用了一个信号拳击技术,将游戏窗口的大小设置为恒定的长宽比(类似于当您在16号电视上观看4：3电视节目时看到的信箱拳击：9屏).

以下代码中的Scenesizechangelistener监听场景大小的更改,并将场景的内容缩放到可用的场景大小.

import javafx.application.Application;
import javafx.beans.value.changelistener;
import javafx.beans.value.ObservableValue;
import javafx.fxml.FXMLLoader;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.transform.Scale;
import javafx.stage.Stage;
import org.jewelsea.games.supersnake.layout.LayoutController;

import java.io.IOException;
import java.util.ResourceBundle;

/* Main JavaFX application class */
public class SuperSnake extends Application {
  public static void main(String[] args) { launch(args); }

  @Override public void start(final Stage stage) throws IOException {
    FXMLLoader loader = new FXMLLoader(
        getClass().getResource("layout/layout.fxml"),ResourceBundle.getBundle("org.jewelsea.games.supersnake.layout.text")
    );
    Pane root = (Pane) loader.load();

    GameManager.instance().setLayoutController(loader.<LayoutController>getController());

    Scene scene = new Scene(new Group(root));
    stage.setScene(scene);
    stage.show();

    GameManager.instance().showMenu();

    letterBox(scene,root);
    stage.setFullScreen(true);
  }

  private void letterBox(final Scene scene,final Pane contentPane) {
    final double initWidth  = scene.getWidth();
    final double initHeight = scene.getHeight();
    final double ratio      = initWidth / initHeight;

    Scenesizechangelistener sizeListener = new Scenesizechangelistener(scene,ratio,initHeight,contentPane);
    scene.widthproperty().addListener(sizeListener);
    scene.heightproperty().addListener(sizeListener);
  }

  private static class Scenesizechangelistener implements changelistener<Number> {
    private final Scene scene;
    private final double ratio;
    private final double initHeight;
    private final double initWidth;
    private final Pane contentPane;

    public Scenesizechangelistener(Scene scene,double ratio,double initHeight,double initWidth,Pane contentPane) {
      this.scene = scene;
      this.ratio = ratio;
      this.initHeight = initHeight;
      this.initWidth = initWidth;
      this.contentPane = contentPane;
    }

    @Override
    public void changed(ObservableValue<? extends Number> observableValue,Number oldValue,Number newValue) {
      final double newWidth  = scene.getWidth();
      final double newHeight = scene.getHeight();

      double scaleFactor =
          newWidth / newHeight > ratio
              ? newHeight / initHeight
              : newWidth / initWidth;

      if (scaleFactor >= 1) {
        Scale scale = new Scale(scaleFactor,scaleFactor);
        scale.setPivotX(0);
        scale.setPivotY(0);
        scene.getRoot().getTransforms().setAll(scale);

        contentPane.setPrefWidth (newWidth  / scaleFactor);
        contentPane.setPrefheight(newHeight / scaleFactor);
      } else {
        contentPane.setPrefWidth (Math.max(initWidth,newWidth));
        contentPane.setPrefheight(Math.max(initHeight,newHeight));
      }
    }
  }
}

这是一个屏幕截图,您可以看到信箱和缩放效果.中间的绿草是主要的游戏内容屏幕,可以上下缩放以适应可用的屏幕区域.外面的木质纹理提供了一个灵活的大小的边框,填充黑色信箱通常是在你的屏幕上以不同的宽高比观看电视节目的地方.请注意,下面的屏幕截图背景在标题页面是模糊的,因为我这样做,当游戏开始时,模糊效果被删除,视图清晰无论大小.

窗口版本：

缩放全屏版本：

你可能会认为上面的缩放方法可能会使所有的东西都变成块状和像素化,但是它并没有.所有字体和控件均匀平滑.所有标准绘图和图形命令和基于css的样式都可以顺利平滑,因为它们都是基于矢量的.即使是位图图像也很好,因为JavaFX在缩放图像时使用相当高质量的过滤器.

获得良好的图像缩放的一个技巧是提供高分辨率的图像,这样当屏幕扩大时,JavaFX系统就有更多的原始数据可以工作.例如,如果应用程序的首选窗口大小是屏幕尺寸的四分之一,它包含64×64图标,而是使用128×128图标,这样当应用程序放在全屏和所有元素缩放时,缩放器有更多的原始用于内插值的像素数据样本.

缩放也是硬件加速的速度.

how can I remove the message and the effect on click the “esc” key to exit the fullscreen mode?

在JavaFX 2.2中删除全屏退出消息是不可能的,JavaFX 8中将有可能：

RT-15314 Allow trusted apps to disable the fullscreen overlay warning and disable the “Exit on ESC” behavior

这将是很好的,因为那时我的游戏将不会有“看着我 – 我看起来像一个测试版”的感觉.

javafx-2 – JavaFX全屏 – 基于屏幕大小调整元素大小

解决方法

相关文章