FXML如何水平居中图像

如何水平居中此图像？我试着投入HBox像这样，但它不工作...FXML如何水平居中图像

<HBox alignment="CENTER"> 
    <ImageView fitWidth="300" preserveRatio="true"> 
     <image> 
      <Image url="@Logo.png"/> 
     </image> 
    </ImageView> 
</HBox>

来源

2016-02-12 user1406186

HBox是如何加入到场景中的？在我看来，它没有调整到父宽度。 – fabian

它是在父母的Vbox内，这是为什么？ – user1406186

取决于vbox。在做布局时，我通常总是启用边框，这样可以解决95％的布局和对齐问题 – JohnRW

这里有点MCVE与FXML文件：

应用：

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

/** 
* 
* @author Naoghuman 
*/ 
public class CenterImageInHBox extends Application { 

    @Override 
    public void start(Stage stage) throws Exception { 
     Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml")); 

     Scene scene = new Scene(root); 

     stage.setScene(scene); 
     stage.show(); 
    } 

    /** 
    * @param args the command line arguments 
    */ 
    public static void main(String[] args) { 
     launch(args); 
    } 

}

FXML file：

<?xml version="1.0" encoding="UTF-8"?> 

<?import javafx.scene.image.*?> 
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 

<AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="center.image.in.hbox.FXMLDocumentController"> 
    <children> 
     <VBox layoutX="60.0" prefHeight="200.0" prefWidth="100.0" spacing="7.0" style="-fx-background-color: YELLOWGREEN;" AnchorPane.bottomAnchor="14.0" AnchorPane.leftAnchor="14.0" AnchorPane.rightAnchor="14.0" AnchorPane.topAnchor="14.0"> 
      <children> 
       <ToolBar prefHeight="40.0" prefWidth="200.0"> 
        <items> 
         <Button mnemonicParsing="false" onAction="#onActionLeft" text="Left" /> 
         <Button mnemonicParsing="false" onAction="#onActionCenter" text="Center" /> 
         <Button mnemonicParsing="false" onAction="#onActionRight" text="Right" /> 
        </items> 
       </ToolBar> 
       <HBox fx:id="hbImage" alignment="TOP_CENTER" VBox.vgrow="ALWAYS"> 
        <children> 
         <ImageView fx:id="ivImage" fitHeight="128.0" fitWidth="128.0" pickOnBounds="true" preserveRatio="true" /> 
        </children> 
       </HBox> 
      </children> 
     </VBox> 
    </children> 
</AnchorPane>

和控制器：

import java.net.URL; 
import java.util.ResourceBundle; 
import javafx.fxml.FXML; 
import javafx.fxml.Initializable; 
import javafx.geometry.Pos; 
import javafx.scene.image.Image; 
import javafx.scene.image.ImageView; 
import javafx.scene.layout.HBox; 

/** 
* 
* @author Naoghuman 
*/ 
public class FXMLDocumentController implements Initializable { 

    @FXML private HBox hbImage; 
    @FXML private ImageView ivImage; 

    @Override 
    public void initialize(URL url, ResourceBundle rb) { 
     Image img = new Image("http://icons.iconarchive.com/icons/evermor-design/galaxian/128/Movie-Clip-icon.png"); 
     ivImage.setImage(img); 
    }  

    public void onActionCenter() { 
     hbImage.setAlignment(Pos.TOP_CENTER); 
    } 

    public void onActionLeft() { 
     hbImage.setAlignment(Pos.TOP_LEFT); 
    } 

    public void onActionRight() { 
     hbImage.setAlignment(Pos.TOP_RIGHT); 
    } 

}

当你点击应用按钮，然后你会看到图像对准离开，中心或右取决于您已选定的行动。

来源

2016-02-13 16:56:47 Naoghuman

FXML如何水平居中图像

回答

相关问题