资讯

精准传达 • 有效沟通

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

flutter打开web,flutter打开微信发图片

Flutter2.0初体验(Web支持)

常规操作,就是使用android studio编辑器,Flie--New--New Flutter Project

创新互联坚信:善待客户,将会成为终身客户。我们能坚持多年,是因为我们一直可值得信赖。我们从不忽悠初访客户,我们用心做好本职工作,不忘初心,方得始终。十载网站建设经验创新互联是成都老牌网站营销服务商,为您提供做网站、网站制作、网站设计、H5页面制作、网站制作、品牌网站设计微信小程序开发服务,给众多知名企业提供过好品质的建站服务。

一路直接Next+Finish ,项目就创建成功了。

常规的运行到手机或者模拟器上就不说了,下面说下运行到web浏览器上。

如上图,选择最后一个是手机真机调试,选择Chome或者Edge都可以运行到web浏览器中,选择好后点击绿色运行按钮。

flutter项目中添加web支持

Flutter 2.5.1

在项目目录下,在终端运行以下命令:

Flutter 中文文档 - Flutter 中文资源 | 在 Web 中展示图片

在无法修改服务器配置的情况下可以使用html渲染。此外官方文档中建议,如果显示的图片较多,使用html渲染性能更好

webview只支持移动端,其它平台尝试打开网页

webview - web view for flutter web application - Stack Overflow

使用 package_info_plus | Flutter Package (pub.dev) 替换package_info

使用 --base-href ,可设置服务器子目录

flutter web(3) 快速创建web工程并运行

如果没有输出可能原因有两个

1.我们使用 vscode ## vs code支持的额很好。

版本问题 -- 自行查找对应版本

修改 yaml 文件中的版本知道运行成功。或者直接改成any,从lock文件中找到真正版本再修改yaml中的文件

flutter 打包web

先运行下,看当前flutter 是否支持web项目, 如果没有enable-web: true 则输入 flutter config --enable-web

这时候项目中就包含了web文件夹.

输入 flutter build web 就可以在build文件夹中生成web文件, 将它放到到tomcat或者其他容器就能访问了!

附上项目的测试连接:

参考:


网站名称:flutter打开web,flutter打开微信发图片
网站URL:http://cdkjz.cn/article/dssjhop.html
多年建站经验

多一份参考,总有益处

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

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

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