2

I have created a list of the widgets using JSON data, I have five types of widgets, and each widget is added to the list depending on the JSON data, but the issue is with the widget includes a text field, All widget displays ok but once I click on the text field the keyboard appears and disappears immediately and gives this error "Exception caught by widgets library" => "Incorrect use of ParentDataWidget."

I try removing everything and adding just this text field widget in the list, but it still not working right. Please guide me on where am doing wrong.

import 'dart:io';
import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:my_car/AppUI/CustomWidgets/DateQuestionBox.dart';
import 'package:my_car/AppUI/CustomWidgets/MultiSelectQuestionBox.dart';
import 'package:my_car/AppUI/CustomWidgets/RadioQuestionBox.dart';
import 'package:my_car/AppUI/CustomWidgets/SelectQuestionBox.dart';
import 'package:my_car/AppUI/CustomWidgets/TextQuestionBox.dart';

import 'package:my_car/LocalData/AppColors.dart';
import 'package:flutter/services.dart';
import 'package:my_car/Models/MyClaimQuestionsResponse.dart';
import 'package:my_car/Models/VehiclesResponse.dart';
import 'package:shared_preferences/shared_preferences.dart';

import '../../Models/VehiclesResponse.dart';

class SubmitClaimQuestionsPage extends StatefulWidget {
  String vehicle;
  String coverage;
  SubmitClaimQuestionsPage(this.vehicle, this.coverage, {Key? key})
      : super(key: key);

  @override
  SubmitClaimQuestionsState createState() =>
      SubmitClaimQuestionsState(this.coverage, this.vehicle);
}

class SubmitClaimQuestionsState extends State {
  String vehicle;
  String coverage;
  SubmitClaimQuestionsState(this.coverage, this.vehicle);
  Future getMyVehicles() async {
    final prefs = await SharedPreferences.getInstance();
    final String? action = prefs.getString('vehiclesList');
    VehiclesResponse myVehiclesResponse =
        VehiclesResponse.fromJson(jsonDecode(action!));
    return myVehiclesResponse.vehicles;
  }

  static List<MyCarClaimType> myCarClaims = <MyCarClaimType>[];

  // Fetch content from the json file
  Future generateQuestionsFromJson() async {
    final String response = await rootBundle
        .loadString('lib/Assets/JsonDataFiles/MyCarDataClaimQuestions.json');
    MyClaimQuestionsResponse myClaimQuestionsResponse =
        MyClaimQuestionsResponse.fromJson(jsonDecode(response));
    if (myClaimQuestionsResponse.myCarClaimTypes.isNotEmpty) {
      myCarClaims.clear();
      myCarClaims = myClaimQuestionsResponse.myCarClaimTypes
          .where((element) =>
              element.claimType.toLowerCase() == coverage.toLowerCase())
          .toList();
    }
    if (myCarClaims.isNotEmpty) {
      setState(() {
        for (var i = 0; i < myCarClaims.length; i++) {
          if (myCarClaims[i].questionType == "TEXT") {
            allQuestions.add(TextQuestionBox(myCarClaims[i]));
          } else if (myCarClaims[i].questionType == "SELECT") {
            allQuestions.add(SelectQuestionBox(myCarClaims[i]));
          } else if (myCarClaims[i].questionType == "RADIO") {
            allQuestions.add(RadioQuestionBox(myCarClaims[i]));
          } else if (myCarClaims[i].questionType == "MULTI_SELECT") {
            allQuestions.add(MultiSelectQuestionBox(myCarClaims[i]));
          } else if (myCarClaims[i].questionType == "DATE") {
            allQuestions.add(DateQuestionBox(myCarClaims[i]));
          }
        }
      });
    }
    return allQuestions;
  }

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

  bool isVehicleSelected = false;
  // ignore: unused_field
  List<Widget> allQuestions = <Widget>[];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        fontFamily: 'Lato',
      ),
      home: Scaffold(
        backgroundColor: Color(AppColors.bgColor),
        body: SafeArea(
          child: SingleChildScrollView(
            physics: const ClampingScrollPhysics(),
            child: Container(
              margin: const EdgeInsets.only(top: 30, bottom: 20),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    margin: const EdgeInsets.only(
                      bottom: 15,
                      left: 20,
                      right: 20,
                    ),
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        GestureDetector(
                          onTap: () {
                            Navigator.of(context).pop();
                          },
                          child: Align(
                              alignment: Alignment.centerLeft,
                              child: SvgPicture.asset(
                                'lib/Assets/Images/backarrow.svg',
                                height: 20,
                              )),
                        ),
                        Expanded(
                            child: Column(
                          children: [
                            Align(
                              alignment: Alignment.center,
                              child: Padding(
                                padding: const EdgeInsets.only(right: 20),
                                child: Text(
                                  vehicle,
                                  textAlign: TextAlign.start,
                                  style: const TextStyle(
                                    fontSize: 18,
                                    letterSpacing: -0.5,
                                    fontWeight: FontWeight.w700,
                                  ),
                                ),
                              ),
                            ),
                            Align(
                              alignment: Alignment.center,
                              child: Padding(
                                padding: const EdgeInsets.only(right: 20),
                                child: Text(
                                  coverage,
                                  textAlign: TextAlign.start,
                                  style: TextStyle(
                                      fontSize: 13,
                                      fontWeight: FontWeight.w500,
                                      color: Color(AppColors.primaryBlueColor)),
                                ),
                              ),
                            ),
                          ],
                        )),
                      ],
                    ),
                  ),
                  Flexible(
                    fit: FlexFit.loose,
                    child: ListView.builder(
                      physics: const ClampingScrollPhysics(),
                      shrinkWrap: true,
                      key: UniqueKey(),
                      itemCount: allQuestions.length,
                      itemBuilder: (BuildContext context, int index) {
                        return allQuestions[index];
                      },
                    ),
                  ),
                        const SizedBox(
                          width: 20,
                        ),
                      ],
                    ),
                  ),
                  Container(
                    width: double.infinity,
                    margin: const EdgeInsets.only(
                      left: 20,
                      right: 20,
                      top: 15,
                    ),
                    child: TextButton(
                      style: ButtonStyle(
                        padding: MaterialStateProperty.all(
                            const EdgeInsets.symmetric(vertical: 16)),
                        backgroundColor: MaterialStateProperty.all(
                            Color(AppColors.primaryBlueColor)),
                        shape:
                            MaterialStateProperty.all<RoundedRectangleBorder>(
                                RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(10.0),
                        )),
                      ),
                      child: Text(
                        'Submit Claim',
                        style: TextStyle(
                            fontWeight: FontWeight.w500,
                            fontSize: 15,
                            color:
                                Color(AppColors.primaryWhiteButtomTextColor)),
                      ),
                      onPressed: () {},
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

My TextFeild widget is this:

import 'package:flutter/material.dart';
import 'package:my_car/LocalData/AppColors.dart';
import 'package:my_car/Models/MyClaimQuestionsResponse.dart';

class TextQuestionBox extends StatefulWidget {
  MyCarClaimType claimObj;

  TextQuestionBox(this.claimObj, {Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return TextQuestionBoxState(claimObj);
  }
}

class TextQuestionBoxState extends State<TextQuestionBox> {
  MyCarClaimType claimObj;

  TextQuestionBoxState(this.claimObj);
  TextEditingController txtControler = TextEditingController();

  Widget get questionTxtBox {
    return Container(
      //width: double.infinity,
      //height: 200,
      margin: const EdgeInsets.symmetric(horizontal: 10),
      padding: const EdgeInsets.all(10),
      child: Column(
        children: [
          Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                "${claimObj.order + 1}.  ",
                style: const TextStyle(
                  fontSize: 14,
                  fontWeight: FontWeight.w700,
                ),
              ),
              Expanded(
                child: Text.rich(
                    //softWrap: false,
                    //overflow: TextOverflow.fade,
                    TextSpan(
                        text: claimObj.question,
                        style: const TextStyle(
                          fontSize: 14,
                          fontWeight: FontWeight.w700,
                        ),
                        children: <InlineSpan>[
                      TextSpan(
                        text: claimObj.isMandatory == "YES" ? "*" : "",
                        style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.w700,
                            color: Color(AppColors.primaryBlueColor)),
                      ),
                    ])),
              ),
            ],
          ),
          const SizedBox(
            height: 10,
          ),
          Container(
              height: 110,
              decoration: const BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.all(Radius.circular(15))),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.end,
                children: [
                  Expanded(
                    child: TextField(
                      controller: txtControler,
                      keyboardType: TextInputType.multiline,
                      //maxLines: null,
                      style: const TextStyle(
                          fontSize: 14, fontWeight: FontWeight.w500),
                      decoration: const InputDecoration(
                        border: InputBorder.none,
                        filled: true,
                        fillColor: Colors.transparent,
                        hintText: 'Description',
                      ),
                    ),
                  ),
                  Container(
                      margin: const EdgeInsets.only(bottom: 10, right: 15),
                      child: Text(
                        'Min. 40 Letters',
                        style: TextStyle(
                            fontSize: 10,
                            fontWeight: FontWeight.w500,
                            color: Color(AppColors.greyText)),
                      ))
                ],
              )),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return questionTxtBox;
  }
}
Abubakar
  • 97
  • 8

1 Answers1

1

TextFields usually try to expand to the available width. This can be problematic in a Column where usually only height is fixed and the Textfield tries to expand into infinity. You should try wrapping the TextField in a Widget that gives it a fixed width like a SizedBox.

MindStudio
  • 706
  • 1
  • 4
  • 13