加载查询时使进度条可见。 ScalaFx

Question

我有一个登录 window 视图，我想在 slick 查询密码时 click/press 输入按钮时显示一个进度条。如果我在按钮 actionEvent 处更改进度条的可见属性，它直到查询完成后才会出现。此外，我不希望进度条在不可见时占用 space。有人知道如何做这些事情吗？

object SPM extends JFXApp {

/*
* Primary stage: Log in
* */
stage = new PrimaryStage {
// error message hidden label
val errorLabel = new Label()
errorLabel.textFill = Color.Red
errorLabel.font = Font.font("Helvetica", FontWeight.ExtraLight, 12)

val usernameField = new TextField {
  promptText = "User"
  maxWidth = 250
  prefHeight = 35
}

val passwordField = new PasswordField() {
  promptText = "Password"
  maxWidth = 250
  prefHeight = 35
}

val progressBar = new ProgressBar {
  maxWidth = 300
  visible = false
}
title = "Software Project Management"
scene = new Scene(800, 600) {
  root = new VBox {
    spacing = 10
    padding = Insets(20)
    alignment = Pos.Center
    children = List(
      new ImageView {
        image = new Image(
          this.getClass.getResourceAsStream("/images/logo.png"))
        margin = Insets(0, 0, 20, 0)
      },
      new Label {
        text = "Software Project Management"
        font = Font.font("Helvetica", FontWeight.ExtraLight, 32)
      },
      new Label {
        text = "Sign in to get started"
        font = Font.font("Helvetica", FontWeight.Thin, 18)
      },
      errorLabel,
      progressBar,
      usernameField,
      passwordField,
      new Button {
        text = "Enter"
        defaultButton = true
        prefHeight = 35
        font = Font.font("Helvetica", FontWeight.Thin, 18)
        maxWidth = 250
        onAction = (ae: ActionEvent) => {
          progressBar.visible = true
          val password = Users.checkPassword(usernameField.text.value)
          if (password != passwordField.text.value)
            errorLabel.text = "Please re-enter your password"
          else root = chooseProject
        }
      }
    ) // children
  } // root
} // scene

Answer 1

您的 Button.onAction 处理程序正在运行 JavaFX 应用程序线程上。与更新 UI 时使用的相同。当你运行长运行ning 任务时，你应该运行它在一个单独的线程上它会帮助 UI 做出正确的反应。常用的方法是使用 JavaFX Task。一般模式是这样的：

// Define your task
val task = new javafx.concurrent.Task[T] {
  override def call(): T = {
    // Do your task and return result    
    // Executed off JavaFX Application thread     
  }
  override def succeeded(): Unit = {
    // Update UI to finish processing
    // Executed on JavaFX Application thread     
  }
  override def failed(): Unit = {
    // Handle errors, if any
    // Executed on JavaFX Application thread 
  }
}

// Run your task
val t = new Thread(task, "My Task")
t.setDaemon(true)
t.start()

```

这是它在您的代码中的样子：

  root = new VBox { _root =>
  ...

        onAction = (ae: ActionEvent) => {
          progressBar.visible = true
          _root.disable = true
          //              progressBar.visible = true
          val task = new javafx.concurrent.Task[Boolean] {
            override def call(): Boolean = {
              println("Checking password... ")
              Thread.sleep(3000)
              println("Password checked. ")
              // Assume password is correct
              true
            }
            override def succeeded(): Unit = {
              progressBar.visible = false
              _root.disable = false
              val passwordOK = get()
              if (passwordOK) {
                new Alert(AlertType.Information) {
                  headerText = "Password OK"
                }.showAndWait()
              } else {
                new Alert(AlertType.Warning) {
                  headerText = "Invalid Password"
                }.showAndWait()

              }
            }
            override def failed(): Unit = {
              println("failed")
              progressBar.visible = false
              _root.disable = false
            }
          }

          val t = new Thread(task, "Password Task")
          t.setDaemon(true)
          t.start()
        }

加载查询时使进度条可见。 ScalaFx

Make progress bar visible when query is loading. ScalaFx

scala

javafx

scalafx