flutter 如何在屏幕2上编辑姓名并使新姓名出现在屏幕1上?

gudnpqoy  于 2023-02-05  发布在  Flutter
关注(0)|答案(1)|浏览(136)

这几天我开始学习Flutter,我顺利地制作了这个教程的应用程序。
我设法创建了一个按钮,从列表和卡片可视化切换,一个图标,删除了一个词,而不是显示无限的话,现在只显示20个词。但现在我想创建另一个屏幕通过命名路线,在这个屏幕上,你可以编辑你在screen1点击的名称,例如:

但是我在尝试做这件事时遇到了很多麻烦。我设法创建了screen2、textform和route,但是更改名称的部分仍然让我有点头疼。
有人能帮帮我吗?这是密码:

import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Startup Names',
      initialRoute: '/',
      routes: {
        '/': (context) => const RandomWords(),
        EditScreen.routeName: (context) => EditScreen(),
      },
    );
  }
}

class RandomWords extends StatefulWidget {
  const RandomWords({super.key});

  @override
  State<RandomWords> createState() => _RandomWordsState();
}

class _RandomWordsState extends State<RandomWords> {
  final _suggestions = <WordPair>[];
  final _saved = <WordPair>{};
  final _biggerFont = const TextStyle(fontSize: 20);
  String selected = '';
  bool isList = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text('Startup Names'),
          actions: [
            IconButton(
              icon: const Icon(Icons.bookmark_border_sharp),
              onPressed: _pushSaved,
              tooltip: 'Favorites',
            ),
            IconButton(
              icon:
                  isList ? const Icon(Icons.grid_view) : const Icon(Icons.list),
              onPressed: () {
                setState(() {
                  isList = !isList;
                });
              },
              tooltip: isList ? 'Card mode' : 'List mode',
            ),
          ],
        ),
        body: isList ? lista() : cards());
  }

  Widget lista() {
    return ListView.builder(
      padding: const EdgeInsets.all(16.0),
      itemCount: 40,
      itemBuilder: (context, i) {
        if (i.isOdd) return const Divider();

        final index = i ~/ 2;
        if (index >= _suggestions.length) {
          _suggestions.addAll(generateWordPairs().take(10));
        }

        return favorites(_suggestions[index], index);
      },
    );
  }

  Widget cards() {
    return GridView.builder(
        padding: const EdgeInsets.all(16.0),
        itemCount: 20,
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 2,
            crossAxisSpacing: 5,
            mainAxisSpacing: 5,
            mainAxisExtent: 100),
        itemBuilder: (context, i) {
          if (i >= _suggestions.length) {
            _suggestions.addAll(generateWordPairs().take(10));
          }

          return Card(child: favorites(_suggestions[i], i));
        });
  }

  Widget favorites(WordPair pair, int index) {
    final alreadySaved = _saved.contains(pair);
    return ListTile(
        title: Text(
          pair.asPascalCase,
          style: _biggerFont,
        ),
        trailing: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            IconButton(
              icon: Icon(alreadySaved ? Icons.favorite : Icons.favorite_border),
              color: alreadySaved ? Colors.red : null,
              tooltip: alreadySaved ? 'Remove favorite' : 'Favorite',
              onPressed: () {
                setState(() {
                  if (alreadySaved) {
                    _saved.remove(pair);
                  } else {
                    _saved.add(pair);
                  }
                });
              },
            ),
            IconButton(
              icon: const Icon(Icons.delete),
              color: Colors.black87,
              tooltip: 'Remove from list',
              onPressed: () {
                setState(() {
                  _suggestions.remove(pair);
                  _saved.remove(pair);
                });
              },
            ),
          ],
        ),
        onTap: () {
          selected = pair.asPascalCase;
          Navigator.pushNamed(context, '/second',
              arguments: Argumentos(index, selected));
        });
  }

  void _pushSaved() {
    Navigator.of(context).push(
      MaterialPageRoute<void>(
        builder: (context) {
          final tiles = _saved.map(
            (pair) {
              return ListTile(
                title: Text(
                  pair.asPascalCase,
                  style: _biggerFont,
                ),
              );
            },
          );

          final divided = tiles.isNotEmpty
              ? ListTile.divideTiles(
                  context: context,
                  tiles: tiles,
                ).toList()
              : <Widget>[];

          return Scaffold(
            appBar: AppBar(
              title: const Text('Favorites'),
            ),
            body: ListView(children: divided),
          );
        },
      ),
    );
  }
}

class EditScreen extends StatefulWidget {
  static const routeName = '/second';
  const EditScreen({super.key});

  @override
  State<EditScreen> createState() => _EditScreenState();
}

class _EditScreenState extends State<EditScreen> {
  final first = TextEditingController();
  final second = TextEditingController();

  @override
  Widget build(BuildContext context) {
    final argumentos = ModalRoute.of(context)?.settings.arguments as Argumentos;
    String selected = argumentos.name;
    return Scaffold(
        appBar: AppBar(
          title: Text('Edit word'),
        ),
        body: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              const Text("What's the new name?",
                  style: TextStyle(fontSize: 30)),
              const SizedBox(height: 30),
              Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 100, vertical: 16),
                child: TextFormField(
                  controller: first,
                  decoration: const InputDecoration(
                    border: OutlineInputBorder(),
                    labelText: 'First part of the name',
                  ),
                ),
              ),
              Padding(
                padding:
                    const EdgeInsets.symmetric(horizontal: 100, vertical: 16),
                child: TextFormField(
                  controller: second,
                  decoration: const InputDecoration(
                    border: OutlineInputBorder(),
                    labelText: 'Second part of the name',
                  ),
                ),
              ),
              const SizedBox(height: 20),
              ElevatedButton(
                child: const Text('Change it'),
                onPressed: () {
                  selected = (WordPair(first.text, second.text)).toString();
                  Navigator.pushNamed(context, '/');
                },
              ),
            ],
          ),
        ));
  }
}

class Argumentos {
  final int id;
  final String name;

  Argumentos(this.id, this.name);
}
dojqjjoe

dojqjjoe1#

您可以使用. then()和update value。
失效日期:

Navigator.pushNamed(context, '/second',
    arguments: Argumentos(index, selected)).then((value) {
    setState(() { // update ui
    // update value here;    
    });});

则():https://api.flutter.dev/flutter/dart-async/Future/then.html

相关问题