flutter - 弹出框编辑后无法保存日期

标签 flutter save edit

代码如下。 所有包均已导入,没有错误。它添加并保存文本,但在弹出框中编辑后不保存日期。在“保存”部分中,我收到此错误“未处理的异常:类型'bool'不是类型'String'的子类型”。我也尝试过

Navigator.of(context).pop(textField?.controller?.text ?? "");

但这次它会在编辑并保存文本后删除文本。

import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart';
import 'dart:io';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Notepad',
      home: NoteList(),
    );
  }
}

class NoteList extends StatefulWidget {
  @override
  _NoteListState createState() => _NoteListState();
}

class _NoteListState extends State<NoteList> {
  final List<String> _notes = [];
  final TextEditingController _textController = TextEditingController();

  void _loadNotes() async {
    var directory = await getApplicationDocumentsDirectory();
    var file = File("${directory.path}/notes.txt");
    if (!await file.exists()) {
      file.createSync();
      file.writeAsStringSync("Hello, World!\nThis is your first note.\n");
    }
    var contents = await file.readAsString();
    setState(() {
      _notes.addAll(contents.split("\n"));
    });
  }

  void _saveNotes() async {
    var directory = await getApplicationDocumentsDirectory();
    var file = File("${directory.path}/notes.txt");
    var contents = _notes.join("\n");
    await file.writeAsString(contents);
  }

  void _deleteNote(int index) {
    setState(() {
      _notes.removeAt(index);
    });
    _saveNotes();
  }

  @override
  void initState() {
    super.initState();
    _loadNotes();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
        title: Text('Notepad'),
    ),
    body: Column(
    children: [
    Expanded(
    child: ListView.builder(
    itemCount: _notes.length,
    itemBuilder: (context, index) {
    return ListTile(
    title: Text(_notes[index]),
    onTap: () async {
    var result = await showDialog(
    context: context,
    builder: (context) {
    return AlertDialog(
    title: Text("Edit Note"),
    content: TextField(
    controller: TextEditingController(text: _notes[index]),
    autofocus: true,
    ),
    actions: [
    ElevatedButton(
    child: Text("Cancel"),
    onPressed: () => Navigator.of(context).pop(),
    ),
    ElevatedButton(
    child: Text("Save"),
    onPressed: () {
    final TextField? textField = context.findAncestorWidgetOfExactType<TextField>();
    Navigator.of(context).pop(textField != null?.controller?.text);
    },
    ),
    ],
    );
    },
    );
    // update the note with the new text if the user saved their changes
    if (result != null) {
      setState(() {
        _notes[index] = result;
      });
      _saveNotes();
    }
    },
      trailing: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          IconButton(
            icon: Icon(Icons.delete),
            onPressed: () => _deleteNote(index),
          ),
        ],
      ),
    );
    },
    ),
    ),
      Padding(
        padding: const EdgeInsets.all(8.0),
        child: TextField(
          controller: _textController,
          decoration: InputDecoration(
            hintText: "Enter a new note",
          ),
        ),
      ),
      ElevatedButton(
        child: Text("Add Note"),
        onPressed: () {
          setState(() {
            _notes.add(_textController.text);
          });
          _textController.clear();
          _saveNotes();
        },
      ),
    ],
    ),
    );
  }
}

最佳答案

我之前从未在代码中使用过findAncestorWidgetOfExactType,但它是为了查找祖先。但是,当您使用 AlertDialog 时,其内部小部件(如标题、内容和操作)应该是同级小部件。这就是为什么您无法使用此方法找到 TextField。

尝试在 showDialog 的构建器方法中创建一个临时 TextEditingController 并在 TextField 和“保存”按钮中使用它。 像这样

var result = await showDialog(
      context: context,
      builder: (context) {
          TextEditingController temp = TextEditingController(text: _notes[index]);
          return AlertDialog(
               title: Text("Edit Note"),
               content: TextField(
                   controller: temp,
                   autofocus: true,
                ),
                actions: [
                    ElevatedButton(
                       child: Text("Cancel"),
                       onPressed: () => Navigator.of(context).pop(),
                    ),
                    ElevatedButton(
                        child: Text("Save"),
                        onPressed: () {
                           Navigator.of(context).pop(temp.text);
                        },
                    ),
                 ],
           );
      },
   );                    

您可以在此处测试代码 https://dartpad.dev/?id=e75b493dae1287757c5e1d77a0dc73f1

关于flutter - 弹出框编辑后无法保存日期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/74958792/

相关文章:

C# 控制台 - 如何在没有新行的情况下读取 ReadLine()? (或撤消 a\n 或垂直\b)

flutter - currentuser 如何在 flutter 中通过 fcm 向另一个用户发送请求通知?

Flutter video_compress 然后 ffmpeg 将视频修剪到 30 秒失败,日志无穷无尽

javascript - 使用 html2canvas 保存图像 - 纯 Javascript

serialization - 在 React Native 中将 boolean 值存储/保存在 AsyncStorage 中

c++ - 十六进制编辑器如何如此快速地显示数据?

Flutter:扩展与灵活

flutter - 如何在三个容器之间切换

ios - Swift - 使用 Codeable 保存对象会导致应用程序崩溃

c++ - win32 c++ 在没有子类化的编辑控件中检测到 'enter'?