书写技术成长之路

Android gradle 下载超时解决方案

在运行flutter应用的时候遇到了下载 https://services.gradle.org/distributions/gradle-7.4-all.zip 超时的问题,究其原因必须使用代理才能访问。

解决办法就是在project目录下面,找到android文件夹下的gradle.propeties文件,修改里面的代理配置如下

org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
systemProp.http.proxyHost=127.0.0.1
systemProp.http.proxyPort=8001
systemProp.https.proxyHost=127.0.0.1
systemProp.https.proxyPort=8001

https://i.imgur.com/DlVEfNI.png

参考

https://stackoverflow.com/questions/34640698/gradle-failing-to-download-distribution-behind-company-proxy

https://developer.android.com/studio/intro/studio-config?hl=zh-cn#proxy

Flutter底部导航超过3个无法显示的问题解决

Flutter 默认的BottomNavigationBarItem最多显示3个元素,超过就会不显示或错乱,解决方案是加个type.

type:BottomNavigationBarType.fixed可以解决这个问题

bottomNavigationBar: BottomNavigationBar(
    type: BottomNavigationBarType.fixed,
    onTap: onTabTapped,
    currentIndex: _currentIndex,
    items: [
        BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('首页'),
        ),
        BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('首页'),
        ),
        BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('首页'),
        ),
        BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('首页'),
        ),
        BottomNavigationBarItem(
            icon: Icon(Icons.home),
            title: Text('首页')
        )
    ],
    ),

参考

https://stackoverflow.com/questions/50793810/how-to-display-more-than-3-items-in-a-bottomnavigationbar-while-coding-in-flutte

https://github.com/flutter/flutter/issues/13642

vscode 运行flutter应用报错 dart not found

之前配置好的vscode开发flutter的环境,今天再次运行的时候突然报了个 /bin/sh: dart: command not found的错误,但是通过命令行执行flutter run是可以直接运行程序的,很是奇怪。

google一番也没找到答案,后来注意到是我在vscode里安装了flutter扩展,这个flutter扩展会附带安装dart语言的扩展,我运行flutter的时候使用的是code runner扩展,之前都是使用这个扩展直接运行flutter应用的,这次却报了这个错误

/bin/sh: dart: command not found

后来使用vscode的快捷键F5就可以正常运行程序了,大概是由于code runner的原因吧,目前只能通过vscode的快捷键F5或者vscode的Debug菜单下面的Start Debugging来运行程序了。

如果你只是开发flutter应用,那么配置完flutter的开发环境就可以了,dart的运行环境会自动安装,环境通过flutter doctor来查看就好了

参考

https://flutter.dev/docs/development/tools/vs-code

Flutter Overflow on channel: flutter/lifecycle 错误处理

之前flutter的开发环境是基于dev分支构建的,之前运行好好的环境,突然报出了错误

flutter: Overflow on channel: flutter/lifecycle.  Messages on this channel are being discarded in FIFO fashion.  The engine may not be running or you need to adjust the buffer size if of the channel.

Flutter Overflow on channel

后来上网搜索了一番,发现是channel的问题,需要切换到stable。

先用flutter channel命令查看flutter环境当前所在的channel,如果是dev就切换到stable分支进行开发

切换到stable channel flutter channel stable

初探Flutter

Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。

Flutter因其支持跨平台开发只需要维护一个代码库,热重载加速调试,富有表现的UI界面等特性,使得开发移动应用程序不再困难。

下载flutter开发工具包

git clone -b dev https://github.com/flutter/flutter.git

设置环境变量

# 只针对国内用户设置镜像源
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

export PATH="$PWD/flutter/bin:$PATH"

用source命令使环境变量生效

然后运行flutter doctor来检查flutter所需要的环境是否都OK

首次运行如下所示

flutter doctor 初次执行

依次解决展示的所有问题,可以每解决一个后运行flutter doctor来查看是否成功。

最后成功的效果如下

flutter 安装成功

在vscode中打开命令行选择 Flutter: New Project来新建一个项目, 等项目完成进入到项目根目录执行 flutter run,来查看你的第一个flutter程序

flutter run 效果

2019-10-06.l8G4WgjnjC.png

常用flutter命令

flutter doctor    # 检查是否环境OK
flutter run      # 运行项目

flutter devices  # 查看可运行的设备

参考

https://flutterchina.club/get-started/install/

https://flutter.cn/docs/get-started/install

https://flutter.dev/docs/cookbook