Flutter RxDart 的使用 fromIterable fromFuture fromIterable periodic listen的使用

官网pub.dev

搜索RxDart

目前版本已经达到了^0.26.0 但是教程里面采用的是^0.18.1

我们就^0.18.1就行编程

#  rxdart: ^0.26.0
  rxdart: ^0.18.1

添加后并进行拉取相关代码

新建rxdart_demo.dart

import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';

class RxDartDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("RxDartDemo"),
      ),
      body: RxDartDemoHome(),
    );
  }
}

class RxDartDemoHome extends StatefulWidget {
  @override
  _RxDartDemoHomeState createState() => _RxDartDemoHomeState();
}

class _RxDartDemoHomeState extends State<RxDartDemoHome> {
  @override
  void initState() {
    super.initState();
    Observable<String> _observable =
        Observable(Stream.fromIterable(['hello', '您好']));
    _observable.listen(print);
  }

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

 

运行后控制台结果返回

Performing hot restart...
Syncing files to device MI 8...
Restarted application in 840ms.
I/flutter (26233): hello
I/flutter (26233): 您好

修改为 fromFuture 方式创建

 

import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';

class RxDartDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("RxDartDemo"),
      ),
      body: RxDartDemoHome(),
    );
  }
}

class RxDartDemoHome extends StatefulWidget {
  @override
  _RxDartDemoHomeState createState() => _RxDartDemoHomeState();
}

class _RxDartDemoHomeState extends State<RxDartDemoHome> {
  @override
  void initState() {
    super.initState();
    Observable<String> _observable =
        // Observable(Stream.fromIterable(['hello', '您好']));
        Observable.fromFuture(Future.value("Hello ~"));
    _observable.listen(print);
  }

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

输出

修改为 fromIterable创建

import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';

class RxDartDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("RxDartDemo"),
      ),
      body: RxDartDemoHome(),
    );
  }
}

class RxDartDemoHome extends StatefulWidget {
  @override
  _RxDartDemoHomeState createState() => _RxDartDemoHomeState();
}

class _RxDartDemoHomeState extends State<RxDartDemoHome> {
  @override
  void initState() {
    super.initState();
    Observable<String> _observable =
        // Observable(Stream.fromIterable(['hello', '您好']));
        // Observable.fromFuture(Future.value("Hello ~"));
        Observable.fromIterable(['hello', '您好']);
    _observable.listen(print);
  }

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

 

 

Just可以创建简单的

 

循环输出

periodic

code

import 'package:flutter/material.dart';
import 'package:rxdart/rxdart.dart';

class RxDartDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("RxDartDemo"),
      ),
      body: RxDartDemoHome(),
    );
  }
}

class RxDartDemoHome extends StatefulWidget {
  @override
  _RxDartDemoHomeState createState() => _RxDartDemoHomeState();
}

class _RxDartDemoHomeState extends State<RxDartDemoHome> {
  @override
  void initState() {
    super.initState();
    Observable<String> _observable =
        // Observable(Stream.fromIterable(['hello', '您好']));
        // Observable.fromFuture(Future.value("Hello ~"));
        // Observable.fromIterable(['hello', '您好']);
        Observable.periodic(Duration(seconds: 3), (x) => x.toString());
    _observable.listen(print);
  }

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

效果