JavaFx - 文本换行不适用于 VBox 内的复选框
JavaFx - Text Wrapping not working on Checkbox inside VBox
我有几个 UI 元素要垂直堆叠在面板的中央,所有元素都在中央的左边缘对齐。我试着用 VBox 来做这件事,它一直有效,直到我添加了一个文本太长的项目;它总是用省略号截断文本,我无法让它将文本换行到下一行。我在复选框上将 wrapText 参数设置为 true,但它似乎不尊重它。我试过在复选框和它所在的 vbox 上设置 perfWidth 和 maxWidth,但似乎没有任何效果。谁能告诉我我做错了什么?
截图:
textwrap.fxml
<?import java.net.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.control.ToggleGroup?>
<VBox xmlns:fx="http://javafx.com/fxml" maxWidth="100"
prefHeight="200" prefWidth="300" alignment="BASELINE_CENTER" spacing="30">
<VBox alignment="CENTER" maxWidth="100" prefWidth="100">
<VBox spacing="10" style=" -fx-border-color:black; -fx-border-width: 1; -fx-border-style: solid;" alignment="BASELINE_LEFT"
>
<padding>
<Insets top="0" right="0" bottom="10" left="5"/>
</padding>
<RadioButton text="Option 1">
<toggleGroup>
<ToggleGroup fx:id="group"/>
</toggleGroup>
<selected>true</selected>
</RadioButton>
<RadioButton text="Option 2">
<toggleGroup>
<fx:reference source="group"/>
</toggleGroup>
</RadioButton>
</VBox>
<CheckBox text="My Long Textbox Text" selected="true" wrapText="true">
</CheckBox>
</VBox>
</VBox>
TextWrap.java
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class TextWrap extends Application
{
@Override
public void start(Stage stage) throws Exception
{
Parent root = FXMLLoader.load(getClass().getResource("textwrap.fxml"));
Scene scene = new Scene(root, 300, 275);
stage.setTitle("Text Wrap");
stage.setScene(scene);
stage.show();
}
public static void main(String[] args)
{
launch();
}
}
编辑——正如@jewelsea 在下面指出的那样,问题是 BASELINE_CENTER 在根 VBox 中;将其更改为居中消除了截断问题。这产生了意想不到的副作用,使无线电盒周围的外部延伸得比我喜欢的更远:
通过添加
<maxWidth><Control fx:constant="USE_PREF_SIZE" /></maxWidth>
到内部 VBOX 我能够更正这个:
我还发现,如果出于某种原因我嫁给了 BASELINE_CENTER,我仍然可以通过添加
来解决复选框文本的问题
<minWidth><Control fx:constant="USE_PREF_SIZE" /></minWidth>
选中复选框以获得相同的效果。
这是我想出来的,试试看是不是你想要的。
您可能需要更改一些内容才能达到最终所需的布局,但希望这能解决您眼前的包装问题。
我认为外部 VBox 上的 BASELINE_CENTER
对齐令人困惑,但我更改了一些其他内容,所以它可能是其他内容。
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.control.RadioButton?>
<?import javafx.scene.control.ToggleGroup?>
<?import javafx.scene.layout.VBox?>
<VBox alignment="CENTER" prefHeight="200.0" prefWidth="300.0" xmlns="http://javafx.com/javafx/17"
xmlns:fx="http://javafx.com/fxml/1">
<children>
<VBox maxWidth="100.0" prefWidth="100.0">
<VBox alignment="BASELINE_LEFT" spacing="10"
style=" -fx-border-color:black; -fx-border-width: 1; -fx-border-style: solid;">
<padding>
<Insets bottom="10" left="5" right="0" top="0"/>
</padding>
<RadioButton text="Option 1">
<toggleGroup>
<ToggleGroup fx:id="group"/>
</toggleGroup>
<selected>true</selected>
</RadioButton>
<RadioButton text="Option 2">
<toggleGroup>
<fx:reference source="group"/>
</toggleGroup>
</RadioButton>
</VBox>
<CheckBox selected="true" text="My Long Textbox Text" wrapText="true">
</CheckBox>
</VBox>
</children>
</VBox>
我有几个 UI 元素要垂直堆叠在面板的中央,所有元素都在中央的左边缘对齐。我试着用 VBox 来做这件事,它一直有效,直到我添加了一个文本太长的项目;它总是用省略号截断文本,我无法让它将文本换行到下一行。我在复选框上将 wrapText 参数设置为 true,但它似乎不尊重它。我试过在复选框和它所在的 vbox 上设置 perfWidth 和 maxWidth,但似乎没有任何效果。谁能告诉我我做错了什么?
截图:
textwrap.fxml
<?import java.net.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.control.ToggleGroup?>
<VBox xmlns:fx="http://javafx.com/fxml" maxWidth="100"
prefHeight="200" prefWidth="300" alignment="BASELINE_CENTER" spacing="30">
<VBox alignment="CENTER" maxWidth="100" prefWidth="100">
<VBox spacing="10" style=" -fx-border-color:black; -fx-border-width: 1; -fx-border-style: solid;" alignment="BASELINE_LEFT"
>
<padding>
<Insets top="0" right="0" bottom="10" left="5"/>
</padding>
<RadioButton text="Option 1">
<toggleGroup>
<ToggleGroup fx:id="group"/>
</toggleGroup>
<selected>true</selected>
</RadioButton>
<RadioButton text="Option 2">
<toggleGroup>
<fx:reference source="group"/>
</toggleGroup>
</RadioButton>
</VBox>
<CheckBox text="My Long Textbox Text" selected="true" wrapText="true">
</CheckBox>
</VBox>
</VBox>
TextWrap.java
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;
public class TextWrap extends Application
{
@Override
public void start(Stage stage) throws Exception
{
Parent root = FXMLLoader.load(getClass().getResource("textwrap.fxml"));
Scene scene = new Scene(root, 300, 275);
stage.setTitle("Text Wrap");
stage.setScene(scene);
stage.show();
}
public static void main(String[] args)
{
launch();
}
}
编辑——正如@jewelsea 在下面指出的那样,问题是 BASELINE_CENTER 在根 VBox 中;将其更改为居中消除了截断问题。这产生了意想不到的副作用,使无线电盒周围的外部延伸得比我喜欢的更远:
通过添加
<maxWidth><Control fx:constant="USE_PREF_SIZE" /></maxWidth>
到内部 VBOX 我能够更正这个:
我还发现,如果出于某种原因我嫁给了 BASELINE_CENTER,我仍然可以通过添加
来解决复选框文本的问题<minWidth><Control fx:constant="USE_PREF_SIZE" /></minWidth>
选中复选框以获得相同的效果。
这是我想出来的,试试看是不是你想要的。
您可能需要更改一些内容才能达到最终所需的布局,但希望这能解决您眼前的包装问题。
我认为外部 VBox 上的 BASELINE_CENTER
对齐令人困惑,但我更改了一些其他内容,所以它可能是其他内容。
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.CheckBox?>
<?import javafx.scene.control.RadioButton?>
<?import javafx.scene.control.ToggleGroup?>
<?import javafx.scene.layout.VBox?>
<VBox alignment="CENTER" prefHeight="200.0" prefWidth="300.0" xmlns="http://javafx.com/javafx/17"
xmlns:fx="http://javafx.com/fxml/1">
<children>
<VBox maxWidth="100.0" prefWidth="100.0">
<VBox alignment="BASELINE_LEFT" spacing="10"
style=" -fx-border-color:black; -fx-border-width: 1; -fx-border-style: solid;">
<padding>
<Insets bottom="10" left="5" right="0" top="0"/>
</padding>
<RadioButton text="Option 1">
<toggleGroup>
<ToggleGroup fx:id="group"/>
</toggleGroup>
<selected>true</selected>
</RadioButton>
<RadioButton text="Option 2">
<toggleGroup>
<fx:reference source="group"/>
</toggleGroup>
</RadioButton>
</VBox>
<CheckBox selected="true" text="My Long Textbox Text" wrapText="true">
</CheckBox>
</VBox>
</children>
</VBox>