我可以制作飞镖功能"等待"一段时间或输入?

时间:2014-12-02 09:22:41

标签: html5 dart wait

我正在尝试在Dart中制作一个简单的RPG。我需要在div的屏幕上显示文本,我需要让程序在显示下一段文本之前等待用户输入。

例如:

void main() {
  showText("Hello, Adventurer! Welcome to the land of Dartia! (Press ENTER to continue...)");
  print("showText has finished");
}
在文本显示且播放器按下回车键之前,不应显示

"showText has finished"。这是我到目前为止的代码(在我看来相当丑陋):

void showText(String text) {
    var textBox = querySelector("#sample_text_id")
        ..text = "";
    var timer;
    var out;
    out = ([int i = 0]) {
        textBox.text += text[i];
        if (i < text.length - 1) timer = new Timer(const Duration(milliseconds: 10), () => out(i + 1));
    };
    out();
}

Timer以异步方式运行out()函数,我不希望它这样做。理想情况下,我想写这样的东西:

void showText(String text) {
    var textBox = querySelector("#sample_text_id")
            ..text = "";
    for(int i = 0; i < text.length; i++) {
        textBox.text += text[i];
        pause(const Duration(milliseconds: 10)); //  pause the program for given duration
    }
    waitFor(KeyEnum.ENTER, KeyStateEnum.DOWN); // pause until key is pressed (pseudo Enum contains char codes)
}

这可能吗?

3 个答案:

答案 0 :(得分:4)

以下是使用新的async / await功能执行此操作的示例。注意方法体开头的异步声明,以及在调用pause()和showText()之前的await语句。

Future pause(Duration d) => new Future.delayed(d);

Future waitFor(int c) => document.body.onKeyDown.firstWhere((e) => e.keyCode == c);

Future showText(String text) async {
    var textBox = querySelector("#sample_text_id")
            ..text = "";
    for(int i = 0; i < text.length; i++) {
        textBox.text += text[i];
        await pause(const Duration(milliseconds: 100)); //  pause the program for given duration
    }
    return waitFor(KeyCode.ENTER); // pause until key is pressed
}

main() async {
  await showText("Hello, Adventurer! Welcome to the land of Dartia! (Press ENTER to continue...)");
  print("showText has finished");
}

答案 1 :(得分:2)

pause()功能会完全破坏您的网页。 Dart没有线程,在那个暂停期间没有其他代码可以运行(没有事件处理程序,没有GUI更新)。这不是浏览器中的代码工作方式。 Dart天生就是异步。在使用Dart时,熟悉这种编程风格非常重要。

那就是说 - Async/Await feature in Dart 1.8在某种程度上隐藏了异步的方式有所改进。

答案 2 :(得分:-1)

为此,流生成器是最好的方法,请阅读以下内容:Understanding stream