keyboard_typing 0.0.6

Creates an animation effect where the text appears as if it's being typed on a keyboard.

KeyboardTyping Widget

🌱 Getting Started

Add

flutter pub add keyboard_typing

Import

import 'package:keyboard_typing/keyboard_typing.dart';

🌅 Update

• If you define previewTextColor paremeter, you can see preview TextWidget's data.

  KeyboardTyping(
    text: Text("If you define 'previewTextColor' parameter,\nThen you can see a preview TextWidget :)"),
    previewTextColor: Colors.grey.withOpacity(0.5),
  )

🚀 Usage

• If you don't define a KeyboardTypingController, The KeyboardTyping Widget plays automatically.

Create KeyboardTyping Widget ⌨

parameter	required	type	default
text	✔️	Text
controller	❌	KeyboardTypingController?
previewTextColor	❌	Color?
mode	❌	KeyboardTypingMode	KeyboardTypingMode.normal
intervalDuration	❌	Duration?	Duration(milliseconds: 150)

  KeyboardTyping(
    text: Text("Something Text"),
  )

---

Play Typing Animation 🚩

// AutoPlay
KeyboardTypingController controller = KeyboardTypingController();

@override
void initState() {
  controller
    ..addStateEventListener(keyboardStateEventListener)
    ..play();
}

// User control
@override
Widget build(BuildContext context) {
  ...
  ElevatedButton(
    onPressed: () {
      controller.play();
    }
  )
}

Stop Typing Animation 🚧

• If you want clear text to define 'true' into cancel parameter in stop function.

KeyboardTypingController controller = KeyboardTypingController();

@override
Widget build(BuildContext context) {
  ...
  ElevatedButton(
    onPressed: () {
      // Normal stop
      controller.stop();

      // Forced stop
      controller.stop(cancel: true);    // Effect clear text and start at first.
    }
  )
}

Repeat Typing Animation 🌀

  KeyboardTyping(
    text: Text("Something Text"),
    mode: KeyboardTypingMode.repeat,
  )

Listen Typing event state 🎈

  controller.addStateEventListener((KeyboardTypingState state) {
    setState(() {
      switch (state) {
        case KeyboardTypingState.idle:
          // TODO: Handle this case.
        case KeyboardTypingState.active:
          // TODO: Handle this case.
        case KeyboardTypingState.pause:
          // TODO: Handle this case.
        case KeyboardTypingState.stop:
          // TODO: Handle this case.
        case KeyboardTypingState.complete:
          // TODO: Handle this case.
      }
    });
  },);

  // remove
  // controller.removeStateEventListener(...);