在JavaFX中制作视频（媒体）播放器会占用尽可能多的空间，但不会占用更多空间

我以前问过这个问题：关于让JavaFX媒体播放器扩展以填充父级。不幸的是，在视频周围有一个窗格的黑客将控制器推到远离视频的地方：

这里的颜色只是为了了解布局是如何运作的。视频播放器由以下FXML组成：

<VBox alignment="TOP_CENTER" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="-Infinity" minWidth="-Infinity" spacing="10.0" style="-fx-background-color: red;" HBox.hgrow="ALWAYS">
    <Pane fx:id="mediaViewPane" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="0.0"
          minWidth="0.0" VBox.vgrow="ALWAYS"  style="-fx-background-color: green;">
        <MediaView fx:id="tutorialPlayer" managed="false" />
    </Pane>
    <Slider fx:id="timeSlider" VBox.vgrow="NEVER">
        <VBox.margin>
            <Insets />
        </VBox.margin>
    </Slider>
    <HBox alignment="TOP_CENTER" spacing="10.0" style="-fx-background-color: magenta;" VBox.vgrow="SOMETIMES">
        <padding>
            <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
        </padding>
        <Button fx:id="playButton" minHeight="40.0" minWidth="40.0" mnemonicParsing="false" onAction="#play">
            <graphic>
                <FontIcon iconLiteral="fas-play" iconSize="25" />
            </graphic>
        </Button>
        <Button fx:id="pauseButton" managed="false" minHeight="40.0" minWidth="40.0" mnemonicParsing="false" onAction="#pause" visible="false">
            <graphic>
                <FontIcon iconLiteral="fas-pause" iconSize="25" />
            </graphic>
        </Button>
        <Button fx:id="restartButton" disable="true" minHeight="40.0" minWidth="40.0" mnemonicParsing="false" onAction="#restart">
            <graphic>
                <FontIcon iconLiteral="fas-retweet" iconSize="25" />
            </graphic>
        </Button>
        <Button fx:id="muteButton" minHeight="40.0" minWidth="40.0" mnemonicParsing="false" onAction="#mute">
            <graphic>
                <FontIcon iconLiteral="fas-volume-up" iconSize="25" />
            </graphic>
        </Button>
        <Button fx:id="unmuteButton" managed="false" minHeight="40.0" minWidth="40.0" mnemonicParsing="false" onAction="#unmute" visible="false">
            <graphic>
                <FontIcon iconLiteral="fas-volume-off" iconSize="25" />
            </graphic>
        </Button>
        <Slider fx:id="volumeSlider" blockIncrement="0.1" max="1.0" value="1.0" />
    </HBox>
    <HBox.margin>
        <Insets />
    </HBox.margin>
    <opaqueInsets>
        <Insets />
    </opaqueInsets>
    <padding>
        <Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />
    </padding>
</VBox>

---

您知道如何在尊重纵横比功能的同时，使其尽可能大且居中，但将视频的控制器保持在视频旁边吗？

您可能可以通过将控件和媒体视图包装到另一个窗格VBox中来实现当前的策略？，然后在设置媒体视图的fitHeight属性时减去控件的高度。然后只需配置该窗格，使其居中即可

不过，老实说，我尽量避免使用绑定和侦听器来管理布局。有时这是不可避免的，但一旦达到某个临界点，最好通过子类化窗格来定义自定义布局。我上面概述的策略超出了这个临界点，当然，根据我的判断，您的里程数可能会有所不同

因此，我将专门定义一个布局窗格来管理它。还不算太坏；只需覆盖各种ComputexWidth/Height方法和layoutChildren方法：

这将始终将内容放在媒体视图下方。如果您想使其更具可配置性和可恢复性，可以引入其他属性，如ObjectProperty

然后，您可以在Java中进行测试：

package mediaviewlayout;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Slider;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;
import javafx.scene.media.MediaView;
import javafx.stage.Stage;

public class MediaViewTest extends Application {

    private static final String MEDIA_URL = "http://download.oracle.com/otndocs/products/javafx/oow2010-2.flv";

    @Override
    public void start(Stage primaryStage) throws Exception {
        MediaView mediaView = new MediaView();
        mediaView.setPreserveRatio(true);

        MediaPlayer mediaPlayer = new MediaPlayer(new Media(MEDIA_URL));
        mediaPlayer.setAutoPlay(true);
        mediaView.setMediaPlayer(mediaPlayer);

        VBox controls = new VBox(5);
        controls.setAlignment(Pos.CENTER);
        Slider slider = new Slider();

        controls.getChildren().add(slider);

        Button play = new Button("Play");


        HBox buttons = new HBox(5, play, new Button("Restart"), new Button("Volume"), new Slider());
        buttons.setAlignment(Pos.TOP_CENTER);
        controls.getChildren().add(buttons);

        MediaViewLayout layout = new MediaViewLayout(mediaView, controls);

        Scene scene = new Scene(layout, 600, 600);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

或在FXML中：

与

FXML版本的屏幕截图：

---

添加FXML导入。我猜你在用第三方图书馆？我无法在SceneBuilder中加载它。是的，我正在使用ikonli。如果您删除按钮中的图像，它将工作。回家后我可以添加更多细节，但无论如何，这是你加载它的最快方式。像往常一样，@James\u D，绝对令人惊讶！

package mediaviewlayout;
import javafx.beans.NamedArg;
import javafx.geometry.Bounds;
import javafx.scene.Node;
import javafx.scene.layout.Pane;
import javafx.scene.media.MediaView;

public class MediaViewLayout extends Pane {

    private final MediaView mediaView ;
    private final Node content ;

    private static final double SPACING = 5 ; // can make this configurable if needed...

    public MediaViewLayout(
            @NamedArg("mediaView") MediaView mediaView,
            @NamedArg("content") Node content) {

        this.mediaView = mediaView ;
        this.content = content ;

        this.getChildren().addAll(mediaView, content);
    }

    @Override
    public double computeMinWidth(double height) {
        return Math.max(mediaView.minWidth(height), content.minWidth(height));
    }

    @Override
    public double computePrefWidth(double height) {
        return Math.max(mediaView.prefWidth(height), content.prefWidth(height));
    }

    @Override
    public double computeMaxWidth(double height) {
        return Math.min(mediaView.maxWidth(height), content.maxWidth(height));
    }

    @Override
    public double computeMinHeight(double width) {
        return mediaView.minHeight(width) + content.minHeight(width) + SPACING ;
    }

    @Override
    public double computePrefHeight(double width) {
        return mediaView.prefHeight(width) + content.prefHeight(width) + SPACING ;
    }

    @Override
    public double computeMaxHeight(double width) {
        return mediaView.maxHeight(width) + content.minHeight(width) + SPACING ;
    }

    @Override
    protected void layoutChildren() {
        double width = getWidth();
        double height = getHeight();
        double contentHeight = content.prefHeight(-1);
        double availableHeight = height - SPACING - contentHeight ;
        mediaView.setFitWidth(width);
        mediaView.setFitHeight(availableHeight);
        Bounds actualMediaBounds = mediaView.getBoundsInLocal();
        double totalUsedHeight = actualMediaBounds.getHeight() + SPACING + contentHeight ;

        double mediaX = (width - actualMediaBounds.getWidth()) / 2 ;
        double mediaY = (height - totalUsedHeight) / 2;
        mediaView.relocate(mediaX, mediaY);

        content.resizeRelocate(0, mediaY+actualMediaBounds.getHeight()+SPACING, width, contentHeight);

    }
}

package mediaviewlayout;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Slider;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;
import javafx.scene.media.MediaView;
import javafx.stage.Stage;

public class MediaViewTest extends Application {

    private static final String MEDIA_URL = "http://download.oracle.com/otndocs/products/javafx/oow2010-2.flv";

    @Override
    public void start(Stage primaryStage) throws Exception {
        MediaView mediaView = new MediaView();
        mediaView.setPreserveRatio(true);

        MediaPlayer mediaPlayer = new MediaPlayer(new Media(MEDIA_URL));
        mediaPlayer.setAutoPlay(true);
        mediaView.setMediaPlayer(mediaPlayer);

        VBox controls = new VBox(5);
        controls.setAlignment(Pos.CENTER);
        Slider slider = new Slider();

        controls.getChildren().add(slider);

        Button play = new Button("Play");


        HBox buttons = new HBox(5, play, new Button("Restart"), new Button("Volume"), new Slider());
        buttons.setAlignment(Pos.TOP_CENTER);
        controls.getChildren().add(buttons);

        MediaViewLayout layout = new MediaViewLayout(mediaView, controls);

        Scene scene = new Scene(layout, 600, 600);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

package mediaviewlayout;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class MediaViewTest extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {

        MediaViewLayout layout = FXMLLoader.load(getClass().getResource("MediaViewLayoutTest.fxml"));

        Scene scene = new Scene(layout, 600, 600);
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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