资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

flutter返回,flutter返回指定页面

Flutter开发之Android物理按键返回

在flutter开发过程中,发现Android手机在App首页点击物理返回按钮时,App会退出并且再次点开App时会重新启动,这代表了上次的退出直接杀死了App,和我们平常的退到手机桌面不同,所以开发了一个单独插件来处理这种情况。

成都创新互联专注于夷陵网站建设服务及定制,我们拥有丰富的企业做网站经验。 热诚为您提供夷陵营销型网站建设,夷陵网站制作、夷陵网页设计、夷陵网站官网定制、成都微信小程序服务,打造夷陵网络公司原创品牌,更为您提供夷陵网站排名全网营销落地服务。

使用步骤如下:

1、pubspec.yaml文件中引入依赖

2、引用插件

3、使用插件来退出App到桌面,并且保持App后台运行

可根据实际情况在_onWillPop方法中处理相关逻辑,比如连续两次点击物理返回按钮才退出到桌面等。

Flutter 124: 日常问题小结 (三) 自定义 Dialog 二三事

针对日常不同的需求,我们时常需要自定义 Dialog ,而小菜在尝试过程中遇到一些小问题,简单记录总结一下;

小菜在自定义含有文本框的 Dialog 时,文本框获取焦点时,软键盘会部分遮挡对话框,但当小菜替换为 AlertDialog 时,文本框获取焦点时,对话框会向上浮动,避免软键盘遮挡;

对于含有文本框的自定义 Dialog ,小菜在最外层使用的是 Material 嵌套,小菜通过采用 Scaffold 来嵌套处理,默认 Scaffold 中 resizeToAvoidBottomPadding / resizeToAvoidBottomInset 为 true ,当设置为 false 时,文本框获取焦点时,依旧会被软键盘遮挡;因为在固定情景可以配合 resizeToAvoidBottomPadding 实现是否被软键盘遮挡效果;

resizeToAvoidBottomPadding 主要用于自身 Widget 是否避免被其他窗口遮挡;其中小菜查资料介绍在 Flutter 1.1.9 之后更推荐使用 resizeToAvoidBottomInset ;

小菜自定义一个可以多选 item 的 Dialog ,但 Dialog 中并没有状态更新的 State ,如何进行 Dialog 中状态更新呢?

小菜之前在 showDialog 时直接创建了 TypeListDialog ,此时是无状态的,当 WidgetBuilder 创建一个 StatefulBuilder 有状态的构造器即可,可以将 state 传递到 Dialog 中;

小菜在自定义 Dialog 时如何在一个回调方法中传递多个参数?

小菜在 Dialog 的回调方法中传递两个 List ,而在接收回调方法中匹配两个参数即可;小菜简单看作是一个函数方法;

小菜在重写 AppBar 时,如何取消默认的返回按钮?

取消 AppBar 前面的返回图标有多种方式;

自定义 Dialog 案例源码

小菜对于 Flutter 的应用还不够熟悉,很多常用的场景会处理的很不到位,小菜会对日常的小问题进行简单记录,逐步学习;如有错误,请多多指导!

Flutter 开发笔记

下面这种情况下,为 InkWell 设置的 splashColor 不会生效:

需要用 Material 去除背景色,然后将颜色设置在 InkWell 外部:

在 Dialog builder 中使用 WillPopScope 禁用返回键返回:

注意:使用此方法同时也会禁用 iOS 上的手势滑动返回功能,推荐判断平台后再使用。

修改对话框中的复选框状态,最简便的方法是通过 Element 中的 markNeedsBuild 方法:

当然,更推荐的做法是通过 StatefulBuilder ,然后就可以在 Dialog 中调用 setState 方法了,不过在调用 setState 时需要判断 Dialog 是否已经关闭,否则会造成 setState() called after dispose() 的错误,可以通过添加一个标志位来解决,如下:

在 Web 中加载网络图片有时会失败,遇到这样的报错: Exception caught by image resource service... ,造成该错误的原因通常是,图片跨域了(见 跨域资源共享 )。最简单的解决办法是, 使用 HTML 渲染加载 ,而不是默认的 CanvasKit。

Flutter 中所有的 list 默认都是没有 ScrollBar 的,必须使用 ScrollBar 组件。ScrollBar 组件通过监听 ScrollView 的 ScrollNotification 来刷新位置,所以 List 的长度必须是固定的。

当使用 WebView 等高度不定的组件时会出现内容被截断的情况,通常可以使用 NestedScrollView 来解决该问题,需要在 WebView 外部嵌套 SingleChildScrollView。

虽然使用了缓存,而且也是用 builder 加载图片的,但是发现一个现象:滑动屏幕后图片短暂消失并重新加载了。图片高度很高时这种现象更加明显,其原因是超出屏幕范围一定距离的组件被重新渲染了。解决方法是在 ListView 上设置 cacheExtent 参数:

该参数的作用是改变超出屏幕高度后继续渲染的范围(以像素为单位),比如设置成 9999 后意味着超出屏幕 10000 像素以内的内容都会被保留下来。

借助 IntrinsicHeight 组件:

另外,IntrinsicHeight 还可以用于 Dialog 或者 BottomSheet 中,使得其中的元素 显示内在元素的高度 ,从而避免元素因为约束的存在而不显示或者高度太高(比如在使用了 Column 或者 Row 的时候)。

在通过 Uri 的 queryParameters 获取 query 参数时,发现有些链接会抛出下面异常:

造成该异常的原因是 Uri 默认使用 utf-8 解码超链接字符串,如果链接中包含非 utf-8 字符,就会造成上面的错误,相关 issue 见: issue #31621 。目前该 issue 处于 open 的状态,暂时的解决办法是,在所有使用到 queryParameter 的地方用 try..catch 捕捉可能抛出的异常。

Flutter 开发非常依赖各种官方或第三方的插件,而在使用这些插件时多少都会遇到一些问题,大部分问题都可以通过搜索和查找 issue 来解决。这里记录下一些我在使用部分插件时遇到的问题及其解决方法。

目前该库没有图片加载完成的回调(见 issue #545 ),不过我们可以通过在 imageBuilder 中来添加回调:

这是一个应用内更新插件,安卓 10 以上安装时需要在 manifest 中添加以下内容:

目前功能最强大的 WebView 插件,基本能满足绝大部分移动端网页加载的需求,而且可定制化程度高。

一般通过 CookieManager 修改 Cookie,拦截请求并修改请求对象的 Header 不会生效。

InAppWebViewOptions 的 userAgent 只在 iOS 上生效,而 applicationNameForUserAgent 只在 Android 上生效,所以最好的做法是分平台设置 InAppWebViewOptions ,而且需要注意,由于设置 userAgent 后会覆盖默认的 UserAgent,所以如果需要在默认的 UserAgent 上添加其它参数,iOS 上需要通过 InAppWebViewController.getDefaultUserAgent() 获取默认 UserAgent 参数,而 Android 不需要添加。

如果图片源或者请求是 http 的,为了在 Android 上正常加载请求,必须在 AndroidInAppWebViewOptions 中将 mixedContentMode 设置为 AndroidMixedContentMode.MIXED_CONTENT_ALWAYS_ALLOW 。

当我们想要设置全屏图片的时候,由于默认的 Constraint 会将图片居中显示,所以图片四周会留有空隙。为了去除这个限制,我们需要 Xcode 中打开 LaunchScreen.storyboard,然后在 View Controller 的 View 和 LaunchImage 上的 Safe Area 去掉。

具体设置方法:右侧 Inspector 面板 Show the Size inspector 解选 Layout Margins 中的 Safe Area Relative Margins,拖动图片占满全屏,然后根据 View Controller Scene 的 Warning,更新 Constraint 就可以了。

在集成某些三方库之后,在使用命令行运行 iOS 模拟器的时候可能会遇到下面这个报错:

这是因为 iOS 模拟器未来将会兼容 arm64 架构,但是目前还不支持,所以我们需要修改 Build Setting 使得能够在 x86_64 的模拟器上运行,操作步骤见 这里 。

Flutter/IOS混和开发情况下,项目内首个Flutter页面导航无返回问题

在Flutter内部机制中,默认使用自动管理导航机制,该机制在Flutter与原生混和开发情况下,Flutter页面不一定作为项目的首页面,所以出现需要在首个Flutter页面使用导航返回的需求。

Flutter的AppBar中定义有属性:

该属性默认为YES,即默认为自动管理导航栏,该情况下其会在非第一个Flutter页面创建导航返回按钮,我们在AppBar中将其设置为false:

并且手动添加导航返回按钮:

完成

flutter 同时执行多个异步请求回调

flutter中提供了Future.wait()函数,可以在执行多个异步请求之后有一个统一的回调结果,但是劣势在于,每一个异步函数的函数体中都需要执行return去返回结果,如果在异步请求中,有多层success或者fail这种函数的嵌套,那么可能会在某个地方忽略掉retrun,导致没有办法拿到正确的结果。所以这里封装了一个类似于js中Promise中的类去执行多个异步请求。

调用方式如下:


当前标题:flutter返回,flutter返回指定页面
文章网址:http://cdkjz.cn/article/dsddcgi.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220