时间戳

首页 > 解决方案 > 如何从导航抽屉颤振中重置任何类的状态？

dart - 如何从导航抽屉颤振中重置任何类的状态？

问题描述

我正在编写一个具有导航抽屉的应用程序每当我尝试从导航抽屉打开一个活动时，我的类第一次成功加载并给我所需的输出，因为我已经编写了从initState方法中从图库中选择图像的代码，它允许我第一次从图库中选择图像。但是，当我再次从导航抽屉中单击同一选项卡时，它不会重置此类的状态，每次再次单击导航抽屉中的同一选项卡时，我都需要访问图像选择代码。这是我的代码。

导航抽屉类

  _getDrawerItemWidget(int pos, String title) {



switch (pos) {
  case 0:
    if(title.contains("From Gallery"))

          return new TextRobo();
    else
      return new TranslateLangue();

    break;
  case 1:
    return new BarCodeRobo();
  case 2:
    return new TranslateLangue();

  default:
    return new Text("Error");
}
}




return new Scaffold(
appBar: new AppBar(
  iconTheme: new IconThemeData(color: Colors.white),
  title: new Text("App title",
    style: new TextStyle(color: Colors.white),),
),

  drawer: new Drawer(
    child: new ListView(
      children: <Widget>[
        new Container( height: 140.0, color: Colors.orange,
        child: new Center(child:
          new Text('App title', style: new TextStyle(color: Colors.white,
          fontSize:25.0, fontWeight: FontWeight.bold),
          ),
        ),
        ),
        new Column(
            children: drawerOptions)
      ],
    ),

  ),
  body: _getDrawerItemWidget(_selectedDrawerIndex, fragment_class  ),
);
}
}

文本机器人类

class TextRobo extends StatefulWidget {

TextRobo1()
{

  createState();
}
  @override
 _TextRoboState createState() => new _TextRoboState();
}

class _TextRoboState extends State<TextRobo> {



 File _imageFile;



 @override
 void initState() {
 // TODO: implement initState
  super.initState();
  _getAndScanImage();

  }

  Future<void> _getAndScanImage() async {
   setState(() {
    _imageFile = null;

  });

  final File imageFile =
  await ImagePicker.pickImage(source: ImageSource.gallery);


 setState(() {
   _imageFile = imageFile;
  });
}

}

标签： dartflutter

解决方案

您可以采取几种不同的方法来执行此操作。但首先 - 您是否按照本教程进行操作？它是......不太好。

主要问题是它没有使用 Flutter 的内置导航机制，而是更改了现有页面。这意味着你无法利用 Flutter 为你做的许多事情。

至于为什么initState只被调用一次，很可能是因为flutter智能为你缓存了widget。由于您的小部件表面上是“相同的”，即使您创建了一个新实例，它也不会费心重新制作状态，而是会以性能的名义使用现有的状态。

我的建议是重新编写和重构。

如果您的应用程序相对简单（即您可以在使用抽屉之间切换的一组页面），则应该这样做：

import 'dart:async';

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  MyAppState createState() {
    return new MyAppState();
  }
}

class MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      initialRoute: pageName(Pages.red),
      routes: {
        pageName(Pages.red): (context) => PageBase(title: pageName(Pages.red), page: ColouredPage(color: Colors.red)),
        pageName(Pages.green): (context) =>
            PageBase(title: pageName(Pages.green), page: ColouredPage(color: Colors.green)),
        pageName(Pages.blue): (context) =>
            PageBase(title: pageName(Pages.blue), page: ColouredPage(color: Colors.blue)),
      },
      // not actually used, needed in case flutter started with intent specifying unsupported route
      home: Container(),
    );
  }
}

enum Pages { red, green, blue }

String pageName(Pages page) {
  switch (page) {
    case Pages.red:
      return "Red";
    case Pages.green:
      return "Green";
    case Pages.blue:
      return "Blue";
  }
}

class PageBase extends StatelessWidget {
  final String title;
  final Widget page;

  const PageBase({Key key, @required this.page, @required this.title}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(title)),
      body: page,
      drawer: Drawer(
        child: ListView(
          children: [
            ListTile(
              title: Text(pageName(Pages.red)),
              onTap: () {
                Navigator.of(context).popAndPushNamed(pageName(Pages.red));
              },
            ),
            ListTile(
              title: Text(pageName(Pages.blue)),
              onTap: () {
                Navigator.of(context).popAndPushNamed(pageName(Pages.blue));
              },
            ),
            ListTile(
              title: Text(pageName(Pages.green)),
              onTap: () {
                Navigator.of(context).popAndPushNamed(pageName(Pages.green));
              },
            )
          ],
        ),
      ),
    );
  }
}

class ColouredPage extends StatefulWidget {
  final Color color;

  const ColouredPage({Key key, this.color}) : super(key: key);

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

class _ColouredPageState extends State<ColouredPage> {
  Color color;

  @override
  void initState() {
    super.initState();
    color = Colors.white;
    new Timer(Duration(seconds: 2), () {
      setState(() {
        color = widget.color;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: color,
    );
  }
}

如果您将页面推送到现有页面之一的顶部然后最终返回，则可以Navigator.push()在它返回时使用处理程序，然后重新触发您的函数。

推荐阅读