Question

如何设置Control宽度的百分比？我试图使用CSS执行此操作：

#consoleArea {    
    -fx-font-family: "Lucida Console", Monaco, monospace;  
    -fx-font-size: 12pt;
    -fx-width:100%;
}

但没有任何效果。

FXML：

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

<?import java.lang.*?>
<?import java.net.*?>
<?import java.util.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>
<?import javafx.scene.text.*?>

<AnchorPane id="AnchorPane"  styleClass="root" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="445.0" prefWidth="640.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/2.2" fx:controller="webServer.FormController">
    <children>
        <TextArea fx:id="consoleArea" editable="false" layoutX="0.0" layoutY="0.0" prefHeight="340.0" wrapText="true" />
        <TextField fx:id="portField" layoutX="18.0" layoutY="361.0" prefHeight="30.0" prefWidth="154.0" />
        <Button fx:id="startButton" defaultButton="true" layoutX="550.0" layoutY="361.0" maxHeight="30.0" mnemonicParsing="false" onAction="#startButtonAction" prefHeight="30.0" text="Start server"> 
            <tooltip>
                <Tooltip text="Starts server on specified port."/>
            </tooltip> 
        </Button>
        <Button fx:id="stopButton" layoutX="460.0" layoutY="361.0" maxHeight="30.0" mnemonicParsing="false" onAction="#stopButtonAction" prefHeight="30.0" text="Stop server" > 
            <tooltip>
                <Tooltip text="Stops server closing the ServerSocket."/>
            </tooltip>
        </Button>
        <Button fx:id="clearButton" layoutX="402.0" layoutY="361.0" maxHeight="30.0" mnemonicParsing="false" onAction="#clearButtonAction" prefHeight="30.0" text="Clear" >   
            <tooltip>
                <Tooltip text="Clears console. Nothing special."/>
            </tooltip> 
        </Button>
        <Button fx:id="setPortButton" layoutX="181.0" layoutY="361.0" maxHeight="30.0" mnemonicParsing="false" onAction="#setButtonAction" prefHeight="30.0" text="Set port" > 
            <tooltip>
                <Tooltip text="Creates new ServerSocket and sets its port to specified."/>
            </tooltip>
        </Button>
        <Pane fx:id="statusPane" layoutX="0.0" layoutY="416.0" prefHeight="37.0" prefWidth="650.0">
            <children>
                <Text fx:id="status" layoutX="18.0" layoutY="23.0" strokeType="OUTSIDE" strokeWidth="0.0" text="App start">
                    <font>
                        <Font size="12.0" />
                    </font>
                </Text>
            </children>
        </Pane>
    </children>
    <stylesheets>
        <URL value="@style.css" />
    </stylesheets>
</AnchorPane>

Answer 1

取决于父id="AnchorPane"

尝试#AnchorPane { width: 100%; }

希望它有助于你

如何设置宽度百分比？

1 个答案: