為什么我們要選擇flutter語言呢？它有哪些優(yōu)點呢？
成都創(chuàng)新互聯(lián)專注于武義企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站,商城網(wǎng)站定制開發(fā)。武義網(wǎng)站建設(shè)公司,為武義等地區(qū)提供建站服務(wù)。全流程定制網(wǎng)站制作，專業(yè)設(shè)計，全程項目跟蹤，成都創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)
*1.flutter將會幫你更容易，更快速的開發(fā)出界面美觀的移動應(yīng)用。
*2.是谷歌的親兒子
*3.支持熱重載 ：android原生開發(fā)會遇到編譯-打包-安裝三個步驟。開發(fā)效率遲遲得不到提升。熱重載技術(shù)在flutter內(nèi)完美體現(xiàn)。
*4.支持垮平臺：flutter基于圖像回執(zhí)引擎進行渲染，在不同平臺下繪制效果絕對是一致的，能做到真正的跨平臺，一處寫，處處運行。
*5.性能優(yōu)異性：不同于H5通過DOM渲染和RN映射組件，flutter直接基于native進行繪制。性能上完全超過原生。
*1.Dart語法編譯：Dart是一種強類型、跨平臺的客戶端開發(fā)語言。具有專門為客戶端優(yōu)化、高生產(chǎn)力、快速高效、可移植易學的風格。Dart主要由谷歌負責開發(fā)和維護。
*2.Flutter插件：Flutter使用的Dart語言無法直接調(diào)用iOS系統(tǒng)提供的OC或swift接口，這時就需要使用插件來實現(xiàn)中轉(zhuǎn)。Flutter官方提供了豐富的原生接口封裝
Flutter分為三大部分
*1.由Dart語言負責的Framwork層。
*2.Dart語法執(zhí)行器。
*3.Skia圖像處理引擎。05年就被研發(fā)成功了（谷歌的全家桶都是由谷歌的Skia圖像處理引擎繪制的，iOS目前的圖像處理引擎是JPEG，其中Skia是對JPEG的二次封裝。）
*1.2005年Skia圖像處理引擎成立，用來展示Chrome，火狐和其他谷歌自己的產(chǎn)品使用。
*2.2007年第一個安卓系統(tǒng)問世，于是谷歌開發(fā)者將Skia移植到安卓平臺。
*3.Skia作為一個2D的圖像系統(tǒng)，包含繪制，渲染，顯示圖片都是Skia完成。安卓中的3D部分是由OpenGLES來實現(xiàn)的，其中OpenGL ES是OpenGL的嵌入式版本。
Image是一個用于展示圖片的組件。支持 JPEG、PNG、GIF、Animated GIF、WebP、Animated WebP、BMP 和 WBMP 等格式。
Image.asset - 用于從資源目錄的顯示圖片,需要在 pubspec.yaml 文件中聲明。
Image.network - 用于從網(wǎng)絡(luò)上顯示圖片。
Image.file - 用于從文件里顯示圖片。
Image.memory - 用于從內(nèi)存里（Uint8List）顯示圖片。
alignment → AlignmentGeometry - 圖像邊界內(nèi)對齊圖像。
centerSlice → Rect - 九片圖像的中心切片。
color → Color - 該顏色與每個圖像像素混合colorBlendMode。
colorBlendMode → BlendMode - 用于 color 與此圖像結(jié)合使用。
fit → BoxFit - 圖像在布局中分配的空間。
gaplessPlayback → bool - 當圖像提供者發(fā)生變化時，是繼續(xù)顯示舊圖像（true）還是暫時不顯示（false）。
image → ImageProvider - 要顯示的圖像。
matchTextDirection → bool - 是否在圖像的方向上繪制圖像 TextDirection。
repeat → ImageRepeat - 未充分容器時，是否重復圖片。
height → double - 圖像的高度。
width → double - 圖像的寬度。
加載資源圖片需要將圖片資源放入工程中，例如：新建images文件夾，將圖片放在該文件夾下，圖片適配則是使用ios的方式1X，2X，3X：
然后在pubspec.yaml中配置assets：
加載資源/網(wǎng)絡(luò)/本地文件圖片/內(nèi)存圖片：
占位圖加載圖片：
圓形圖片：1.裁剪實現(xiàn) 2.CircleAvatar實現(xiàn) 3.Container邊框?qū)崿F(xiàn)
圓角圖片：1.裁剪實現(xiàn) 2.Container邊框?qū)崿F(xiàn)
BoxFit.contain 全圖居中顯示但不充滿，顯示原比例
BoxFit.cover 圖片可能拉伸，也可能裁剪，但是充滿容器
BoxFit.fill 全圖顯示且填充滿，圖片可能會拉伸
BoxFit.fitHeight 圖片可能拉伸，可能裁剪，高度充滿
BoxFit.fitWidth 圖片可能拉伸，可能裁剪，寬度充滿
BoxFit.scaleDown 效果和contain差不多， 但是只能縮小圖片，不能放大圖片
下一節(jié)學習基礎(chǔ)組件之Text
借助BlendMode屬性可以處理圖片的色值，有很多混合方式，官方文檔：
這里只說圖片變黑白
方式一，直接設(shè)置image里的color和colorBlendMode屬性：
方式二，通過ShaderMask設(shè)置blendMode：
flutter開發(fā)中，圖片的引用是必不可少的，所以為了提高效率和精準度，我們需要對不同分辨率的手機使用相對應(yīng)的切圖圖片，本章介紹如何進行 圖片分辨率適配 和 圖片批量拓展處理 。
flutter中會首先根據(jù)系統(tǒng)的devicePixelRatio（每一個邏輯像素包含多少個原始像素，可以通過MediaQueryData.devicePixelRatio來得到）來找對應(yīng)倍數(shù)的文件夾下的圖片，如果沒有對應(yīng)倍數(shù)，找最接近的。
所以在flutter項目中，我們需要構(gòu)建對應(yīng)的倍數(shù)像素文件夾
之后再pubspec.yaml中，配置assets文件后就可以使用了（如使用"assets/images/jay.png"，會自動適配該像素下最接近的jay圖片）。
使用flutter-img-sync插件批量化處理，具體操作如下
目前還不能處理gif、webp等格式的圖片，而且如果和上邊介紹的不同像素比適配方案一起使用的話，由于進行了精準定位，所以指定圖片后就不能進行像素適配，這是目前還存在的較大問題，所以目前兩者方案只能暫時取一使用。
按照給定尺寸進行圖片的解碼，而不是解碼整個圖片的尺寸，用來減少內(nèi)存的占用。
官方文檔：
官方說明：
Instructs Flutter to decode the image at the specified dimensions instead of at its native size.
This allows finer control of the size of the image in ImageCache and is generally used to reduce the memory footprint of ImageCache .
The decoded image may still be displayed at sizes other than the cached size provided here.
使用：
三方庫： cached_network_image 限2.5.0之后版本才可用
設(shè)定最大的緩存寬度和高度 this.maxWidthDiskCache 、 this.maxHeightDiskCache
使用：
從相冊選取圖片，展示時使用指定尺寸寬高進行處理。
使用三方庫：
使用自定義 provider 來指定所需圖片的寬高：
AssetEntityImageProvider 傳入寬高和圖片原圖 AssetEntity 數(shù)據(jù)。
provider 中 key.entity.thumbDataWithSize 方法：
進入 entity 中 thumbDataWithSize 方法：
進入 _getThumbDataWithId 方法中，
進入getThumb：
調(diào)用iOS原生的獲取圖片方法，
進入 getThumbWithId 方法，
原生實現(xiàn)獲取置頂寬高縮略圖方法實現(xiàn)：
使用 iOS 原生類 PHImageManager 的
來獲取縮略圖。
重慶分公司
重慶分公司
