Flutter是一个什么框架

Flutter是一个移动应用程序的软件开发工具包（SDK），具有以下特征：

创新互联建站自2013年创立以来，是专业互联网技术服务公司，拥有项目网站设计制作、网站设计网站策划，项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命，1280元雁塔做网站,已为上家服务,为雁塔各地企业和个人服务,联系电话:18980820575

跨平台应用的框架，没有使用WebView或者系统平台自带的控件，使用自身的高性能渲染引擎自绘

简化版的浏览器，最大限度在android和ios上统一UI，包括业务逻辑和用户体验

开发语言使用dart，结合C, C++, 和Skia（2D渲染引擎）构建

支持hot reload，包含着完整的控件和工具链

一切皆控件，控件是每个Flutter应用程序的基本构建块，与分离视图、控制器、布局和其他属性的框架不同，Flutter具有一致的统一对象模型：控件。一个控件可以定义：结构元素（比如按钮或菜单）、风格元素（比如字体或颜色方案）、布局的方面（比如填充）、一些业务逻辑等

组合大于继承，控件本身通常由许多小型、单用途的控件组成，结合起来产生强大的效果，类的层次结构是扁平的，以最大化可能的组合数量

强化版的WebView，框架仅提供一个View层，大部分功能要依赖原生

目前只能够运行大部分Dart代码（不能引入dart:mirrors或dart:html库）

vscode flutter 环境搭建

环境准备阶段：

android-studio 版本：android-studio-ide-191.5977832-windows.exe 3.5.2

flutter版本：stable 版本 （完成系统环境变量 path配置）

dart版本：2.12.0 （完成系统环境变量 path配置）

完成相关软件安装。

配置flutter相关SDK及andriod studio路径：

flutter config --android-sdk="C:\Users\Administrator\AppData\Local\Android\Sdk"

flutter config --android-studio-dir="D:\Program Files\Android\Android Studio"

执行flutter doctor运行成功。

夜神模拟器地址：D:\Program Files\Nox\bin （完成系统环境变量 path配置）

andriod SDK tools：C:\Users\Administrator\AppData\Local\Android\Sdk\platform-tools （完成系统环境变量 path配置）

nox_adb.exe connect 127.0.0.1:62001

dart SDK:D:\software\dartsdk-windows-x64-release\dart-sdk\bin

将C:\Users\Administrator\AppData\Local\Android\Sdk\platform-tools 下面adb.exe 复制至D:\Program Files\Nox\bin覆盖

adb.exe，此外重新复制adb.exe命名为nox_adb.exe，替换原有的nox_adb.exe。

cdm 输入nox_adb version 及adb version发现版本一致。

启动野神模拟器，输入adb devices发现虚拟设备，执行flutter devices发现 127.0.0.1:62001 设备。

修改C:\learn_flutter\first_flutter\android\gradle\wrapper\gradle-wrapper.properties

distributionUrl=

修改C:\learn_flutter\first_flutter\android\build.gradle

buildscript {

ext.kotlin_version = '1.3.50'

repositories {

// google()

// jcenter()

maven { url ' ' }

maven { url ' ' }

maven { url ' ' }

}

}

allprojects {

repositories {

// google()

// jcenter()

maven { url ' ' }

maven { url ' ' }

maven { url ' ' }

}

}

修改：C:\win-flutter\flutter\packages\flutter_tools\gradle\flutter.gradle

buildscript {

repositories {

// google()

// jcenter()

maven { url ' ' }

maven { url ' ' }

maven { url ' ' }

}

dependencies {

classpath 'com.android.tools.build:gradle:4.1.0'

}

}

//private static final String DEFAULT_MAVEN_HOST = " ";

private static final String DEFAULT_MAVEN_HOST = " ";

修改：C:\win-flutter\flutter\packages\flutter_tools\gradle\resolve_dependencies.gradle

repositories {

google()

jcenter()

maven {

//url "$storageUrl/download.flutter.io"

url " "

}

}

执行 flutter run启动成功。

环境搭建坑点在于JDK兼容问题以及网络问题。

Flutter 94: 初识 MediaQuery

当我们同时为手机和平板适配编写 app 针对不同屏幕尺寸进行 UI 布局或当用户偏好设置较大字号或是想要最大限度等减少动画等；此时就需要 MediaQuery 来帮我们获取所用设备的信息以及用户设置的偏好信息；

MediaQuery 一直存在于 WidgetsApp 和 MaterialApp 中， MediaQuery 继承自 InheritedWidget 是一个单独的 Widget ，但一般通过 MediaQuery.of(context) 来获取相关信息；

当相关信息发生变化，例如屏幕旋转等时，屏幕中 Widget 会重新构建，以保持最新状态；我们可以通过 MediaQuery 构造函数和提供的静态方法手动设置对应的相关信息；

MediaQueryData 包含关于媒介的相关信息；一般通过 MediaQuery.of(context) 获取；

size 为媒介的尺寸大小，以逻辑像素为单位；

devicePixelRatio 为像素密度；与设备物理像素有关，与横竖屏等无关；

orientation 为横竖屏， Orientation.landscape 为横屏， Orientation.portrait 为竖屏；

textScaleFactor 为

每个逻辑像素的字体像素数，小菜理解为字体的像素比；注意，小菜设置了默认字体像素密度为标准的 1.2 倍之后调整设备系统字号，其 1.2 倍依旧是以标准字号为基础扩大 1.2 倍；

platformBrightness 为当前设备的亮度模式；注意调整屏幕亮度并不会改变该模式，与当前系统支持的黑暗模式和明亮模式相关；

alwaysUse24HourFormat 为当前设备是否为 24 小时制；

accessibleNavigation 为是否使用 TalkBack 或 VoiceOver 之类的辅助功能与应用程序进行交互，用以辅助视力障碍人群；

invertColors 为是否使用颜色反转，主要用于 iOS 设备；

highContrast 为用户是否要求前景与背景之间的对比度高，主要用于 iOS 设备；

disableAnimations 为平台是否要求禁用或减少动画；

boldText 为平台是否要求使用粗体；

padding 为屏幕内边距，一般是刘海儿屏或异形屏中被系统遮挡部分边距；

viewInsets 为键盘弹出时等遮挡屏幕边距，其中 viewInsets.bottom 为键盘高度；

systemGestureInsets 为手势边距，如 Android Q 之后添加的向左滑动关闭页面等；

viewPadding 小菜理解为视图内边距，为屏幕被刘海儿屏或异形屏中被系统遮挡部分，从 MediaQuery 边界的边缘计算；此值是保持不变；例如，屏幕底部的软件键盘可能会覆盖并占用需要底部填充的相同区域，因此不会影响此值；

physicalDepth 为设备物理层级，小菜暂时还未想到对应的应用场景；

小菜在尝试获取其他子 Widget Size 时，有两点需要注意，首先要设置一个全局的 GlobalKey 来获取当前位置， key 需要为唯一的；第二通过 GlobalKey().currentContext 获取 BuildContext 上下文环境，从而获取对应尺寸；

MediaQuery 案例尝试

小菜对于部分 MediaQueryData 的应用和理解还不够深入；如有错误请多多指导！

Flutter开发Windows 和 Linux 桌面应用，设置默认窗口大小

在用Flutter 开发windows和linux跨平台应用的时候，如何设置默认窗口大小呢？

flutter没有提供统一的api，所以默认的窗口大小是1280x720.

如果我们想要改成自己想要的默认窗口大小呢？比如我想要设置为：512像素宽, 926像素高

我该怎么做呢？

请看我的教程。

首先你确保你已经为项目创建了windows和Linux的支持。

目前Flutter 为windows和linux提供的是托管式运行的主程序，可以理解为一个壳子，这个壳子就是用cpp写的，平台原生的window 窗口。

所以我们可以打开相应的cpp源代码，设置默认窗口大小。

这里先讲windows和linux，因为mac 平台跟windows和linux不一样，后面单独给大家讲解。

我们看图。

源代码路径位于：

windows/runner/main.cpp

找到

第一个参数是宽度，单位是px，第二个是高度，单位是px

修改后重新运行生效。

源代码路径位于：

linux/my_application.cc

找到

方法的第一个数字是宽度，第二个是高度，单位也是px像素。

修改后，重新运行生效。

现在，你已经学会了如何设置初始窗口大小了。

Flutter 修改应用程序的名称和图标

在项目中找到 AndroidManifest.xml 文件，其中 android:label="demo" 就是应用程序名称，修改引号中的内容即可

在项目中找到 mipmap-mdpi mipmap-hdpi mipmap-xhdpi mipmap-xxhdpi mipmap-xxxhdpi 文件夹，替换这些文件夹中的 ic_launcher.png 文件即可

注意：图标有多种尺寸的大小，是为了适配不同分辨率的手机而设计的

在项目中找到 Info.plist 文件，其中 CFBundleDisplayName 和 CFBundleName 下面的就是应用程序名称，修改内容即可

找到项目中的 AppIcon.appiconset 文件夹，其中 Contents.json 是配置文件，其它的图片文件就是图标，替换这些图片文件即可

注意：图标有多种尺寸的大小，是为了适配不同分辨率的手机而设计的

插件地址：

在项目中找到 pubspec.yaml 文件，添加内容如下

插件地址：

在项目中找到 pubspec.yaml 文件，添加内容如下

注意：准备一张 1024x1024 的 png 图片，取名为 icon.png 并把它放在 assets/icon 目录中

找到 ~/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_launcher_icons-0.9.2/lib/android.dart 文件修改内容如下

注意：如果使用了镜像地址就找到 ~flutter/.pub-cache/hosted/pub.flutter-io.cn/flutter_launcher_icons-0.9.2/lib/android.dart 文件来修改以上内容