Почему JavaFX размывает элементы управления и как его исправить?

Question

Я имею эту простую форму приложения JavaFX с двумя TextArea без свойств стиля:

При просмотре формы я вижу это:

FXML код здесь:

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

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


<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"> 
    <children> 
     <TitledPane animated="false" prefWidth="300.0" text="untitled" AnchorPane.bottomAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> 
     <content> 
      <TextArea prefHeight="200.0" prefWidth="200.0" /> 
     </content> 
     </TitledPane> 
     <SplitPane dividerPositions="0.5" orientation="VERTICAL" prefHeight="200.0" prefWidth="160.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="300.0" AnchorPane.topAnchor="0.0"> 
     <items> 
      <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="100.0" prefWidth="160.0"> 
       <children> 
        <TitledPane animated="false" text="untitled" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> 
        <content> 
         <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0"> 
          <children> 
           <TextArea prefHeight="200.0" prefWidth="200.0" AnchorPane.bottomAnchor="-10.0" AnchorPane.leftAnchor="-10.0" AnchorPane.rightAnchor="-10.0" AnchorPane.topAnchor="-10.0" /> 
          </children> 
         </AnchorPane> 
        </content> 
        </TitledPane> 
       </children> 
      </AnchorPane> 
      <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="100.0" prefWidth="160.0" /> 
     </items> 
     </SplitPane> 
    </children> 
</AnchorPane> 

Текст в первом TextArea размыты. Почему это происходит и как это исправить?

Answer 1

Проблема возникает, когда вы используете эту комбинацию: TitledPane -> AnchorPane (Это не имеет значения, какие элементы встроены в AnchorPane). Когда вы используете инструмент AnchorPane Constraints, вложенные элементы получают артефакты значений Width, Height, LayoutBounds, BoundsInLocal и BoundsInParent. Эти артефакты влияют на размытие.

Нет сдерживает:

Там не сдерживает:

Для решения этой проблемы не используйте комбинацию TitledPane-> AnchorPane или не использовать инструмент AnchorPane ограничений.

Answer 2

Вы завернули TextArea в SplitPane в другой AnchorPane. Если вы удалите, что размытие исчезло. Я не знаю, почему, но я мог бы заставить его работать с этим кодом.

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

<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 


<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" 
      prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"> 
    <TitledPane animated="false" prefWidth="300.0" text="test2" AnchorPane.bottomAnchor="0.0" 
       AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> 
     <TextArea prefHeight="200.0" prefWidth="200.0"/> 
    </TitledPane> 
    <SplitPane dividerPositions="0.5" orientation="VERTICAL" prefHeight="200.0" prefWidth="160.0" 
       AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="300.0" 
       AnchorPane.topAnchor="0.0"> 
     <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="100.0" prefWidth="160.0"> 
      <TitledPane animated="false" text="test" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" 
         AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"> 
        //deleted AnchorPane here 
        <TextArea prefHeight="200.0" prefWidth="200.0" AnchorPane.bottomAnchor="-10.0" 
           AnchorPane.leftAnchor="-10.0" AnchorPane.rightAnchor="-10.0" 
           AnchorPane.topAnchor="-10.0"/> 
      </TitledPane> 
     </AnchorPane> 
     <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="100.0" prefWidth="160.0"/> 
    </SplitPane> 
</AnchorPane>