StreamBuilder

Rebuilds with the latest AsyncSnapshot of stream — each event, error, and close. Cancels its subscription on dispose and re-subscribes only when the stream identity changes.

Learn more: Loading data

Import: package:fleury/fleury.dart, or package:fleury/fleury_core.dart in browser code.

Usage

StreamBuilder<int>(
  stream: ticks,
  initialData: 0,
  builder: (context, snapshot) => Text('tick ${snapshot.data ?? 0}'),
)

Constructors

StreamBuilder()

Parameter	Type	Default	Description
stream:	Stream<T>?	required	The stream to observe. A null stream stays disconnected.
initialData:	T?	—	Data exposed before stream emits, or null when there is no seed value.
builder:	AsyncWidgetBuilder<T>	required	Builds the subtree after each data event, error, and connection change.

Source

StreamBuilder is defined in packages/fleury/lib/src/widgets/async.dart.

Category: State & async · All widgets

Live demo

transmission_view.darttransmission.dart

Restart Run Expand

Example · editable Revert Format

class _TransmissionViewState extends State<TransmissionView> {
  var _transmission = Transmission();
  late var _updates = _transmission.updates;

  void _restart() {
    _transmission.dispose();
    setState(() {
      _transmission = Transmission();
      _updates = _transmission.updates;
    });
  }

  @override
  void dispose() {
    _transmission.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) => StreamBuilder<List<String>>(
    key: ValueKey(_transmission),
    stream: _updates,
    initialData: const [],
    builder: (context, snapshot) {
      if (snapshot.hasError) {
        return Button(text: 'Signal lost. Restart', onPressed: _restart);
      }
      final lines = snapshot.requireData;
      final status = switch (snapshot.connectionState) {
        ConnectionState.none => 'OFFLINE',
        ConnectionState.waiting => 'CONNECTING',
        ConnectionState.active => 'LIVE',
        ConnectionState.done => 'COMPLETE',
      };
      final complete = snapshot.connectionState == ConnectionState.done;
      return Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text('$status · ${lines.length}/5 packets'),
          for (final line in lines) Text(line),
          Row(
            children: [
              Button(
                text: 'Next packet',
                onPressed: complete ? null : _transmission.receiveNext,
              ),
              const SizedBox(width: 1),
              Button(text: 'Restart', onPressed: _restart),
            ],
          ),
        ],
      );
    },
  );
}

Live preview

Live · interactive

click & type to interact ⓘ how this demo runs ⛶ Expand