首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何为视频播放器中的按钮留下底部空间(JavaFX)?

如何为视频播放器中的按钮留下底部空间(JavaFX)?
EN

Stack Overflow用户
提问于 2018-07-24 05:57:52
回答 1查看 0关注 0票数 0

是否可以在视频播放器底部为按钮留出空间,当它全屏时,按钮就会出现在视频上面,如何解决呢?

代码语言:txt
复制
public class VideoTest extends Application implements EventHandler<ActionEvent> {
  Button play;
  Button pause;
  StackPane root = new StackPane();
  VBox tempVid = new VBox();

  MediaPlayer player = new MediaPlayer( new Media(getClass().getResource("movie.mp4").toExternalForm()));
  MediaView mediaView = new MediaView(player);

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

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


    StackPane root = new StackPane();
    tempVid.getChildren().add(mediaView);

    root.getChildren().add( mediaView);
    Scene scene = new Scene(root, 700, 600);
    play = new Button (">");
    play.setOnAction(this);
    play.setTranslateX(-150);
    play.setTranslateY(300); 
    root.getChildren().add(play);
    pause = new Button ("| |");
    pause.setOnAction(this);
    pause.setTranslateX(-120);
    pause.setTranslateY(300); 
    root.getChildren().add(pause);

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

    final Label betLabel = new Label(" ");

    final Slider betSlider = new Slider();
    betSlider.setTranslateX(0);
    betSlider.setTranslateY(350); 
    betSlider.valueProperty().addListener(new ChangeListener() {

      @Override
      public void changed(ObservableValue arg0, Object arg1, Object arg2) {
        betLabel.textProperty().setValue(
                                         String.valueOf((int) betSlider.getValue()));
        betLabel.setTranslateX(-200);
        betLabel.setTranslateY(280); 
      }
    });

    root.getChildren().addAll(betSlider, betLabel);
    // betLabel.textProperty().setValue("0");
    primaryStage.setTitle("Video Player");
    primaryStage.setScene(scene);
    primaryStage.show();   
  }
  @Override
  public void handle(ActionEvent event){
    if(event.getSource() == play){

      DoubleProperty width = mediaView.fitWidthProperty();
      DoubleProperty hight = mediaView. fitHeightProperty();

      width.bind(Bindings.selectDouble(mediaView.sceneProperty(), "width"));
      hight.bind(Bindings.selectDouble(mediaView.sceneProperty(), "hight"));
      player.play();
    }

    else if(event.getSource() == pause){

      DoubleProperty width = mediaView.fitWidthProperty();
      DoubleProperty hight = mediaView. fitHeightProperty();

      width.bind(Bindings.selectDouble(mediaView.sceneProperty(), "width"));
      hight.bind(Bindings.selectDouble(mediaView.sceneProperty(), "hight"));
      player.pause();
    }
  }
}
EN

回答 1

Stack Overflow用户

发布于 2018-07-24 15:14:56

首先,使用StackPane布局控件是不合理的,当失去定位时,窗口会被调整,化简后的代码:

代码语言:txt
复制
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
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;

// Removed implementation of EventHandler as it's not needed
public class VideoTest extends Application {

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

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

        // Create the overall container that will hold everything else
        VBox rootPane = new VBox(5);        // Separates all children by 5px
        rootPane.setAlignment(Pos.CENTER);
        rootPane.setPadding(new Insets(5)); // Adds 5px padding around the window
        rootPane.setStyle("-fx-background-color: black");

        // Create the control buttons
        Button btnPlay = new Button(">");
        Button btnPause = new Button("||");

        // Create the container for the video itself
        VBox paneVideo = new VBox();

        // Create the media player and media player view
        MediaPlayer player = new MediaPlayer(
                new Media(getClass().getResource("movie.mp4").toExternalForm())
        );
        MediaView mediaView = new MediaView(player);

        // Bind the player to the bounds of the window; there is no need to do this in a separate method
        mediaView.fitWidthProperty().bind(primaryStage.widthProperty());
        mediaView.fitHeightProperty().bind(primaryStage.heightProperty());

        // Add the media player to the video pane
        paneVideo.getChildren().add(mediaView);

        // Setup the actions for the buttons. These should point to their own methods instead of
        // trying to determine which button was clicked later.
        btnPlay.setOnAction(e -> player.play());
        btnPause.setOnAction(e -> player.pause());

        // Create the HBox to hold the buttons
        HBox paneControlButtons = new HBox(10);
        paneControlButtons.setAlignment(Pos.CENTER);    // Centers the buttons in the scene
        paneControlButtons.setPadding(new Insets(5));

        // Add the buttons to their container
        paneControlButtons.getChildren().addAll(btnPlay, btnPause);

        // Add the buttons pane to the video pane so they appear when in fullscreen as well
        paneVideo.getChildren().add(paneControlButtons);

        // Add all the elements to the layout
        rootPane.getChildren().addAll(
                paneVideo
        );

        // Build the scene
        Scene scene = new Scene(rootPane, 700, 600);

        // Assemble the stage and show it
        primaryStage.setScene(scene);
        primaryStage.setFullScreen(true);   // Starts the player in fullscreen mode
        primaryStage.show();

        // I am omitting the slider for this example and also removing your second call to show
        // the primaryStage.
    }

}

如果希望控制按钮是暗的,下面是创建按钮的替代方法:

代码语言:txt
复制
// Create the control buttons
        Button btnPlay = new Button(">");
        btnPlay.setStyle("-fx-opacity: 0.4");
        Button btnPause = new Button("||");
        btnPause.setStyle("-fx-opacity: 0.4");

        // Style the buttons to be dim until moused over
        btnPlay.setOnMouseEntered(mouseEvent -> btnPlay.setStyle("-fx-opacity: 1.0"));
        btnPlay.setOnMouseExited(mouseEvent -> btnPlay.setStyle("-fx-opacity: 0.4"));
        btnPause.setOnMouseEntered(mouseEvent -> btnPause.setStyle("-fx-opacity: 1.0"));
        btnPause.setOnMouseExited(mouseEvent -> btnPause.setStyle("-fx-opacity: 0.4"));
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/-100005675

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档