在提供程序中使用流与颤动

Question

我做了一个简单的例子来理解在 Flutter 中使用 Stream with Provider 模式。

我不知道在这种情况下如何更改流值？ - 当我点击添加图标时，值将被添加，计数值增加（如 Sink.add）

请帮助我了解将 Stream 与 Provider 一起使用。

非常感谢！！！

屏幕：

这是我的代码：

import 'dart:async';
import 'dart:convert';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';

// Main app and Pages for Tab Layout
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: MultiProvider(
            providers: [
              StreamProvider(
                  create: (_) => EventProvider().intStream(), initialData: 0),
            ],
            child: DefaultTabController(
                length: 1,
                child: DefaultTabController(
                  length: 1,
                  child: Scaffold(
                    appBar: AppBar(
                      title: Text("Provider Demo"),
                      bottom: TabBar(
                        tabs: [
                          Tab(icon: Icon(Icons.add)),
                        ],
                      ),
                    ),
                    body: TabBarView(
                      children: [
                        MyEventPage(),
                      ],
                    ),
                  ),
                ))));
  }
}

// Event page (counting)
class MyEventPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var _value = Provider.of<int>(context);
    return Container(
        child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Center(
            child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('StreamProvider Example'),
            SizedBox(height: 50),
            Text('${_value.toString()}',
                style: Theme.of(context).textTheme.display1)
          ],
        )),
        Align(
          alignment: Alignment.bottomRight,
          child: RaisedButton(
            onPressed: () {
              EventProvider().add();
            },
            child: Icon(Icons.add),
          ),
        )
      ],
    ));
  }
}

// User List Page

// EventProvider (Stream)
class EventProvider {
  StreamController<int> sc = StreamController();
  int count = 0;

  Stream<int> intStream() {
//    return Stream<int>.periodic(interval, (int _count) => _count++);
    return sc.stream;
  }

  add () {
    count++;
    sc.sink.add;
  }
}

Answer 1

我只想分享我的理解。

我需要创建单例 EventProvider 实例。

对于像我这样的人，这是我更改的代码：

import 'dart:async';
import 'dart:convert';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';

// Main app and Pages for Tab Layout
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: MultiProvider(
            providers: [
                StreamProvider<int>.value(value: xyz.intStream(), initialData: xyz.count,)

            ],
            child: DefaultTabController(
                length: 1,
                child: DefaultTabController(
                  length: 1,
                  child: Scaffold(
                    appBar: AppBar(
                      title: Text("Provider Demo"),
                      bottom: TabBar(
                        tabs: [
                          Tab(icon: Icon(Icons.add)),
                        ],
                      ),
                    ),
                    body: TabBarView(
                      children: [
                        MyEventPage()
                      ],
                    ),
                  ),
                ))));
  }
}

// Event page (counting)
class MyEventPage extends StatefulWidget {
  @override
  _MyEventPageState createState() => _MyEventPageState();
}

class _MyEventPageState extends State<MyEventPage> {
  StreamController<int> ct;

  @override
  void initState() {
    super.initState();

  }

  @override
  Widget build(BuildContext context) {
    var ct = Provider.of<int>(context);
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text('StreamProvider Example'),
                SizedBox(height: 50),
                Text(ct.toString(), style: Theme.of(context).textTheme.display1)
              ],
            )),
        Align(
          alignment: Alignment.bottomRight,
          child: RaisedButton(
            onPressed: () {
              xyz.add();
            },
            child: Icon(Icons.add),
          ),
        )
      ],
    );
  }

}


final xyz = EventProvider();

// EventProvider (Stream)
class EventProvider {
  StreamController<int> sc = StreamController();
  int count = 0;

  Stream<int> intStream() {
    return sc.stream;
  }

  add () {
    sc.add(++count);
  }

}