切换标签后,TabView中的数据重置

时间:2018-11-13 21:40:53

标签: dart flutter

在Flutter中,我有一些用于制表符的基本代码。

main.dart

import 'package:flutter/material.dart';
import './tab.dart' as tab;

void main(){
  runApp(new MaterialApp(
    home: new Tabs()
  ));
}

class Tabs extends StatefulWidget {
  @override
  TabsState createState() => new TabsState();
}

class TabsState extends State<Tabs> with SingleTickerProviderStateMixin {
  TabController controller;

  @override
  void initState() {
    super.initState();
    controller = new TabController(vsync: this, length: 4);
  }

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

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Pages"), 
        backgroundColor: Colors.deepOrange
      ),
      bottomNavigationBar: new Material(
        color: Colors.deepOrange,
        child: new TabBar(
          controller: controller,
          tabs: <Tab>[
            new Tab(icon: new Icon(Icons.trending_up)),
            new Tab(icon: new Icon(Icons.announcement)),
            new Tab(icon: new Icon(Icons.more_horiz)),
          ]
        )
      ),
      body: new TabBarView(
        controller: controller,
        children: <Widget>[
          new tab.Tab(),
          new tab.Tab(),
          new tab.Tab(),
        ]
      )
    );
  }
}

tab.dart

import 'package:flutter/material.dart';

class Tab extends StatefulWidget {
  @override
  TabState createState() => new TabState();
}

class TabState extends State<Tab> with AutomaticKeepAliveClientMixin<Tab> {
  @override
  bool get wantKeepAlive => true;
  updateKeepAlive();

  double _val = 100;

  void _incVal() {
    setState(() {
      _val+=10;
    });
  }

  Widget build(BuildContext context) {
    super.build(context);
    return new Container(
      child: new Center(
        child: new FlatButton(
          onPressed: _incVal,
          child: new Icon(Icons.accessibility_new, size: _val, color: Colors.orange)
        )
      )
    );
  }
}

此应用仅具有3个标签。每个页面都相同。每页上都有一个图标,点击该图标应会增加。正如我使用的AutomaticKeepAliveClientMixin一样,切换选项卡时图标的大小应保持不变,除了一种情况,情况就是如此。

切换到第二个(中间)页面,然后点击几次图标使其增大。然后切换到第一页,然后是第三页,然后再回到第二页,第二页上的图标将恢复为默认大小,而不是保持原样。

这是一个非常简单的示例,但仅说明了问题所在。

0 个答案:

没有答案