Flutter之局部刷新(2021)

Flutter 框架内部提供了一个非常小巧精致的组件，专门用于局部组件的刷新，它就是 ValueListenableBuilder。

ValueListenableBuilder需要的元素:

• 类型为 ValueWidgetBuilder<T> 的 builder, 监听对象的界面展现. 本质是一个方法，Widget Function(BuildContext context, T value, Widget child)
• ValueListenable<T> 对象 , 监听对象, 这里用它的实现类: ValueNotifier

使用

 ValueListenableBuilder<int>(
              builder: _builderWithValue,
              valueListenable: new_counter,
            ),

完整代码

class _MyHomePageState extends State<MyHomePage> {

// ValueNotifier是ValueListenableBuilder 需要传入的ValueListenable<T> 抽象类的实现 . 接收一个泛型.
  final ValueNotifier<int> new_counter = ValueNotifier<int>(0);

  void _incrementCounter() {
    new_counter.value += 1;
  }

// 每当监听的对象值发生变化时，会触发builder 方法进行刷新。
// 如下, 在点击时只需要改变 new_counter.value 的值，就会触发 _buildWithValue 从而将界面数字刷新。
  Widget _builderWithValue(BuildContext context , int value , Widget child){
    return Text('$value',
    style: Theme.of(context).textTheme.headline4,);
  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(

        title: Text(widget.title),
      ),
      body: Center(
       
        child: Column(

          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
            ),
            ValueListenableBuilder<int>(
              builder: _builderWithValue,
              valueListenable: new_counter,
            ),
           
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

原文参考

Flutter 写的app, 需要源码可以私信~~

• 简繁火星字体转换
• 哄女友神器
• 号码测吉凶
• 电视节目直播表

最好的笔记软件

最好的笔记软件

https://www.wolai.com/signup?invitation=6Z8Z3BP