坚持能够从颤振应用程序的列表中查看详细信息

Question

我在实时数据库中有一个响亮的信息，格式例如：

 record
      0
        Club: "Club1"
        Name: "Ronaldo"
        Place: "London"
        date:  "25.07.2020"
        email: "flutter@gmail.com"
        phone: "12345678"

我创建了一个包含名称和俱乐部的列表，我想通过单击名称来根据表单访问完整信息，但我无法编写代码。请帮助新程序员

import 'package:firebase_database/firebase_database.dart';
import 'package:flutter/material.dart';
import 'package:.../anketa/tile.dart';


class Anketa extends StatefulWidget {
  Anketa({Key key, this.title}) : super(key: key);
  final String title;

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

class _AnketaState extends State<Anketa> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(

      body: Center(
          child: SingleChildScrollView(
            child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Text("Registration form",
                      style: TextStyle(
                          fontWeight: FontWeight.w200,
                          fontSize: 30,
                          fontFamily: 'Roboto',
                          fontStyle: FontStyle.italic)),
                  RegisterStudent(),
                ]),
          )),
    );
  }
}

class RegisterStudent extends StatefulWidget {
  RegisterStudent({Key key}) : super(key: key);

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

class _RegisterStudentState extends State<RegisterStudent> {
  final _formKey = GlobalKey<FormState>();
  final listOfClubs = ["Club1", "Club2", "Club3", "Club4"];
  String dropdownValue = "Club1";
  final clubController = TextEditingController();
  final nameController = TextEditingController();
  final placeController = TextEditingController();
  final dateController = TextEditingController();
  final emailController = TextEditingController();
  final phoneController = TextEditingController();
  final rawController = TextEditingController();

  final dbRef = FirebaseDatabase.instance.reference().child("record");



  @override
  Widget build(BuildContext context) {
    return Form(
        key: _formKey,
        child: SingleChildScrollView(
            child: Column(children: <Widget>[
              Padding(
                padding: EdgeInsets.all(20.0),
                child: TextFormField(
                  controller: nameController,
                  decoration: InputDecoration(
                    labelText: "EnterName",
                    enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(10.0),
                    ),
                  ),
                  // The validator receives the text that the user has entered.
                  validator: (value) {
                    if (value.isEmpty) {
                      return "Enter name";
                    }
                    return null;
                  },
                ),
              ),
              Padding(
                padding: EdgeInsets.all(20.0),
                child: DropdownButtonFormField(
                  value: dropdownValue,
                  icon: Icon(Icons.arrow_downward),
                  decoration: InputDecoration(
                    labelText: "Club",
                    enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(10.0),
                    ),
                  ),
                  items: listOfClubs.map((String value) {
                    return new DropdownMenuItem<String>(
                      value: value,
                      child: new Text(value),
                    );
                  }).toList(),
                  onChanged: (String newValue) {
                    setState(() {
                      this.dropdownValue = newValue;
                    });
                  },
                  validator: (value) {
                    if (value.isEmpty) {
                      return 'Club';
                    }
                    return null;
                  },
                ),
              ),
              Padding(
                padding: EdgeInsets.all(20.0),
                child: TextFormField(
                  keyboardType: TextInputType.number,
                  controller: dateController,
                  decoration: InputDecoration(
                    labelText: "Date",
                    enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(10.0),
                    ),
                  ),
                  // The validator receives the text that the user has entered.
                  validator: (value) {
                    if (value.isEmpty) {
                      return 'Date';
                    }
                    return null;
                  },
                ),
              ),
              Padding(
                  padding: EdgeInsets.all(20.0),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: <Widget>[
                      RaisedButton(
                        color: Colors.lightBlue,
                        onPressed: () {
                          if (_formKey.currentState.validate()) {
                            dbRef.push().set({
                              "Name": nameController.text,
                              "date": dateController.text,
                              "Club": dropdownValue
                            }).then((_) {
                              Scaffold.of(context).showSnackBar(
                                  SnackBar(content: Text('Add')));
                              dateController.clear();
                              nameController.clear();
                            }).catchError((onError) {
                              Scaffold.of(context)
                                  .showSnackBar(SnackBar(content: Text(onError)));
                            });
                          }
                        },
                        child: Text('Enter'),
                      ),
                      RaisedButton(
                        color: Colors.amber,
                        onPressed: () {
                          Navigator.push(
                            context,
                            MaterialPageRoute(builder: (context) => ListOfNames()),
                          );
                        },
                        child: Text('Go to'),
                      ),
                    ],
                  )),
            ])));
  }

  @override
  void dispose() {
    super.dispose();
    dateController.dispose();
    nameController.dispose();
  }
}

这是带有列表的第二页，我想从中找到完整信息

    import 'package:flutter/material.dart';
    import 'package:firebase_database/firebase_database.dart';
    
    class ListOfNames extends StatelessWidget {
      final dbRef = FirebaseDatabase.instance.reference().child("record");
      List<Map<dynamic,dynamic>> lists = List();
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            backgroundColor: Colors.grey.shade300,
            appBar: AppBar(
              backgroundColor: Colors.deepPurple,
              title: Text("List of students"),
            ),
            body: StreamBuilder(
                stream: dbRef.onValue,
                builder: (context, AsyncSnapshot<Event> snapshot) {
                  if (snapshot.hasData) {
                    lists.clear();
                    DataSnapshot dataValues = snapshot.data.snapshot;
                    Map<dynamic, dynamic> values = dataValues.value;
                    values.forEach((key, values) {
                      lists.add(values);
                    });
                    return new ListView.builder(
                        shrinkWrap: true,
                        itemCount: lists.length,
                        itemBuilder: (BuildContext context, int index) {
itemBuilder: (BuildContext context, int index) {
                      return ListTile(
                            title:Text(lists[index]["Name"], style: TextStyle(height: 2.5, fontSize:20.0),),
                            subtitle:Text(lists[index]['Club'], style: TextStyle(fontSize:16.0),),
                        onTap: (){

// in this line i have a problem...
 Navigator.push(context, MaterialPageRoute(builder: (context) => DetailPage(snapshot.data[index]['Name']),
                              )
                              );
                        },
                      );
                    });
              }
                  return CircularProgressIndicator();
                })
        );
      }
    }

我想创建这样一个页面：

class DetailPage extends StatelessWidget {

  List<Map<dynamic,dynamic>> data ;
  DetailPage ({this.data});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(data.name),

// here I want to show the all  information from the form about one person from the list
      ),
    );
  }
}

Answer 1

在“DetailsPage”的脚手架主体中，使用“Card”小部件和“Text”小部件来显示信息。 Like Card(child:Text('${data.clubLoc}').