Flutter 未在发布的 apk 上在真实设备中渲染 UI

2023-12-02

我一直在为我的应用程序编写 ui,在调试模式下构建时没问题。但是当我构建发布 apk 时,用户界面变得模糊,并且文本不显示。小部件的渲染不符合预期,并且它们的大小渲染不正确。我在不同的手机上检查过,但结果是一样的。是我的代码有问题还是flutter的内部bug?有没有人见过这个?

它在发布的apk中

它在调试apk中

import 'package:cached_network_image/cached_network_image.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:go_router/go_router.dart';
import 'package:provider/provider.dart';
import 'package:rx_shared_preferences/rx_shared_preferences.dart';
@override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        const SizedBox(height: 12.0),
        StreamBuilder(
          stream: rxPrefs.getStringStream('firstName'),
          builder: (context, snapshot) => Padding(
            padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 12.h),
            child: Text(
              '${AppLocalizations.of(context)!.hello} ${snapshot.data ?? ''}',
              style: AppTextStyles.headline,
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.symmetric(horizontal: 14.w, vertical: 12.h),
          child: GestureDetector(
            onTap: () => context.push(SearchPage.route),
            child: Card(
              child: Padding(
                padding: const EdgeInsets.all(12.0),
                child: Row(
                  children: [
                    const Icon(Icons.search),
                    const SizedBox(width: 12.0),
                    Text(
                      AppLocalizations.of(context)!.search,
                      style: AppTextStyles.title0,
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
        FutureBuilder(
            future: ApiService.getInstance().getPromos(),
            builder: (context, snapshot) {
              if (snapshot.hasData) {
                List<Promo> promos = snapshot.data as List<Promo>;

                return Padding(
                  padding: EdgeInsets.symmetric(horizontal: 18.w, vertical: 12.h),
                  child: CarouselSlider.builder(
                    options: CarouselOptions(
                      enlargeCenterPage: true,
                      enableInfiniteScroll: true,
                      height: widget.mediaQuery.size.height * .25,
                      viewportFraction: 1,
                    ),
                    itemCount: promos.length,
                    itemBuilder: (BuildContext context, int index, int realIndex) => Container(
                      decoration: BoxDecoration(borderRadius: BorderRadius.circular(10.0)),
                      clipBehavior: Clip.hardEdge,
                      height: widget.mediaQuery.size.height * .25,
                      width: widget.mediaQuery.size.width,
                      child: CachedNetworkImage(
                        imageUrl: promos[index].image,
                        fit: BoxFit.fitWidth,
                      ),
                    ),
                  ),
                );
              }
              return Container(
                padding: EdgeInsets.symmetric(horizontal: 18.w, vertical: 12.h),
                decoration: BoxDecoration(borderRadius: BorderRadius.circular(10.0)),
                clipBehavior: Clip.hardEdge,
                height: widget.mediaQuery.size.height * .25,
                width: widget.mediaQuery.size.width,
                // alignment: Alignment.center,
                child: const Card(child: Center(child: CircularProgressIndicator())),
              );
            }),
        Padding(
          padding: EdgeInsets.symmetric(horizontal: 18.w, vertical: 12.h),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                AppLocalizations.of(context)!.categories,
                style: AppTextStyles.title0,
              ),
              GestureDetector(
                onTap: () => context.push(CategoriesPage.route),
                child: Text(
                  AppLocalizations.of(context)!.seeAll,
                  style: AppTextStyles.title0.copyWith(color: AppColors.grey),
                ),
              ),
            ],
          ),
        ),
        Consumer<CategoryBloc>(
          builder: (context, bloc, child) => SizedBox(
            height: widget.mediaQuery.size.height * .2,
            child: ListView.builder(
              padding: EdgeInsets.only(left: 18.w),
              itemCount: bloc.categories.length,
              scrollDirection: Axis.horizontal,
              itemBuilder: (context, index) => CategoryCard(category: bloc.categories[index]),
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.symmetric(horizontal: 18.w, vertical: 12.h),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                AppLocalizations.of(context)!.popular,
                style: AppTextStyles.title0,
              ),
              GestureDetector(
                onTap: () => context.push(ProductsPage.route),
                child: Text(
                  AppLocalizations.of(context)!.seeAll,
                  style: AppTextStyles.title0.copyWith(color: AppColors.grey),
                ),
              ),
            ],
          ),
        ),
        Consumer<ProductBloc>(
            builder: (context, bloc, child) =>
                Column(children: bloc.products.take(4).map((e) => ProductWidget(product: e)).toList())),
        const SizedBox(height: 16.0),
      ],
    );
  }```

我找到了解决方案,小部件没有渲染,因为const基于类的小部件的构造函数。要解决这个问题有两种方法,首先删除const在小部件构造函数和使用之前,第二个要删除screen_util或另一个动态生成值的包。 这是我找到原始解决方案的链接https://github.com/OpenFlutter/flutter_screenutil/issues/341, https://github.com/OpenFlutter/flutter_screenutil/issues/350.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Flutter 未在发布的 apk 上在真实设备中渲染 UI 的相关文章

  • flutter SDK是否提供了为Windows Phone开发应用程序的框架?

    我想知道google是否计划支持除iOS和Android以外的任何其他平台使用Flutter进行跨平台开发 像React Native Windows for React Native一样 Flutter是否有支持Windows Phone
  • Flutter如何在用户区域设置中获取一周中的所有天作为字符串

    正如标题中所述 有没有一种简单的方法可以在用户区域设置中将一周中的所有天作为字符串 当然在列表中 获取 使用 intl 包 我发现最简单的方法是 import package intl intl dart var days DateForm
  • 禁用向下拖动以关闭 showModalBottomSheet

    如何在底部表单模态中禁用 转义向下拖动手势 以便用户可以在模态中进行交互而不会意外关闭模态 下面用实际的模态底部表进行了更新 return showModalBottomSheet context context builder Build
  • FlutterJNI.loadLibrary 多次调用(FlutterJNI.prefetchDefaultFontManager、FlutterJNI.init)

    更新 Android Studio 和 flutter 和 kotlin 后 我收到此警告 错误 如何解决或者我可以忽略而不会导致错误 先感谢您 W FlutterJNI 23046 FlutterJNI loadLibrary calle
  • JPanel 上的圆形边框

    我这里得到的是一个带有圆形边框的 JPanel 其设置如下 panel setBorder new LineBorder PanelColor 5 true 问题是 在每个角上都有 2 条从外角到内角的对角不透明线 即边框的长度 边界后面的
  • Firebase云函数在Flutter中返回null,因为它仍在运行

    更新 我从我的 firebase 控制台得到这个 函数执行花费了 2906 毫秒 完成状态代码 200 15 秒后 我得到 console log DOC 确实存在 我正在运行这个云火库功能 它 有效 但我不断得到这样的回报 FLUTTER
  • 如何使用 SingleChildScrollView 使 Stacklayout 可滚动?

    我正在尝试使用 SingleChildScrollView 使堆栈布局可滚动 但它不滚动 这里应该使用SingleChildScrollView吗 我想我已经给出了足够的描述 可以让任何人理解我的问题 这里有更多文本以满足 StackOve
  • Flutter,在第1页时无法点击第2页

    我创建了一个PageView有 3 个页面 每个页面都有一个按钮 单击每个按钮应滚动到该页面 如果在第 2 页 则上一页和下一页都是可点击的 如果它位于第 3 页 则可以单击上一页 如果是在第一页 下一页不可点击 更新 当在 page1 上
  • 颤动中的单选按钮对齐

    我是颤振的新手 我想对齐单选按钮 即 无论文本是什么 单选按钮都应该按列对齐 我在用Column然后小部件Row其中的小部件但得到以下结果 代码在这里 Widget build BuildContext context return Con
  • 在 flutter firebase 中登录时出现错误

    在使用错误的电子邮件或密码登录时 我希望获得我输入的小吃栏 但我的控制台中出现错误 error 初始任务操作失败 RecaptchaAction action signInWithPassword 有例外 内部 发生错误 无效的登录凭证 验
  • Flutter:未捕获的 ReferenceError:firebase 未定义

    我在 Flutter Web 应用程序中使用 Firebase 服务 但在加载 Firebase 脚本时遇到问题 当我使用扑动时运行 d chrome我看到有错误的空白页面 重新加载页面后加载正常 当我进行 flutter build we
  • 如何在 flutter 搜索页面小部件中消除搜索建议?

    我需要使用默认 flutter 的 Google 地方信息搜索建议搜索页 每当用户开始输入时 我都需要提供自动完成建议 并且我使用异步方式实现了这一点FutureBuilder 现在的问题是我需要将搜索请求的调度去抖 500 毫秒或更长时间
  • flutter 中 Future.delayed 与 Timer 有什么区别

    我想知道延迟代码执行的 Future delayed 和 Timer 方法之间的区别 两者似乎都做同样的事情 未来 延迟 Future delayed const Duration milliseconds 500 code VS Time
  • 是否可以在flutter中开发移动键盘应用程序

    我们想要开发具有一些独特功能 例如在键盘上翻译 的移动键盘应用程序 第三方键盘 我们想知道是否有一种方法可以同时为 IOS 和 Android 开发一次 使用 Flutter 或者其他解决方案 对此有一个长的和一个短的答案 简短的回答基本上
  • 渲染时 Flutter SVG 延迟

    我在行中显示 SVG 文件形式的图像和文本 由于某些原因 svg 图像的渲染速度比屏幕的其余部分慢 从而导致延迟 这不利于用户体验 这种延迟正常吗 我该怎么做才能使整个屏幕同时渲染 Row mainAxisAlignment MainAxi
  • 如何使用 Firebase_Auth 和 Flutter 登录 Twitter

    一个人应该如何编程使用 Twitter 登录特征使用firebase auth https pub dev packages firebase auth和颤动 我看到一些使用的例子flutter twitter login https pu
  • 在 Flutter 中使用 Expansion Tile 和 ListView

    我正在尝试从此构建应用程序image https i stack imgur com gJNkO png 但是当我将 ListView 与此扩展图块放在同一页面中时 屏幕变为空 I added shrinkwrap true并工作了 但现在
  • 向 Thunderbird 添加多个附件(从命令行)

    我尝试通过命令行创建带有多个附件的新消息 但这不起作用 thunderbird compose attachment etc mtab attachment etc fstab 仅附加第一个文件 第二个失踪了 上面的命令行有什么问题 PS
  • 带操作按钮的颤动本地通知

    我在我的 flutter 项目中尝试了 flutter 本地通知插件 它在简单通知上工作正常 但我需要带有操作按钮的通知功能 请帮助我或建议我实现此功能 不幸的是 flutter local notifications 插件尚不支持操作按钮
  • Android Studio Flutter 项目错误:内存不足

    我在 Android Studio 上运行任何 flutter 项目 都会抛出内存不足错误 控制台中显示的消息如下所示 e b build slave windows engine build src third party dart ru

随机推荐