Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can I make a Dart function "wait" for a set amount of time or input?

Tags:

html

wait

dart

I'm trying to make a simple RPG in Dart. I will need to show text on a screen in a div, and I need to make the program wait for user input before displaying the next piece of text.

For example:

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

"showText has finished" should not display until the text has been displayed and the player presses enter. Here's the (pretty ugly in my opinion) code I have so far:

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();
}

The Timer runs the out() function asynchronously, which I don't want it to do. Ideally I would like to write something like this:

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)
}

Is this possible?

like image 320
Melvin Sowah Avatar asked Feb 11 '23 11:02

Melvin Sowah


2 Answers

Here's an example of how to do this using the new async/await feature. Note the async declaration at the start of method bodies, and the await statement before the call to pause() and showText().

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");
}
like image 148
Greg Lowe Avatar answered Apr 27 '23 21:04

Greg Lowe


This pause() function would totally break your web page. Dart has no threads and during that pause no other code could run (no event handler, no GUI updates). This is just not the way code in the browser works. Dart is inherently async. It is important to become comfortable with this style of programming when working with Dart.

That said - there are improvements on the way Async/Await feature in Dart 1.8 which to some degree hides that asynchronousnes.

like image 20
Günter Zöchbauer Avatar answered Apr 27 '23 22:04

Günter Zöchbauer