如何在javafx中将图像堆叠到现有背景上
以下是我尝试过的方法。我尝试使用imageView,将图像设置为它并将其添加到stackpane。图像变得相当大,看起来不像我希望主菜单的样子。当我最大化屏幕时,背景色在那里,但logo图标最初占据了整个屏幕。然后我决定去掉它,使用一个styleclass并将其添加到我的stackpane中,但它似乎没有注册我添加到stackpane中的styleclass。因为这是一个简单的例子,所以您可以试用该程序,看看您得到了什么 这是相关代码如何在javafx中将图像堆叠到现有背景上,java,css,javafx,background-image,Java,Css,Javafx,Background Image,以下是我尝试过的方法。我尝试使用imageView,将图像设置为它并将其添加到stackpane。图像变得相当大,看起来不像我希望主菜单的样子。当我最大化屏幕时,背景色在那里,但logo图标最初占据了整个屏幕。然后我决定去掉它,使用一个styleclass并将其添加到我的stackpane中,但它似乎没有注册我添加到stackpane中的styleclass。因为这是一个简单的例子,所以您可以试用该程序,看看您得到了什么 这是相关代码 package whowantstobeamillionai
package whowantstobeamillionairetriviagame;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.layout.Background;
import javafx.scene.layout.BackgroundImage;
import javafx.scene.layout.BackgroundPosition;
import javafx.scene.layout.BackgroundRepeat;
import javafx.scene.layout.BackgroundSize;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class WhoWantsToBeAMillionaireTriviaGame extends Application
{
@Override
public void start(Stage startingStage) throws Exception
{
Image backgroundColor = new Image("http://1.bp.blogspot.com/-p0s06MBIx_U/T8zKIBZ24pI/AAAAAAAAA7Y/n8hMZfpRic0/s1600/dark+blue+wallpaper+10.jpg");
BackgroundSize backgroundSize = new BackgroundSize(100, 100, true, true, true, true);
BackgroundImage backgroundImage = new BackgroundImage(backgroundColor, BackgroundRepeat.NO_REPEAT,
BackgroundRepeat.NO_REPEAT, BackgroundPosition.CENTER, backgroundSize);
StackPane background = new StackPane();
background.setBackground(new Background(backgroundImage));
background.getStyleClass().add("MillionaireLogo");
Scene backgroundScene = new Scene(background);
startingStage.setScene(backgroundScene);
startingStage.show();
}
public static void main(String[] args)
{
launch(args);
}
}
logo.css文件
.MillionaireLogo
{
-fx-background-image: url("http://3.bp.blogspot.com/-ujgaiwveDzc/TZQeK9gZvPI/AAAAAAAAADY/ZNVAxlaqXoY/s1600/Millionaire%2BParody%2BLogo2%2Bcopy.jpg");
-fx-background-repeat: no-repeat;
-fx-background-position: top center;
-fx-background-size: cover;
}
这是一个解决方案,它解决了我的主要问题,将图像叠加到背景上
package whowantstobeamillionairetriviagame;
import java.io.File;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class WhoWantsToBeAMillionaireTriviaGame extends Application
{
@Override
public void start(Stage startingStage) throws Exception
{
StackPane backgroundSettings = new StackPane();
Image backgroundColor = new Image("http://1.bp.blogspot.com/-p0s06MBIx_U/T8zKIBZ24pI/AAAAAAAAA7Y/n8hMZfpRic0/s1600/dark+blue+wallpaper+10.jpg");
ImageView background = new ImageView();
background.setImage(backgroundColor);
Image millionaireLogo = new Image(new File("MillionaireLogo.PNG").toURI().toString());
ImageView logoPicture = new ImageView();
logoPicture.setImage(millionaireLogo);
logoPicture.setPreserveRatio(true);
logoPicture.setSmooth(true);
logoPicture.setCache(true);
StackPane.setAlignment(logoPicture, Pos.TOP_CENTER);
backgroundSettings.getChildren().addAll(background, logoPicture);
Scene backgroundScene = new Scene(backgroundSettings);
startingStage.setScene(backgroundScene);
startingStage.setTitle("Who Wants to be a Millionaire");
startingStage.show();
}
public static void main(String[] args)
{
launch(args);
}
}
我现在的新问题是如何缩小图像的大小给定我拥有的代码并将其放置在屏幕的顶部中心?哦,我去掉了CSS文件。另外,如何删除图像周围的空白?好的,我可以使用这行代码StackPane.setAlignmentlogoPicture将图像居中放置到顶部中心,位置:顶部中心;现在我需要做的就是将图像调整到合适的大小,去掉空白。我已经让程序看起来几乎完美了。剩下要做的就是删除这些空白。有什么想法吗?如果你有新问题,请提出新问题。