从json获取数据并将其放入TextFields

时间:2019-09-12 10:41:28

标签: flutter dart

亲爱的

我是Dart和flutter的新开发人员,也正在移动应用程序中。

我正在从NFC数据(如下所示的加密数据

)中获取数据

“ $ 2y $ 10 $ Mo.iv5mePQFyDezZpFhtR.y8HWNlOndhV4gIY // x18XhP1OarCpti”

),然后通过API发送此加密数据,以获取学生的信息,例如JSON

[{"id":1,"STUDENT_ID":1,"COURSE":"GOL","HASH":"$2y$10$Mo.iv5mePQFyDezZpFhtR.y8HWNlOndhV4gIY\/\/x18XhP1OarCpti","created_at":"2019-09-11 12:24:03","FNAME":"Mohammad","MNAME":"Ahmad","LNAME":"KASSAB","STATE":"Nabatyeh","CITY":"Kafarchuba","NUMBER":82381,"QRCODE":"123456789"}]

在我的窗口小部件中,每个字段(FNAME,LNAME ...)都有一个文本字段,我需要在TextFields中插入JSON数据。

请问该怎么做?

这是我班的学生。飞镖

class Student {
  String fname;
  String mname;
  String lname;
  String number;
  String course;

  Student(
      {this.fname,
      this.mname,
      this.lname,
      this.number,
      this.course
      });

  factory Student.fromJson(json) {
    return Student(
        fname: json["FNAME"],
        mname: json["MNAME"],
        lname: json["LNAME"],
        number: json["NUMBER"],
        course: json["COURSE"]);
  }
}

主.dart

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter_nfc_reader/flutter_nfc_reader.dart';
import 'package:http/http.dart' as http;
import './student.dart' ;

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Read NFC',
      home: new MyHomePage(),
    );
  }
}

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

  final String title;

  final Map<String, dynamic> pluginParameters = {};

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

class _MyHomePageState extends State<MyHomePage> {
  String s = '';
  var fname = TextEditingController();
  var lname = TextEditingController();
  var mname = TextEditingController();
  var number = TextEditingController();
  var course = TextEditingController();
  List ss = [];
  Future<List> jso;

  Future<List<Student>> getData(String hash) async {
    List<Student> list;
    var response = await http.get(
      Uri.encodeFull("http://209.97.178.237/NFC/public/getHash?hash="+hash),
      headers: {
        "Accept": "application/json"
      }
    );
    if (response.statusCode == 200) {
        var data = json.decode(response.body);
        var rest = data as List;
        print(rest);
        list = rest.map<Student>((json) => Student.fromJson(json)).toList();
      }
       return list;
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: const Text('NFC READER'),
      ),
      body: Container(
        margin: EdgeInsets.all(50),
        width: double.infinity,
        child: Column(
          children: <Widget>[
            new Container(
              margin: const EdgeInsets.fromLTRB(10, 10, 10, 40),
              child: new RaisedButton(
                child: Text("Read NFC"),
                onPressed: () {
                  FlutterNfcReader.read().then((response) {
                    setState(() {
                      print(response.content);
                      //response.content is the NFC result;
                     // here what to do ? 
                    });
                  });
                },
                color: Colors.red,
                textColor: Colors.white,
                padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
                splashColor: Colors.grey,
              ),
            ),
            new Text(
              s,
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'First Name',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Middle Name',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Last Name',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Number',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
            Padding(
              padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
              child: TextFormField(
                decoration: InputDecoration(
                  labelText: 'Course',
                  fillColor: Colors.white,
                  border: new OutlineInputBorder(
                    borderRadius: new BorderRadius.circular(15.0),
                  ),
                ),
                readOnly: true,
                controller: fname,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

谢谢。

1 个答案:

答案 0 :(得分:0)

您可以做的就是向控制器提供Student对象的每个属性,像这样

FlutterNfcReader.read().then((response) {
  // create your Student object here with the data received from the api
  Student student = ...
  setState(() {
    // supply the controllers with the data of the student object
    fname.text = student.fname;
    ...
  });
});

之后,您可以使用控制器填充TextFormField

Padding(
  padding: EdgeInsets.only(top: 0, bottom: 25.0, left: 0, right: 0),
  child: TextFormField(
    // here is where you fill the TextFormField
    controller: fname,
    decoration: InputDecoration(
      labelText: 'First Name',
      fillColor: Colors.white,
      border: new OutlineInputBorder(
        borderRadius: new BorderRadius.circular(15.0),
      ),
    ),
    readOnly: true,
  ),
),