无法将TextFlow移动到新场景中

Question

在我的ScalaFX项目中，我想为用户创建一个单独的帮助页面，在该页面上，用户可以点击主题，导致说明出现在可点击的主题旁边。

问题是，当我为帮助页面创建新场景时，无论我做什么，都无法移动TextFlow。它始终停留在ListView的顶部。参见图片以供参考。

 helpMenu.onAction = (ae: ActionEvent) => {
    val helpStage = new Stage()
    helpStage.setTitle("A wild help stage appears!")
    val helpScene = new Scene(scene.width.get * 0.6, scene.height.get * 0.8) {
      val listView        = new ListView(List.tabulate(3) { n => "Option " + (n + 1) })
      val text1           = new Text("This is fine\n*zips coffee*\nThis is all fine.")
      val textFlow        = new TextFlow(text1)
      /*
       * Nothing below changes where the text appears in the new scene.
       */
      textFlow.layoutX  <== listView.width.get
      textFlow.alignmentInParent_=(Pos.TOP_RIGHT)
      textFlow.alignmentInParent_=(Pos.BASELINE_CENTER)
      text1.alignmentInParent_=(Pos.BASELINE_CENTER)

      listView.prefHeight <== scene.height.get * 0.4
      content.addAll(listView, textFlow)

    }
    helpStage.setScene(helpScene)
    helpStage.show()
    helpScene.listView.onMouseClicked = (le: MouseEvent) => {
      val item = helpScene.listView.selectionModel.apply.getSelectedItem
    }
  }

我想知道如何将文本与列表视图对齐？目的是让指示出现在那里。我的计划是使用以下代码： helpScene.listView.onMouseClicked = (le: MouseEvent) => { val item = helpScene.listView.selectionModel.apply.getSelectedItem } 因为我们可以轻松确定在列表中单击了什么。

- Cartesian Bear

---

嗨Sampo，我提供的代码解决了你的问题吗？我有遗漏什么吗？ - Mike Allen

@MikeAllen 你好，Mike。由于其他学校作业的缘故，我还没有时间查看你的答案。我会尽力在本周内检查它。 - Cartesian Bear

没问题。保持联系，随时告诉我...;-) - Mike Allen

@MikeAllen 谢谢！指南和你的示例代码正是我需要的，而且我是说完全符合我的需求！总体思路是用户可以点击一个选项，这个选项是一个命名主题，然后适当的帮助文本会出现在屏幕左侧。再次感谢！ - Cartesian Bear

很高兴它对你有用！ :-) - Mike Allen

Answer 1

我认为问题在于您需要将ListView和TextFlow元素添加到一个控制它们布局的容器中。在下面的代码中，我使用了一个HBox来实现这个目的，它将两个元素并排放置。（scalafx.scene.layout包中还有其他选项，如VBox、BorderPane等。这篇教程介绍了老版本的JavaFX 2，可能会让您更好地理解这个主题。）

之后，我有点不清楚您想要实现什么，但我认为您想根据ListView中选择的项目在TextFlow中显示不同的文本。如果是这样，那么以下示例通过使用选择更改来触发TextFlow内容的更改来解决这个问题。（如果这不是您想要的，请详细说明您的要求。）

此外，我简化了您的一些代码，使用了ScalaFX的属性（而不是JavaFX的getter和setter）。

onAction = (ae: ActionEvent) =>  {
  val helpStage = new Stage() {

    // Make room for the list view and the text flow.
    width = 400

    // Set the help text to the default.
    val defaultText = "Please make\na selection"
    val helpText = new Text(defaultText)

    // Help for each option in the list view. If a key doesn't match, then the default
    // text is displayed.
    val optionText = Map(
      "Option 1" -> "This is\nsome help for\nOption 1",
      "Option 2" -> "And this is\nsome help for\nOption 2",
      "Option 3" -> "Finally, this is\nsome help for\nOption 3",
    ).withDefaultValue(defaultText)

    // Title the stage and set the scene...
    title = "A wild help stage appears!"
    scene = new Scene {

      val listView = new ListView(List.tabulate(3) { n => "Option " + (n + 1) }) {

        // Change the help text when the selection changes.
        selectionModel().selectedItem.onChange {(_, _, selected) =>
          helpText.text = optionText(selected);
        }
      }

      // Add the help text to the text flow.
      val textFlow = new TextFlow(helpText)

      // Put list view and text flow elements side-by-side.
      content = new HBox(listView, textFlow)
    }
  }
  helpStage.show()
}

- Mike Allen