flutter 切换保持页面状态

1、页面必须是有状态组件

2、继承状态类的类要with多继承AutomaticKeepAliveClientMixin

3、在类中重写getter保持状态方法，返回true布尔值
  		bool get wantKeepAlive=>true;
  		
4、设置完毕后可以保持数据状态和滚动条状态

代码示例:
保持状态组件:

import 'package:flutter/material.dart';


class Home3 extends StatefulWidget {
  Home3({Key key}) : super(key: key);

  @override
  _Home3State createState() => _Home3State();
}

//设置保持状态
class _Home3State extends State<Home3> with AutomaticKeepAliveClientMixin {
  int count=0;

  //getter重写保持状态方法,返回布尔值
  bool get wantKeepAlive=>true;



  @override
  Widget build(BuildContext context) {
    return Container(
       child:Center(
         child: Column(
           mainAxisAlignment: MainAxisAlignment.center,
           children: <Widget>[
             Text('数字:$count'),
             FloatingActionButton(
               onPressed: (){
                 setState(() {
                   count=count+1;
                 });
               },
               child: Icon(Icons.add),
             )
           ],
         ),
       ),
    );
  }


}

路由导航组件:

import "package:flutter/material.dart";
import 'package:flutter/rendering.dart';
import "drag.dart";
import 'dart:ui';

import 'page/1.dart';
import 'page/2.dart';
import 'page/3.dart';
import 'xuan.dart';

void main()
{
  runApp(App());
}
class App extends StatelessWidget {
  const App({Key key}) : super(key: key);

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

class App2 extends StatefulWidget {
  App2({Key key}) : super(key: key);

  @override
  _AppState createState() => _AppState();
}

class _AppState extends State<App2> with SingleTickerProviderStateMixin {

  // List _page=[Home3(),Home2(),Home4()];
  // int index=0;
  TabController con;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    con=new TabController(length: 3, vsync: this);
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    con.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
      home:Scaffold(
        appBar:AppBar(
          title: Text('小案例'),
 		  
 		  //导航栏切换
          bottom: TabBar(
            controller: this.con,
            tabs: <Widget>[
              Tab(icon:Icon(Icons.home)),
              Tab(icon:Icon(Icons.category)),
              Tab(icon:Icon(Icons.people))
            ],
          ),
        ),
        
        body:TabBarView(
          controller: this.con,
          children: <Widget>[
            // Text('a'),
            Home3(),
            Home2(),
            Text('c')
          ],
        ),

      //去掉右上角的debug贴纸
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue
      ),
      );
  }
}


class Home extends StatefulWidget {

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  Color dragColor=Colors.orange;

  @override
  Widget build(BuildContext context) {
    return Container(
      // width: double.infinity,
       child:Stack(
         children: <Widget>[
           ConstrainedBox( //约束盒子,添加额外的约束条件到子组件上
              constraints: BoxConstraints.expand(),  //随者子元素扩展
              child: 
              Image.asset("images/2.0x/钢铁侠4.jpg"),

           ),
          
           Center(
             child: ClipRect(
               child: BackdropFilter( //背景过滤器
                   filter: ImageFilter.blur(sigmaX:5.0,sigmaY:5.0),   
                   child: Opacity(
                     opacity: 0.5,
                     child: Container(
                       width: 200.0,
                       height: 200.0,
                       color:Colors.grey.shade200 ,
                       child: Center(
                         child: Text("大Jeff"),
                       ),
                     ),
                   ),
               ),
             ),
           )
         ],
       ),
       
    );
  }
}