4

我刚开始学习颤振,我使用有状态的小部件下面的代码是 main.dart 文件

void main() {
  runApp(App());
}

class App extends StatefulWidget {
  @override
  _AppState createState() => _AppState();
}

class _AppState extends State<App> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: new Scaffold(backgroundColor: Colors.blueGrey.shade100,
      body: Home.Homescreen(HomeText: "default",), //initially setting text to default
      appBar: new AppBar(
        centerTitle: true,
        title: new Text("newApp",
            textDirection: TextDirection.ltr,
            style: TextStyle(fontSize:20 ,color: Colors.white)),
      ),
      bottomNavigationBar: new BottomNavigationBar(items: [
        new BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: new Text(
              "Home",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.face),
            title: new Text(
              "Profile",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.exit_to_app),
            title: new Text(
              "Exit",
              textDirection: TextDirection.ltr,
            )),
      ],onTap: (int item){
        if(item == 0){
          setState(() {
            Home.Homescreen(HomeText:'this is home'); /* this should change homescreen text but it still says default same for all the below as well*/
          });
        }
        else if(item == 1){
          setState(() {
            Home.Homescreen(HomeText:'this is proile');
          });

        }
        else if(item == 2){
          setState(() {
            Home.Homescreen(HomeText:'this is exit');
          });
        }
      },),
    ));
  }
}

在此调用了一个无状态小部件“App”,并且在 Scaffold 中的 _AppState 中,主体被分配给一个无状态小部件“HomeScreen”,该无状态小部件“HomeScreen”在底部导航栏下的 main 中导出为主页,这些项目被分配一个 int,在点击时应该更改 HomeText因此,但它没有更新,它在主屏幕上保持不变,只是说“默认”,这是它最初被调用的,下面的代码是 home_screen.dart 被称为

class Homescreen extends StatefulWidget{
  Homescreen({this.HomeText}); // init hometext
  String HomeText;
  @override
  _Homescreen createState() => _Homescreen();

}

class _Homescreen extends State<Homescreen>{

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new Center(
      child: new Column(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[
          new Text(
            widget.HomeText, // this is what should be updated when called
            textDirection: TextDirection.ltr,
            style: new TextStyle(fontSize: 30,color: Colors.black),
          )
        ],
      ),
    );
  }
}

我不明白为什么当点击图标(底部导航条)时主页文本没有更新,我已经使用调试打印测试了它们返回 0,1,2 的值。所以,这至少是正确的。

4

3 回答 3

4

尝试传递一个密钥,我相信它应该可以帮助你:

Home.Homescreen(HomeText:'this is proile', key: key: ValueKey('this is proile') );

添加密钥并将其传递给主屏幕中的超级:

class Homescreen extends StatefulWidget{
  Homescreen({Key key, this.HomeText}) : super(key: key); // init hometext
  String HomeText;

  @override
  _Homescreen createState() => _Homescreen();

}

key 应该是唯一的,让它知道它应该更新。这里有几个关于 statefull 小部件和键的链接:

https://api.flutter.dev/flutter/widgets/StatefulWidget-class.html

https://www.youtube.com/watch?v=kn0EOS-ZiIc&app=desktop

https://medium.com/@ayushpguptaapg/using-keys-in-flutter-1c5fb586b2a5

于 2020-04-19T20:04:59.530 回答
0

试试下面的代码:

void main() {
  runApp(App());
}

class App extends StatefulWidget {
  @override
  _AppState createState() => _AppState();
}

class _AppState extends State<App> {
  @override
  String homeText = "default";
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: new Scaffold(backgroundColor: Colors.blueGrey.shade100,
      body: Home.Homescreen(HomeText: homeText,), //initially setting text to default
      appBar: new AppBar(
        centerTitle: true,
        title: new Text("newApp",
            textDirection: TextDirection.ltr,
            style: TextStyle(fontSize:20 ,color: Colors.white)),
      ),
      bottomNavigationBar: new BottomNavigationBar(items: [
        new BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: new Text(
              "Home",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.face),
            title: new Text(
              "Profile",
              textDirection: TextDirection.ltr,
            )),
        new BottomNavigationBarItem(
            icon: Icon(Icons.exit_to_app),
            title: new Text(
              "Exit",
              textDirection: TextDirection.ltr,
            )),
      ],onTap: (int item){
        if(item == 0){
          setState(() {
            homeText = "this is home"; 
          });
        }
        else if(item == 1){
          setState(() {
            homeText = "this is profile";
          });

        }
        else if(item == 2){
          setState(() {
            homeText = "this is exit";
          });
        }
      },),
    ));
  }
}

你遇到的问题是当你调用 setState 时你并没有改变你的身体。当 build 方法运行时,它总是具有相同的主体。使用上面的代码,您更新 homeText 值,并且当 build 方法运行时, homeText 有一个新值并且您的文本被更新。

于 2020-04-19T19:50:19.650 回答
0
class _AppState extends State<App> {
  String textToDisplay = 'default';
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return MaterialApp(
        home: new Scaffold(backgroundColor: Colors.blueGrey.shade100,
          body: Homescreen(HomeText: textToDisplay,), //initially setting text to default
          appBar: new AppBar(
            centerTitle: true,
            title: new Text("newApp",
                textDirection: TextDirection.ltr,
                style: TextStyle(fontSize:20 ,color: Colors.white)),
          ),
          bottomNavigationBar: new BottomNavigationBar(items: [
            new BottomNavigationBarItem(
                icon: Icon(Icons.home),
                title: new Text(
                  "Home",
                  textDirection: TextDirection.ltr,
                )),
            new BottomNavigationBarItem(
                icon: Icon(Icons.face),
                title: new Text(
                  "Profile",
                  textDirection: TextDirection.ltr,
                )),
            new BottomNavigationBarItem(
                icon: Icon(Icons.exit_to_app),
                title: new Text(
                  "Exit",
                  textDirection: TextDirection.ltr,
                )),
          ],onTap: (int item){
            if(item == 0){
              setState(() {
               textToDisplay= 'this is home'; /* this should change homescreen text but it still says default same for all the below as well*/
              });
            }
            else if(item == 1){
              setState(() {
               textToDisplay = 'this is proile';
              });

            }
            else if(item == 2){
              setState(() {
                textToDisplay = 'this is exit';
              });
            }
          },),
        ));
  }
}

注意:不要将 HomeWidget 导出为 home 只需简单地导入它所在的文件并使用简单的类名

还可以在此处此处查看一些颤振基础教程和文档,例如首先熟悉颤振系统。

于 2020-04-19T19:56:57.003 回答