Question

我有一个带有列表的页面和一个到达详细信息页面的栏。我想在详细信息页面上添加一个弹出窗口以检索项目并将其保存到待办事项页面，但是我的详细信息页面有问题。

有了无状态，我没有后顾之忧，但是，如果我没记错的话，我需要一个有状态的来添加Future，showDialog ..但是，我的索引有问题...在那里，我迷路了...

有人可以给我一个曲目或解释吗？

谢谢

home.dart

import 'dart:core';
import 'package:flutter/material.dart';
import 'package:test_todo_list/DataList.dart';
import 'package:test_todo_list/detail.dart';

class Home extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Liste Items'),
        actions: <Widget>[
          IconButton(icon: Icon(Icons.search),
              onPressed: () {
                showSearch(context: context, delegate: DataSearch(listWords));
              })
        ],
      ),
      body: ListView.separated(
        itemCount: listWords.length,
        separatorBuilder: (BuildContext context, int i) =>
            Divider(color: Colors.grey),
        itemBuilder: (context, i) {
          return ListTile(
            onTap: () {
              Navigator.push(
                context,MaterialPageRoute(
                builder: (context) => Detail(listWordsDetail: listWords[i]),
              ),
              );
            },
            title: RichText(
                textAlign:TextAlign.left,
                text: TextSpan(
                    children:<TextSpan>[
                      TextSpan(
                        text:listWords[i].titlelist,
                        style:Theme.of(context).textTheme.title.merge(TextStyle(color: Colors.blueGrey)),
                      ),

                    ]
                )
            ),
            subtitle: Text(listWords[i].definitionlist,
              style: Theme.of(context).textTheme.subtitle.merge(
                  TextStyle(fontStyle: FontStyle.italic, color: Colors.grey)),
            ),
            trailing: Icon(Icons.arrow_forward_ios, color: Colors.grey),
          );
        },
      ),
    );
  }
}
class DataSearch extends SearchDelegate<String> {

  final List<ListWords> listWords;

  DataSearch(this.listWords);

  @override
  List<Widget> buildActions(BuildContext context) {
    //Actions for app bar
    return [IconButton(icon: Icon(Icons.clear), onPressed: () {
      query = '';
    })];
  }

  @override
  Widget buildLeading(BuildContext context) {
    //leading icon on the left of the app bar
    return IconButton(
        icon: AnimatedIcon(icon: AnimatedIcons.menu_arrow,
          progress: transitionAnimation,
        ),
        onPressed: () {
          close(context, null);
        });
  }

  @override
  Widget buildResults(BuildContext context) {
    // show some result based on the selection
    final suggestionList = listWords;

    return ListView.builder(itemBuilder: (context, index) => ListTile(

      title: Text(listWords[index].titlelist),
      subtitle: Text(listWords[index].definitionlist),
    ),
      itemCount: suggestionList.length,
    );
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    // show when someone searches for something

    final suggestionList = query.isEmpty
        ? listWords
        : listWords.where((p) => p.titlelist.contains(RegExp(query, caseSensitive: false))).toList();


    return ListView.builder(itemBuilder: (context, index) => ListTile(
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => Detail(listWordsDetail: suggestionList[index]),
          ),
        );
      },
      trailing: Icon(Icons.remove_red_eye),
      title: RichText(
        text: TextSpan(
            text: suggestionList[index].titlelist.substring(0, query.length),
            style: TextStyle(
                color: Colors.red, fontWeight: FontWeight.bold),
            children: [
              TextSpan(
                  text: suggestionList[index].titlelist.substring(query.length),
                  style: TextStyle(color: Colors.grey)),
            ]),
      ),
    ),
      itemCount: suggestionList.length,
    );
  }
}

detail.dart

import 'package:flutter/material.dart';
import 'package:test_todo_list/DataList.dart';

class Detail extends StatefulWidget {

  Detail({Key key, @required this.listWordsDetail}) : super(key: key);
  final ListWords listWordsDetail;

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

  class _DetailState extends State<Detail> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          brightness: Brightness.dark,
          title: const Text('Détails', style: TextStyle(color: Colors.white)),
          iconTheme: IconThemeData(color: Colors.white),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(listWordsDetail.titlelist +' (on detail page)',
                style:Theme.of(context).textTheme.title.merge(TextStyle(color: Colors.blueGrey)),
              ),
              Text(listWordsDetail.definitionlist,
                style: Theme.of(context).textTheme.subtitle.merge(
                  TextStyle(fontStyle: FontStyle.italic, color: Colors.grey)),
        ),
              Container(
                padding: EdgeInsets.all(40.0),
                child: GestureDetector(
                  onTap: () {

                  },
                  child: Icon(Icons.add_shopping_cart),
                ),

              )
            ],
          ),
        )
    );
  } 
}

DataList.dart

List<ListWords>  listWords = [
  ListWords('oneWord', 'OneWord definition'),
  ListWords('twoWord', 'TwoWord definition.'),
  ListWords('TreeWord', 'TreeWord definition'),
];

class ListWords {
  String titlelist;
  String definitionlist;

  ListWords(String titlelist, String definitionlist) {
    this.titlelist = titlelist;
    this.definitionlist = definitionlist;
  }
}

Answer 1

在网络上搜索后，偶然发现了无法解释的解决方案，但它正在起作用...

import 'package:flutter/material.dart';
import 'package:test_todo_list/DataList.dart';
import 'package:test_todo_list/todo_list.dart';

class Detail extends StatefulWidget {

  const Detail({Key key, this.listWordsDetail}) : super (key: key);
  final ListWords listWordsDetail;

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

class _DetailState extends State<Detail> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          brightness: Brightness.dark,
          title: const Text('Détails', style: TextStyle(color: Colors.white)),
          iconTheme: IconThemeData(color: Colors.white),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(widget.listWordsDetail.titlelist),
              Text(widget.listWordsDetail.definitionlist),
              Container(
                padding: EdgeInsets.all(40.0),
                child: GestureDetector(
                  onTap: () {
                    //open Dialog addTodoList()
                  },
                  child: Icon(Icons.add_shopping_cart),
                ),
              )
            ],
          ),
        )
    );
  }


  Future<Null> addTodoList() async {
    showDialog(context: context);
    //... à construire
  }
}

颤振列表，详细信息页面和待办事项

1 个答案: