为什么在Textfield中设置状态无效?

时间:2020-03-13 22:26:25

标签: flutter dart

我想使用文本字段,但是它不起作用。 Visual Studio总是显示错误,我不知道为什么。字符串userText是静态的,因为Visual Studio Code希望这样做。我什至不知道什么是静态的。

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home: Home()));

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {

  double mph;
  int _currentIndex = 0;
  static String userText = '';
  final _pageOptions = [
    Center(
      child: Column(
        children: <Widget>[
          Container(
            padding: const EdgeInsets.all(8.0),
            margin: EdgeInsets.only(bottom: 20.0),
            child: Text(
              'Km/h',
              style: TextStyle(
                fontSize: 25.0,
                fontWeight: FontWeight.bold,
                color: Colors.blue[400],
              ),
            ),
          ),
          TextField(
            decoration: InputDecoration(
              hintText: 'Km/h',
              focusColor: Colors.green[400],
            ),
            onSubmitted: (String e){
              setState(() {
                userText = e;
              });
            },
          ),
          Container(
            margin: EdgeInsets.only(top: 10.0),
            child: Text(
              userText,
              style: TextStyle(
                fontStyle: FontStyle.italic,
                fontSize: 20.0,
              )
            ),
          )
        ]
      )
    ),
    Text('Suche'),
    Text('Kamera'),
    Text('Profil'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Test"),
        backgroundColor: Colors.green[400],
      ),
      body: _pageOptions[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _currentIndex,
        iconSize: 30,
        items: [
          BottomNavigationBarItem(
              icon: Icon(Icons.home),
              title: Text("Home"),
              backgroundColor: Colors.blue[400],
          ),
          BottomNavigationBarItem(
              icon: Icon(Icons.search),
              title: Text("Suche"),
              backgroundColor: Colors.green[400],
          ),
          BottomNavigationBarItem(
              icon: Icon(Icons.camera_alt),
              title: Text("Kamera"),
              backgroundColor: Colors.orange[400]
          ),
          BottomNavigationBarItem(
              icon: Icon(Icons.person),
              title: Text("Profile"),
              backgroundColor: Colors.purple[400]
          ),
        ],
        onTap: (index){
          setState(() {
            _currentIndex = index;
          });
        },
      ),
    );
  }
}

1 个答案:

答案 0 :(得分:1)

简短答案:

您正在将其初始化为实例变量,因此不能在其中使用setState

final _pageOptions = [...]; // incorrect way

您可以简单地使用getter并在其中使用setState。喜欢:

List<Widget> get _pageOptions => [...]; // correct way

完整答案:

void main() => runApp(MaterialApp(home: Home()));

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  double mph;
  int _currentIndex = 0;
  static String userText = '';
  List<Widget> get _pageOptions => [
    Center(
        child: Column(
            children: <Widget>[
              Container(
                padding: const EdgeInsets.all(8.0),
                margin: EdgeInsets.only(bottom: 20.0),
                child: Text(
                  'Km/h',
                  style: TextStyle(
                    fontSize: 25.0,
                    fontWeight: FontWeight.bold,
                    color: Colors.blue[400],
                  ),
                ),
              ),
              TextField(
                decoration: InputDecoration(
                  hintText: 'Km/h',
                  focusColor: Colors.green[400],
                ),
                onSubmitted: (String e){
                  setState(() {
                    userText = e;
                  });
                },
              ),
              Container(
                margin: EdgeInsets.only(top: 10.0),
                child: Text(
                    userText,
                    style: TextStyle(
                      fontStyle: FontStyle.italic,
                      fontSize: 20.0,
                    )
                ),
              )
            ]
        )
    ),
    Text('Suche'),
    Text('Kamera'),
    Text('Profil'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Test"),
        backgroundColor: Colors.green[400],
      ),
      body: _pageOptions[_currentIndex],
      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _currentIndex,
        iconSize: 30,
        items: [
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text("Home"),
            backgroundColor: Colors.blue[400],
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.search),
            title: Text("Suche"),
            backgroundColor: Colors.green[400],
          ),
          BottomNavigationBarItem(
              icon: Icon(Icons.camera_alt),
              title: Text("Kamera"),
              backgroundColor: Colors.orange[400]
          ),
          BottomNavigationBarItem(
              icon: Icon(Icons.person),
              title: Text("Profile"),
              backgroundColor: Colors.purple[400]
          ),
        ],
        onTap: (index){
          setState(() {
            _currentIndex = index;
          });
        },
      ),
    );
  }
}