2、深入研究flutter元件之（Accumulator）

Swimly發表於2019-09-19
Flutter元件

還記得建立新專案的時候flutter預設給我們一個什麼例項嗎？一個點選累增的例子，今天，我們用Accumulator來一個不一樣的實現方法。由於其很簡單，作為前端我暫且把它看成一個物件型別。就比如Array等等。 用法如下：

Accumulator _accumulator = Accumulator();
複製程式碼

然後就可以拿著_accumulator為所欲為了。具體使用請參照下面的程式碼。只是用的最多的無非就是increment(int),.value 首先我們來看下今天的例子：

演示

2、深入研究flutter元件之（Accumulator）

完整程式碼：

import "package:flutter/material.dart";

class AccumulatorPage extends StatefulWidget {
 @override
 _AccumulatorPageState createState() => _AccumulatorPageState();
}

class _AccumulatorPageState extends State<AccumulatorPage> {
 Accumulator _accumulator = Accumulator();
 int num = 1;
 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
       title: Text('Accumulator'),
       centerTitle: true,
       elevation: 0,
     ),
     body: Column(
       mainAxisAlignment: MainAxisAlignment.start,
       children: <Widget>[
         Text('${_accumulator.value}'),
         TextField(
           onChanged: (data) {
             setState(() {
               num = int.parse(data);
             });
           },
         ),
         RaisedButton(
           child: Text('增加$num'),
           onPressed: () {
             setState(() {
               _accumulator.increment(num);
             });
           },
         )
       ],
     )
   );
 }
}

複製程式碼

未完待續……！

相關文章