Блог

У меня возникает A RenderFlex overflowed by 161 pixels on the bottom. проблема в моем приложении Flutter, когда открывается клавиатура, и я не знаю почему. Я использую a SingleChildScrollView с фиксированной высотой контейнера. Также я попробовал это с resizeToAvoidBottomInset: false, on Scaffold. Безуспешно.

Я думаю, что проблема как-то связана с включенным полем Pin-кода на этой странице. Но там у меня нет столбцов или чего-то еще … также я открываю этот виджет ModalBottomSheet (https://pub.dev/packages/modal_bottom_sheet )

Вот моя структура кода:

 Widget build(BuildContext context) {
    return Scaffold(
        body: SingleChildScrollView(
      child: Container(
        height: Get.height,
        color: Get.theme.colorScheme.primary.withOpacity(.03),
        padding: EdgeInsets.all(50),
        child: ListView(
          shrinkWrap: true,
          physics: ClampingScrollPhysics(),
          children: [
            EntryGuestbookHeading(),
            SizedBox(height: 50),
            Obx(() {
              if (entryGuestbookController.isCheckingCode.value == true) {
                return Center(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.end,
                    children: [
                      LoadingSpinner(),
                      SizedBox(height: 15),
                      Text("search_for_guestbook",
                              style: TextStyle(fontWeight: FontWeight.bold))
                          .tr(),
                      SizedBox(height: 50),
                    ],
                  ),
                );
              } else {
                return Container();
              }
            }),
            PinCodeField(
              guestbookCodeController: guestbookCodeController,
            ),
            EntryGuestbookActions(),
          ],
        ),
      ),
    ));
  }
 

Виджет EntryGuestbookHeading

 Widget build(BuildContext context) {
    return Container(
      padding: context.isTablet
          ? EdgeInsets.only(left: 150, right: 150, top: 100)
          : null,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Lottie.asset("assets/animations/key.json",
              height: Get.height / 8, repeat: false),
          SizedBox(height: 15),
          Container(
            child: Text(
              "open_guestbook",
              style: Get.theme.textTheme.headline3,
              textAlign: TextAlign.left,
            ).tr(),
          ),
          SizedBox(height: 15),
          Text(
            tr("enter_entry_code"),
            style: Get.theme.textTheme.bodyText1,
          )
        ],
      ),
    );
  }
 

Виджет PinCodeField

 Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(bottom: 25),
      child: Align(
        alignment: Alignment.bottomCenter,
        child: Container(
          padding: context.isTablet
              ? EdgeInsets.only(left: 150, right: 150, bottom: 150)
              : null,
          child: PinCodeTextField(
            backgroundColor: Colors.transparent,
            appContext: context,
            length: 5,
            focusNode: focusNode,
            autoDisposeControllers: false,
            obsecureText: false,
            textCapitalization: TextCapitalization.characters,
            animationType: AnimationType.slide,
            autoFocus: true,
            enableActiveFill: true,
            pinTheme: PinTheme(
              shape: PinCodeFieldShape.box,
              borderRadius: BorderRadius.circular(5),
              fieldHeight: 50,
              fieldWidth: 40,
              inactiveColor: Colors.grey,
              inactiveFillColor: Colors.transparent,
              selectedColor: Get.theme.colorScheme.primary,
              selectedFillColor: Get.theme.colorScheme.primary,
              activeColor: Get.theme.colorScheme.primary,
              activeFillColor: Get.theme.colorScheme.primary,
            ),
            animationDuration: Duration(milliseconds: 300),
            controller: widget.guestbookCodeController,
            onCompleted: (v) {
              entryGuestbookController.checkEntryCode(v).then((success) {
                if (success == false) {
                  setState(() {
                    guestbookCodeController.text = "";
                  });
                  focusNode.requestFocus();
                }
              });
            },
            onChanged: (value) => null,
          ),
        ),
      ),
    );
  }
 

Виджет EntryGuestbookActions

 Widget build(BuildContext context) {
    return Container(
        margin: EdgeInsets.only(bottom: 15),
        child: ConstrainedBox(
            constraints: BoxConstraints(
                minWidth: MediaQuery.of(context).size.width - 50),
            child: FlatButton(
                child: Text("cancel",
                        style: TextStyle(
                            color: Get.theme.colorScheme.onBackground))
                    .tr(),
                onPressed: () {
                  Navigator.of(context).pop();
                })));
  }
 

Для параметра autofocus установлено значение true. Если клавиатура открывается, я получаю сообщение об ошибке переполнения. В чем проблема в моем коде? Заранее спасибо за вашу помощь!

 Scaffold(
resizeToAvoidBottomPadding: false, )
 

Попробуйте обернуть виджет, вызывающий эту ошибку, гибким виджетом.