按下按钮后,如何获取数据?

问题描述

我是新手,所以正在制作“爱情计算器”。但是我正在从api中获取数据并在后端进行计算。但是我无法通过单击按钮来完成。请帮我这样做。

import 'dart:io';

import 'package:AllInOneCalci/CustomTextField.dart';
import 'package:AllInOneCalci/Post.dart';
import 'package:AllInOneCalci/customAppBar.dart';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'dart:async';

class LoveCalUI extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var AppBarHeight = MediaQuery.of(context).size.height;
    return Scaffold(
      appBar: customAppBar(
        height: (AppBarHeight / 3) * 0.4,child: Row(
          mainAxisAlignment: MainAxisAlignment.center,children: [
            Padding(
              padding: const EdgeInsets.only(top: 18.0),child: Text(
                'Love Calculator',style: TextStyle(
                    color: Colors.black,fontSize: 35.0,fontFamily: 'DancingScript',fontWeight: FontWeight.bold),),],body: CustomFetchData(),);
  }
}

class CustomFetchData extends StatefulWidget {
  @override
  _CustomFetchDataState createState() => _CustomFetchDataState();
}

class _CustomFetchDataState extends State<CustomFetchData> {
  int percentage = 0;
  String result = "";

  TextEditingController firstNameController = new TextEditingController();
  TextEditingController secondNameController = new TextEditingController();

  Future<Post> _getData({String name1,String name2}) async {
    final response = await http.get(
        'https://love-calculator.p.rapidapi.com/getPercentage?fname=$name1&sname=$name2',headers: {
          'x-rapidapi-host': 'love-calculator.p.rapidapi.com','x-rapidapi-key':
              '84e84770b9msh59a96d8b03cb4aap1615a1jsn1cd0efaeedfe',});

    if (response.statusCode == 200) {
      final responseJson = json.decode(response.body);
      setState(() {
        percentage = int.parse(responseJson['percentage']);
        result = responseJson['result'];
      });
    } else {
      throw Exception('Failed to load api');
    }
  }

  Widget ErrorDesign() {
    return Padding(
      padding: const EdgeInsets.all(20.0),child: Container(
        alignment: Alignment.center,child: Text(
          'Error: Kindly Connect to Internet',style: TextStyle(
            color: Colors.redAccent,fontSize: 40.0,fontWeight: FontWeight.bold,);
  }

  Widget FetchedCalculationValues() {
    return Column(
      children: [
        Container(
            child: FutureBuilder<Post>(
                future: _getData(),builder: (BuildContext context,snapshot) {
                  if (snapshot.connectionState == ConnectionState.waiting) {
                    return Center(
                      child: Padding(
                        padding: const EdgeInsets.all(20.0),child: CircularProgressIndicator(),);
                  } else {
                    if (snapshot.hasError) {
                      return Container(
                        child: ErrorDesign(),);
                    } else {
                      return Padding(
                        padding: const EdgeInsets.all(20.0),child: Column(
                          children: [
                            Text('Percentage is $percentage %',style: TextStyle(
                                  color: Colors.black,)),Text('Result is: $result',);
                    }
                  }
                })),);
  }

  @override
  Widget build(BuildContext context) {
    bool visibilitySwitch = false;
    return SingleChildScrollView(
      child: Column(
        children: [
          Padding(
            padding: const EdgeInsets.only(left: 18.0,right: 18.0,top: 15.0),child: CustomTextField('First Name',"",Colors.cyan,Colors.redAccent,firstNameController,firstNameController),Padding(
            padding: const EdgeInsets.only(left: 18.0,right: 18.0),child: CustomTextField(
                'Second Name',Colors.red,Colors.cyanAccent,secondNameController,secondNameController),Padding(
            padding: const EdgeInsets.all(18.0),child: MaterialButton(
                color: Colors.redAccent,child: Text(
                  'Result',style: TextStyle(
                    color: Colors.white,onPressed: () {
                  _getData(
                    name1: firstNameController.text,name2: secondNameController.text,);
                }),Text(
            'Your Score Is: $percentage%',style: TextStyle(
              color: Colors.redAccent,fontSize: 25.0,child: Text(
              '$result',style: TextStyle(
                color: Colors.redAccent,fontSize: 30.0,);
  }

  @override
  // ignore: must_call_super
  void initState() {
    _getData();
  }
}

这里,我只想在单击“结果”按钮后调用FetchedCalculationValues(),但由于圆形的ProgressIndicator仅加载而不显示数据,所以我无法这样做。 显示了数据,但有一些错误:默认情况下,它显示16%的结果,而没有输入单个输入。

请帮助我,以便每当我单击“结果”按钮时,我都会得到一个curcularProgressIndicator,然后是实际结果,并且每当我输入数据时,它都将隐藏先前显示的结果。 谢谢:}

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)