我正在谈论的事件方法是changeBackgroundScreen。该按钮被我的一个css文件中的背景图像覆盖。起初我以为是阻止按钮与之交互的背景。我把背景图片关了,它仍然无法工作。现在我不知道了。
以下是FXML文件的一部分供您关注:
<HBox alignment="CENTER" spacing="200">
<children>
<Button fx:id="optionButton1" onAction="#changeBackgroundScreen" prefWidth="80" prefHeight="50" id="SmallBlueBackground1"/>
<Button fx:id="optionButton2" onAction="#changeBackgroundScreen" prefWidth="80" prefHeight="50" id="SmallBlueBackground2"/>
<Button fx:id="optionButton3" onAction="#changeBackgroundScreen" prefWidth="80" prefHeight="50" id="SmallBlueBackground3"/>
</children>
</HBox>
如果您有兴趣,以下是整个FXML文件:
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.image.*?>
<?import java.net.URL?>
<StackPane fx:id="Optionmenu" id="BlueBackground1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="millionairetriviagame.OptionscreenController">
<stylesheets>
<URL value="@BackgroundImages.css" />
</stylesheets>
<stylesheets>
<URL value="@ButtonLayout.css"/>
</stylesheets>
<children>
<VBox alignment="TOP_CENTER" spacing="20">
<ImageView>
<image>
<Image url="@ImageFiles/MillionaireLogo1.png"/>
</image>
</ImageView>
<Label text="Click to Change the Background Color" style="-fx-font-style: Italic;" textFill="white">
<font>
<javafx.scene.text.Font name="sans-serif" size="20" />
</font>
</Label>
<HBox alignment="CENTER" spacing="200">
<children>
<Button fx:id="optionButton1" onAction="#changeBackgroundScreen" prefWidth="80" prefHeight="50" id="SmallBlueBackground1"/>
<Button fx:id="optionButton2" onAction="#changeBackgroundScreen" prefWidth="80" prefHeight="50" id="SmallBlueBackground2"/>
<Button fx:id="optionButton3" onAction="#changeBackgroundScreen" prefWidth="80" prefHeight="50" id="SmallBlueBackground3"/>
</children>
</HBox>
</VBox>
<HBox alignment="BOTTOM_RIGHT" spacing="10" >
<children>
<Button fx:id="backToMain" prefWidth="200" prefHeight="30" onAction="#goToTheMainMenu" text="Back to the Main Menu" styleClass="ButtonLayout">
<shape>
<javafx.scene.shape.Rectangle width="200" height="30" arcHeight="30" arcWidth="30" />
</shape>
</Button>
</children>
</HBox>
</children>
</StackPane>
这是我的控制器类
package millionairetriviagame;
import java.io.IOException;
import java.net.URL;
import java.util.ResourceBundle;
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.SimpleBooleanProperty;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.FXMLLoader;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;
public class OptionscreenController implements Initializable, ControllingScreens
{
private ScreenNavigator controller;
private MediaPlayer optionMenuPlayer;
@FXML private Button backToMain;
private BooleanProperty isDisabled;
@FXML private StackPane Optionmenu;
@FXML private Button optionButton1;
@FXML private Button optionButton2;
@FXML private Button optionButton3;
@FXML private StackPane mainMenu;
@Override
public void initialize(URL url, ResourceBundle rb)
{
configureProperties();
playSong();
}
private void configureProperties()
{
isDisabled = new SimpleBooleanProperty();
backToMain.disableProperty().bind(isDisabled);
}
@Override
public void setScreenParent(ScreenNavigator parentScreen)
{
controller = parentScreen;
}
private void playSong()
{
Media optionIntroTheme = new Media(getClass().getResource("/millionairetriviagame/AudioFiles/OptionMenuMusic.mp3").toExternalForm());
optionMenuPlayer = new MediaPlayer(optionIntroTheme);
optionMenuPlayer.setAutoPlay(true);
optionMenuPlayer.setVolume(0.1);
optionMenuPlayer.setCycleCount(MediaPlayer.INDEFINITE);
}
@FXML private void changeBackgroundScreen(ActionEvent event)
{
try
{
FXMLLoader myLoader = new FXMLLoader(getClass().getResource(MillionaireTriviaGame.MAIN));
myLoader.load();
mainMenu = myLoader.getRoot();
}
catch (IOException ex)
{
Logger.getLogger(OptionscreenController.class.getName()).log(Level.SEVERE, null, ex);
}
if(optionButton2.isPressed())
{
mainMenu.setId("BlueBackground2");
Optionmenu.setId("BlueBackground2");
}
}
@FXML private void goToTheMainMenu(ActionEvent event)
{
isDisabled.setValue(true);
optionMenuPlayer.stop();
controller.loadScreen(MillionaireTriviaGame.MAINSCREENID, MillionaireTriviaGame.MAIN);
controller.setScreen(MillionaireTriviaGame.MAINSCREENID);
}
}
如果你需要查看它,这是我的CSS文件。
#BlueBackground1
{
-fx-background-image: url("/millionairetriviagame/ImageFiles/BlueBackgroundColor.jpg");
}
#BlueBackground2
{
-fx-background-image: url("/millionairetriviagame/ImageFiles/BlueBackgroundColor2.jpg");
}
#SmallBlueBackground1
{
-fx-background-image: url("/millionairetriviagame/ImageFiles/BlueBackgroundColor.jpg");
-fx-background-repeat: stretch;
-fx-background-size: 80 50;
-fx-background-position: center center;
-fx-background-insets: 0, 0, 0, 0;
}
#SmallBlueBackground2
{
-fx-background-image: url("/millionairetriviagame/ImageFiles/BlueBackgroundColor2.jpg");
-fx-background-repeat: stretch;
-fx-background-size: 80 50;
-fx-background-position: center center;
-fx-background-insets: 0, 0, 0, 0;
}
#SmallBlueBackground3
{
-fx-background-image: url("/millionairetriviagame/ImageFiles/BlueBackgroundColor3.jpg");
-fx-background-repeat: stretch;
-fx-background-size: 80 50;
-fx-background-position: center center;
-fx-background-insets: 0, 0, 0, 0;
}
这是一个视觉
答案 0 :(得分:2)
问题在于您的布局。你有一个StackPane
的VBox(包含触发changeBackgroundScreen
方法的按钮),最后你有HBox
(只有一个按钮,右下方对齐)。< / p>
乍一看,一切看起来都很酷。但是,请记住VBox
和HBox
是填充其父的布局。因此,即使您无法看到,HBox也会位于VBox的按钮顶部,阻止所有交互。
更复杂的解决方案是使用StackPane
之外的其他内容,因为我并不真正看到它的需要。但是,既然你已经有了布局,那么就去做一些需要对布局进行微调的东西。
一个非常简单的解决方案是将HBox
移到VBox
。这样,就没有阻塞层。但是,由于您希望按钮粘贴到场景的右下角,我们将在VBox的子节点之间使用Region
并设置VGrow as Always
。这将将新添加的HBox推送到场景的底部,无论你的场景大小如何,它都会粘在那里。
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import java.net.*?>
<?import javafx.scene.shape.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.image.*?>
<?import java.net.URL?>
<StackPane id="BlueBackground1" fx:id="Optionmenu" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.40" fx:controller="millionairetriviagame.OptionscreenController">
<stylesheets>
<URL value="@BackgroundImages.css" />
</stylesheets>
<stylesheets>
<URL value="@ButtonLayout.css" />
</stylesheets>
<children>
<VBox alignment="TOP_CENTER" spacing="20">
<ImageView>
<image>
<Image url="@ImageFiles/MillionaireLogo1.png" />
</image>
</ImageView>
<Label style="-fx-font-style: Italic;" text="Click to Change the Background Color" textFill="white">
<font>
<javafx.scene.text.Font name="sans-serif" size="20" />
</font>
</Label>
<HBox alignment="CENTER" spacing="200">
<children>
<Button id="SmallBlueBackground1" fx:id="optionButton1" onAction="#changeBackgroundScreen" prefHeight="50" prefWidth="80" />
<Button id="SmallBlueBackground2" fx:id="optionButton2" onAction="#changeBackgroundScreen" prefHeight="50" prefWidth="80" />
<Button id="SmallBlueBackground3" fx:id="optionButton3" onAction="#changeBackgroundScreen" prefHeight="50" prefWidth="80" />
</children>
</HBox>
<Region prefHeight="200.0" prefWidth="200.0" VBox.vgrow="ALWAYS" />
<HBox alignment="BOTTOM_RIGHT" spacing="10">
<children>
<Button fx:id="backToMain" onAction="#goToTheMainMenu" prefHeight="30" prefWidth="200" styleClass="ButtonLayout" text="Back to the Main Menu">
<shape>
<javafx.scene.shape.Rectangle arcHeight="30" arcWidth="30" height="30" width="200" />
</shape>
</Button>
</children>
</HBox>
</VBox>
</children>
</StackPane>