I have a stationary image and would like to play various MP4 clips on top of this image with some level of transparency. are there any examples for this in Java. I attempted JavaFX and can play the video but I need the image to be present (visible) at all times then I would like to play the video clips on top of the image. any suggestions/examples? I have code from an example but it only plays the video. I need to start with a still image then play the video on top with some transparency:
enter code here
public static void main(String[] args) throws Exception{
launch(args);
}
#Override
public void start(Stage stage) throws Exception {
//goes to user Directory
File f = new File("c:\\tpd\\video.mp4");
Image background = new Image(new
FileInputStream("c:\\tpd\\Image.jpg"));
//Converts media to string URL
Media media = new Media(f.toURI().toURL().toString());
player = new javafx.scene.media.MediaPlayer(media);
MediaView viewer = new MediaView(player);
//change width and height to fit video
DoubleProperty width = viewer.fitWidthProperty();
DoubleProperty height = viewer.fitHeightProperty();
width.bind(Bindings.selectDouble(viewer.sceneProperty(), "width"));
height.bind(Bindings.selectDouble(viewer.sceneProperty(), "height"));
viewer.setPreserveRatio(true);
ImageView foreground = new ImageView(background);
viewer.setOpacity(.6f);
StackPane root = new StackPane();
root.getChildren().addAll(foreground,viewer);
Scene scene = new Scene(root,1920, 1080, Color.BLACK);
stage.setAlwaysOnTop(true);
stage.setScene(scene);
stage.setTitle("myVideo");
stage.show();
player.play();
}
Related
I'm trying to put an image as a background in a JavaFX scene, but my code isn't working.
Im trying to make a Battleship-game program in java eclipse but i'm stuck at a graphics problem.
public class WindowGUI extends Application{
Game game;
Image image;
public WindowGUI(Game game) {
this.game = game;
}
public static void main(String[] args) {
Game game = new Game();
new WindowGUI(game);
}
#Override
public void start(Stage stage) throws Exception {
stage.setTitle("Battleship");
image = new Image ("C:\\Users\\amali\\git\\inf101.v19.sem2\\inf101.v19.sem2\\src\\window\\battleshipbackground.jpg");
ImageView background = new ImageView(image);
Button startButton = new Button("START");
BorderPane newStack = new BorderPane();
newStack.getChildren().add(startButton);
newStack.getChildren().add(background);
stage.setScene(new Scene(newStack, 1300, 860));
stage.show();
startButton.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
// START THE GAME
}
});
}
}
When I first tried to run it, it worked and a new window opened with a button in the center, but the bakcground was blank. When i try setting an image as background in the window, behing the 'start'-button, nothing happens..
A better way to do it is to use the Background class rather than trying to add an ImageView as a child of your BorderPane.
Image image = new Image("C:\\Users\\amali\\git\\inf101.v19.sem2\\inf101.v19.sem2\\src\\window\\battleshipbackground.jpg");
BackgroundSize size = new BackgroundSize(BackgroundSize.AUTO,
BackgroundSize.AUTO,
false,
false,
true,
false);
Background background = new Background(new BackgroundImage(image,
BackgroundRepeat.NO_REPEAT,
BackgroundRepeat.NO_REPEAT,
BackgroundPosition.CENTER,
size));
newStack.setBackground(background);
Use BackgroundImage class.
or try this
JavaFX How to set scene background image
I'm trying to edit five images I have in a folder at once (using javafx motion blur), rather than select them one after the other. This is my code, I'm not exactly sure what I'm doing wrong but when I run it, only the last image in the folder gets edited. The others remain as they are.
public class IterateThrough extends Application {
private Desktop desktop = Desktop.getDesktop();
#Override
public void start(Stage primaryStage) throws IOException {
File dir = new File("filepath");
File [] directoryListing = dir.listFiles();
if (directoryListing != null) {
for (File file : directoryListing) {
if(file.getName().toLowerCase().endsWith(".jpeg")){
//desktop.open(file);
Image image = new Image(new FileInputStream(file));
//Setting the image view
ImageView imageView = new ImageView(image);
//setting the fit height and width of the image view
imageView.setFitHeight(600);
imageView.setFitWidth(500);
//Setting the preserve ratio of the image view
imageView.setPreserveRatio(true);
// instantiate Motion Blur class
MotionBlur motionBlur = new MotionBlur();
// set blur radius and blur angle
motionBlur.setRadius(15.0);
motionBlur.setAngle(110.0);
//set imageView effect
imageView.setEffect(motionBlur);
//Creating a Group object
Group root = new Group(imageView);
//Creating a scene object
Scene scene = new Scene(root, 600, 500);
//Setting title to the Stage
primaryStage.setTitle("Loading an image");
//Adding scene to the stage
primaryStage.setScene(scene);
//Displaying the contents of the stage
primaryStage.show();
}
}
}
}
public static void main(String[] args) {
launch(args);
}
}
first, you shouldn't just let the primaryStage show() in the for-each loop, because when the primaryStage first show(), the fx thread pause on that instruction, the remaining pictures will not be read and when you close the window, the loop won't continue to go on for remaining, it represents the end of the application.
so it's better to let the primaryStage show() outside the each-loop after all image has been read.
second, you shouldn't use the "Group" container to contains all images, better use VBox/HBox/FlowPane, make sure above image won't covers below's.
here's modified code for reference.
public class IterateThrough2 extends Application{
private Desktop desktop = Desktop.getDesktop();
#Override
public void start(Stage primaryStage) throws IOException{
File dir = new File("filepath");
File[] directoryListing = dir.listFiles();
FlowPane root = new FlowPane();
if(directoryListing != null){
for(File file : directoryListing){
if(file.getName().toLowerCase().endsWith(".jpeg")){
Image image = new Image(new FileInputStream(file));
ImageView imageView = new ImageView(image);
imageView.setFitHeight(600);
imageView.setFitWidth(500);
imageView.setPreserveRatio(true);
MotionBlur motionBlur = new MotionBlur();
motionBlur.setRadius(15.0);
motionBlur.setAngle(110.0);
imageView.setEffect(motionBlur);
root.getChildren().add(imageView);
}
}
}
Scene scene = new Scene(root, 600, 500);
primaryStage.setTitle("Loading an image");
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args){
launch(args);
}
}
I'm currently working on an app that will play a video using JavaFX. I want to place the volume slider on the right side of the border pane. Currently, the app will resize to the size of the window, which will overlap with my volume slider.
I have a controller that takes care of all the actions performed by the app and implements the Initializable interface. Here's how my initialize() method looks like.
#Override
public void initialize(URL locate, ResourceBundle resources){
String path = new File("src/media/dance.mp4").getAbsolutePath();
media = new Media (new File (path).toURI().toString());
player = new MediaPlayer(media);
mediaView.setMediaPlayer(player);
DoubleProperty width = mediaView.fitWidthProperty();
DoubleProperty height = mediaView.fitHeightProperty();
width.bind(Bindings.selectDouble(mediaView.sceneProperty(), "width"));
height.bind(Bindings.selectDouble(mediaView.sceneProperty(), "height"));
volumeSlider.setValue(player.getVolume() * 100);
volumeSlider.valueProperty().addListener(new InvalidationListener() {
#Override
public void invalidated(Observable observable) {
player.setVolume(volumeSlider.getValue() / 100);
}
});
}
I tried to subtract 64px directly after mediaView.fitWidthProperty() and mediaView.sceneProperty(), but both gave me an error because they are not of type double. I tried mediaView.fitWidthProperty().subtract(64), but it said I would need to change the data type from DoubleProperty to DoubleBind, which would not be compatible with Bindings.selectDouble() method that requires a DoubleProperty.
How can I get this to work?
EDITED
There is an easier way! Just bind to the property directly:
mediaView.fitWidthProperty().bind(
mediaView.getScene().widthProperty().subtract(64));
Here is a full app to demonstrate:
public class FXWidthBind extends Application {
#Override
public void start(Stage stage) {
Media media = new Media("http://i.imgur.com/OJTwZuc.mp4");
MediaPlayer player = new MediaPlayer(media);
MediaView mediaView = new MediaView(player);
Pane root = new Pane();
Scene scene = new Scene(root);
root.getChildren().add(mediaView);
stage.setWidth(1000);
stage.setHeight(800);
stage.setScene(scene);
stage.show();
mediaView.fitWidthProperty().bind(mediaView.getScene().widthProperty().subtract(64));
mediaView.fitHeightProperty().bind(mediaView.getScene().heightProperty());
}
public static void main(String[] args) {
launch(args);
}
}
The solution is to subtract the width property of your SceneProperty (video screen).
width.bind(Bindings.selectDouble(mediaView.sceneProperty(), "width").subtract(64.0));
Here, I'm binding the width of my MediaView with the width of my SceneProperty minus 64 pixels. Since DoubleProperty is a wrapper around the primitive type double, you can use the subtract() method to modify the actual value underneath.
Before
After
So I've been running into an issue lately. Whenever I want to play a videofile with JavaFX MediaPlayer combined with MediaView the video seems to stutter all over the place. I tried different types of videofiles (I rendered most of them myself as .mp4 with h264 encoding) where framerates range from 30fps to 60fps, the bitrate being 14.000.000 to 28.000.000 bps.
The lag also occurs with most files that I haven't rendered myself, so I'm quite sure that there is nothing wrong with my renderings.
edit
Further testing confirmed that it does not matter that I rendered the videofiles myself.
Do you guys know why this videostutter might be occuring and how to fix it? I'm open to any type of fixes, including using different ways of displaying the videofiles other than through JavaFX. Here is the main code of the videoplayer:
public class VideoPlayer extends JPanel implements Checkable
{
private MediaView view;
public JFXPanel pane;
private String path;
public MediaPlayer player;
private Dimension size;
public VideoPlayer(String path, Dimension size)
{
this.size = size;
this.path = path;
pane = new JFXPanel();
player = new MediaPlayer(new Media(path));
Platform.runLater(new Runnable() {
#Override
public void run() {
initFX(pane);
}
});
pane.setPreferredSize(size);
pane.setSize(size);
pane.setLocation(0,0);
add(pane);
}
public void initFX(JFXPanel fxPanel) {
Scene scene = createScene();
pane.setScene(scene);
}
private Scene createScene()
{
view = new MediaView();
view.setMediaPlayer(player);
Group root = new Group();
view.setPreserveRatio(true);
view.setFitWidth(size.width);
view.setSmooth(false);
root.getChildren().add(view);
Scene scene = null;
try{
scene = new Scene(root, size.width, size.height)
;}catch(Exception e){System.out.println(e);}
return scene;
}
public void play()
{
player.play();
}
}
Here, the videoplayer receives a String with the path to the videofile, the Dimension size is the size the player should be.
The class itself extends JPanel so that it can be added to a JFrame. This JPanel contains a JFXPanel which in its turn contains the MediaView.
If you guys can figgure out why the video is getting stutter it would be amazing. I'm open to all solutions!
Thanks for the help in advance!
Edits
As suggested by #AlmasB I made a bare-bone pure JavaFX application to play the exact same files. It might have reduced stutter by a tiny amount, but perhaps not at all. It was very hard to see wether it was better or not. Here is the code of the bare-bones JavaFX videoplayer:
public class VideoPlayerTest extends Application {
static MediaView view;
static MediaPlayer player;
#Override
public void start(Stage primaryStage) {
Button btn = new Button();
btn.setText("Say 'Hello World'");
btn.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
System.out.println("Hello World!");
}
});
StackPane root = new StackPane();
//root.getChildren().add(btn);
makeMediaView();
root.getChildren().add(view);
player.play();
Scene scene = new Scene(root, 1920, 1080);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}
private static void makeMediaView(){
player = new MediaPlayer(new Media("file:///C:/Users/wesse/Documents/CowLite%20GabenQuest/resources/cutscenes/gabenquestepisode1intro.mp4.old"));
view = new MediaView(player);
view.setPreserveRatio(true);
view.setFitWidth(1920);
}
public static void main(String[] args) {
launch(args);
}
}
As suggested by #AlmasB some info:
System info
Windows 10
Latest JDK version (1.8)
gtx960, intel i5 3470, 8gb RAM
video tests
1080p 60fps 28mbit/s stutter
1080p 30fps 14mbit/s stutter
720p 29fps 1.8mbit/s no stutter, but poor video quality due to low bitrate/resolution, downloaded from YT
1080p 60fps 5.3mbit/s very slight stutter, decent video quality, downloaded from YT
1080p 60fps 6.3mbit/s medium stutter, perfect quality, self rendered
I'm rendering some videos myself now with lower bitrate to see if this is the problem.
I recently found javafx 2.1 very useful for my project of making a video player but after a
success I faced a problem with the video size Dimensions. In other words, when I run the
program and video is playing normally I can't see the whole video because it's dimensions
are bigger than my screen resolution .What Can I do in the following code to resize the actual size of video in windows7 64bit:
public class HelloFx extends Application {
public static void main(String[] args){
launch(args);
}
#Override
public void start(final Stage stage) throws Exception {
stage.setTitle("Movie Player");
final BorderPane root = new BorderPane();
final Media media = new Media("file:///Users//user//Videos//Sintel.mp4");
final MediaPlayer player = new MediaPlayer(media);
final MediaView view = new MediaView(player);
// System.out.println("media.width: "+media.getWidth());
root.getChildren().add(view);
final Scene scene = new Scene(root, 400, 400, Color.BLACK);
stage.setScene(scene);
stage.show();
player.play();
player.setOnReady(new Runnable() {
#Override
public void run() {
int w = player.getMedia().getWidth();
int h = player.getMedia().getHeight();
stage.setMinWidth(w);
stage.setMinHeight(h);
}
});
//player.play();
}
}
The JavaFX 2 MediaView class has 2 functions which can help. They are .setFitHeight() and .setFitWidth() .
So, you could, instead of letting the media dictate the size of screen, let your stage set the size of the screen...
public void run() {
int w = stage.getWidth(); // player.getMedia().getWidth();
int h = stage.getHeight(); // player.getMedia().getHeight();
// stage.setMinWidth(w);
// stage.setMinHeight(h);
// make the video conform to the size of the stage now...
player.setFitWidth(w);
player.setFitHeight(h);
}
Then the video should fit inside of the stage. That above code is pretty crude, and you may want to "Scale" the video better, ie: find the ratio of the media width VS the stage width & media height VS stage height ... But that code above should get you started.