flutter TextFormField宽度在生产模式下为零

epggiuax  于 2023-08-07  发布在  Flutter
关注(0)|答案(2)|浏览(109)

我写了一个字典应用程序,我在主页上有一个TextFormField,它在我的移动的和模拟器上显示得很好。当在其他设备上运行时,TextFormField宽度为零或消失。
如果你们遇到这类问题,请分享一下你们的经验

我的期望:


的数据

我所面对的:


首页编码:

import 'dart:math';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:sundic/app/modules/home/mylabel.dart';
import 'package:sundic/app/routes/app_pages.dart';
import 'package:sundic/generated/locales.g.dart';
import '../controllers/home_controller.dart';

class HomeView extends GetView<HomeController> {
  const HomeView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async => await _showRatingDialog(context),
      child: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          forceMaterialTransparency: true,
          toolbarHeight: Get.width * .30,
          title: Obx(
            () => controller.isLoaded.value
                ? SizedBox(
                    width: controller.bannerAd!.size.width.toDouble(),
                    height: controller.bannerAd!.size.height.toDouble(),
                    child: AdWidget(ad: controller.bannerAd!),
                  )
                : const SizedBox.shrink(),
          ),
          titleSpacing: 0,
          bottom: PreferredSize(
            preferredSize: const Size.fromHeight(5.0),
            child:

                // Obx(() => searchInput()),

                SizedBox(
              width: Get.size.width,
              height: 50,
              child: Obx(
                () => searchInput(),
              ),
            ),
          ),
        ),
        backgroundColor: Colors.grey.shade100,
        body: Stack(
          children: [
            // WordCloud(texts: controller.mylabels, focusedWord: controller.focusedWord),
            Obx(
              () => Container(
                height: Get.size.height,
                width: Get.size.width,
                margin: const EdgeInsets.only(top: 10),
                child: Container(
                  clipBehavior: Clip.antiAlias,
                  margin: const EdgeInsets.symmetric(horizontal: 15),
                  decoration: BoxDecoration(
                    color: controller.words.isNotEmpty ? Colors.white : Colors.transparent,
                    // borderRadius: const BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)),
                  ),
                  child: ListView.separated(
                    physics: const BouncingScrollPhysics(),
                    padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 0),
                    itemCount: controller.words.length,
                    itemBuilder: (context, index) {
                      return ListTile(
                        onTap: () {
                          FocusScope.of(context).unfocus();
                          Get.toNamed(Routes.DETAILS, arguments: controller.words[index]);
                        },
                        contentPadding: const EdgeInsets.symmetric(horizontal: 10, vertical: 0),
                        title: Text(
                          controller.words[index].word ?? '',
                          textDirection: controller.words[index].wordDirection,
                        ),
                        subtitle: Directionality(
                          textDirection: controller.words[index].meaningDirection,
                          child: Text(
                            controller.words[index].meaning ?? '',
                            style: TextStyle(color: Colors.grey.shade700),
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                          ),
                        ),
                      );
                    },
                    separatorBuilder: (BuildContext context, int index) => const Divider(thickness: 0.5),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget searchInput() {
    return Container(
      width: Get.size.width,
      height: 50,
      padding: const EdgeInsets.symmetric(horizontal: 15),
      child: IntrinsicWidth(
        stepHeight: Get.size.width,
        child: Container(
          width: double.infinity,
          height: double.infinity,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(0),
            border: Border.all(color: Colors.grey.shade300),
          ),
          child: TextFormField(
            autofocus: true,
            controller: controller.searchController,
            onTap: () => controller.moved.value = true,
            onChanged: (value) => controller.search(value),
            decoration: InputDecoration(
              hintText: LocaleKeys.search_placeholder.tr,
              border: InputBorder.none,
              suffixIcon: IconButton(
                onPressed: () => Get.toNamed(Routes.BOOKMARKED),
                icon: const Icon(Icons.star),
              ),
              prefixIcon: controller.hiddenButton.value
                  ? const Icon(Icons.search)
                  : IconButton(
                      onPressed: () {
                        controller.hiddenButton.value = true;
                        controller.searchController.clear();
                        controller.words.clear();
                      },
                      icon: const Icon(Icons.close)),
            ),
          ),
        ),
      ),
    );
  }

  Future<bool> _onWillPop() async {
    DateTime now = DateTime.now();
    if (controller.currentBackPressTime == null || now.difference(controller.currentBackPressTime!) > const Duration(seconds: 2)) {
      controller.currentBackPressTime = now;
      ScaffoldMessenger.of(Get.context!).showSnackBar(SnackBar(content: Text(LocaleKeys.press_back_again.tr), duration: const Duration(seconds: 2)));
      controller.reviewApp();
      return Future.value(false);
    }
    return Future.value(true);
  }

  Future<bool> _showRatingDialog(BuildContext context) async {
    bool shouldExit = false;
    await showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: Text(LocaleKeys.rate_the_app.tr),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(LocaleKeys.rate_the_app_description.tr),
            const SizedBox(height: 8),
          ],
        ),
        actionsAlignment: MainAxisAlignment.spaceEvenly,
        actions: [
          ElevatedButton(
            onPressed: () {
              shouldExit = true;
              Navigator.of(context).pop();
              controller.reviewApp();
            },
            child: Text(LocaleKeys.exit.tr),
          ),
          ElevatedButton(
            onPressed: () {
              shouldExit = false;
              Navigator.of(context).pop();
              // You can navigate the user to the Play Store/App Store for rating here
            },
            child: Text(LocaleKeys.rate.tr),
          ),
        ],
      ),
    );

    return shouldExit;
  }
}

字符串

cczfrluj

cczfrluj1#

宽度和填充的硬编码值可能无法适应不同的屏幕大小。

  • 尝试删除IntristicWidth,因为它可能是不必要的,可能会导致此问题。
  • 尝试删除borderRadius属性,因为它也可能导致不同屏幕尺寸的问题。
  • 修改**const EdgeInsets.symmetric(horizontal:15)toEdgeInsets.all()**给予所有的填充相等。

希望这个工作和您的问题得到解决

9gm1akwq

9gm1akwq2#

我找到问题了。我使用getx包的state management和我得到的设备宽度使用Get.width,我认为这个包有错误有时它不工作,并给我零宽度。
最后,我将Get.width替换为MediaQuery.of(context).size.width,它工作正常

相关问题