Flutter初探--常用依賴包

國(guó)外地址：

創(chuàng)新互聯(lián)公司主要從事網(wǎng)站設(shè)計(jì)制作、網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)應(yīng)城,10多年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來(lái)電咨詢建站服務(wù):18980820575

國(guó)內(nèi)鏡像：

以 flutter_screenutil 為例

路由框架 annotation_route

狀態(tài)管理 provider

UI適配 flutter_screenutil

刷新控件 flutter_easyrefresh

網(wǎng)絡(luò)請(qǐng)求 dio

toast控件 fluttertoast

圖表庫(kù) charts_flutter

網(wǎng)絡(luò)監(jiān)聽(tīng) connectivity

事件總線 event_bus

日歷組件 table_calendar

官方webview webview_flutter

第三方webview flutter_webview_plugin

該篇文章為常用依賴包總結(jié)，用來(lái)記錄所需要的常用依賴包，后續(xù)會(huì)不斷擴(kuò)充內(nèi)容~

離不開(kāi)DART的Flutter（dart篇）

hello world例子

在終端打印字符串‘Hello World!’

計(jì)算斐波那契數(shù)列

一個(gè)簡(jiǎn)單的類

計(jì)算兩點(diǎn)距離

異步并發(fā)示例

使用了Isolate

1.面向?qū)ο?/p>

對(duì)于面向?qū)ο筮@個(gè)概念，相信了解Java的同學(xué)對(duì)這個(gè)概念一定不會(huì)陌生。

例如：我們有個(gè)Person Object他有很多特征和行為。

這些都是這個(gè)Person Object的屬性。

也就是因?yàn)橛辛诉@些特征，行為等等才決定了這個(gè)人是誰(shuí)。

那么回到Dart當(dāng)中，所有的都是對(duì)象，那么在就可以可以跟進(jìn)對(duì)象的屬性的特征，方法等等來(lái)進(jìn)行編程。

之所以我們?cè)谶@里又特別強(qiáng)調(diào)了一下面向?qū)ο蟮母拍?，是因?yàn)檫@個(gè)概念在Dart語(yǔ)言當(dāng)中，至關(guān)重要！

2.最重要的幾個(gè)概念

3.Dart的部分特性

4.Dart的內(nèi)置庫(kù)

包名

描述

dart:asynv

異步編程，提供Future，Stream類

dart：collection

集合

dart：convert

不同類型的字符編碼解碼

dart：core

Dart語(yǔ)言核心功能，內(nèi)置類型

dart:html

網(wǎng)頁(yè)開(kāi)發(fā)用到的庫(kù)

dart:io

文件讀寫，IO相關(guān)

dart:math

數(shù)字常量以及函數(shù)，隨機(jī)算法等

dart:svg

事件和動(dòng)畫矢量圖支持

綜上述所說(shuō)要想學(xué)Flutter，先學(xué)Dart！關(guān)于Flutter下篇我會(huì)講到。為什么離不開(kāi)dart！

有關(guān)更多面經(jīng)、核心技術(shù)筆記；自己也是從事Android開(kāi)發(fā)5年有余了；整理了一些Android開(kāi)發(fā)技術(shù)核心筆記和面經(jīng)題綱， 如有需要的同學(xué)請(qǐng)私信我回復(fù)“核心筆記”或“面試”領(lǐng)?。?/p>

Flutter Android端集成排坑 - armeabi 適配 & FlutterBoost

Flutter可以算是當(dāng)下最火熱的新技術(shù)之一，我現(xiàn)在所在團(tuán)隊(duì)也準(zhǔn)備將Flutter技術(shù)應(yīng)用到線上工程中。

關(guān)于混合工程，官方文檔其實(shí)寫的已經(jīng)比較清楚了，按著文檔走一般問(wèn)題不大，

但是有一點(diǎn)值得注意的是，F(xiàn)lutter工程引入的庫(kù)的gradle的 buildTypes 要與原工程保持一致，如果不一致需要手工添加。

進(jìn)入正題，現(xiàn)在Flutter官方默認(rèn)只提供armeabi-v7a、arm64-v8a、x86和x86-64，其中x86和x86-64是為模擬器準(zhǔn)備的。目前我們使用的SDK大部分只使用了armeabi架構(gòu)，直接使用我們會(huì)遇見(jiàn)找不到 libflutter.so，libapp.so 的情況，所以我們需要對(duì)FlutterSDK做一定的改造。

首先我們要了解下Flutter編譯產(chǎn)物，因?yàn)椴煌姹井a(chǎn)物是不同的，這里我們只針對(duì)Flutter 1.9.1-hotfixes來(lái)說(shuō)。除了資源文件之外，F(xiàn)lutter打包會(huì)生成兩個(gè)非常重要的so庫(kù)，他們分別是 libflutter.so，libapp.so 。其中 libflutter.so 是Flutter的SDK產(chǎn)物而 libapp.so 正是我們編寫的dart文件的產(chǎn)物。默認(rèn)情況下，這兩個(gè)文件都會(huì)出現(xiàn)在armeabi-v7a中，因此我們要作出對(duì)應(yīng)的改造。

libflutter.so 位于FlutterSDK中，這里順帶提一句，除了這對(duì)不同CPU架構(gòu)，它還分為Debug版和Release版，它們的區(qū)別在于Debug是為JIT編譯方式打造的，體積較大而Release是為AOT編譯方式打造的，體積很小。對(duì) libflutter.so 的改造，只要將其移動(dòng)文件路徑即可，運(yùn)行以下腳本即可，此腳本來(lái)自美團(tuán)分享的Flutter文章。

移動(dòng)完了 libflutter.so 之后我們打包發(fā)現(xiàn)， libapp.so 仍然會(huì)出現(xiàn)在armeabi-v7a中，所以第二部我們就是移動(dòng) libapp.so 。這個(gè)需要更改 flutter.gradle ，我們?cè)?flutter.gradle 的45行可以看到如下定義，它定義了我們的環(huán)境。

在524行我們可以看到，abiValue的取值就是根據(jù)上述定義值。

所以結(jié)論很簡(jiǎn)單，只要將

private static final String ARCH_ARM32 = "armeabi-v7a";

改為

private static final String ARCH_ARM32 = "armeabi";

就可以完成對(duì)與 libflutter.so 的移動(dòng)。

前期工作我們都做好了，打成aar就非常簡(jiǎn)單了

直接使用 flutter build aar --target-platform android-arm

打出來(lái)后可以解壓檢查下 libflutter.so，libapp.so 是否都在armeabi文件夾下即可。

說(shuō)完了armeabi適配問(wèn)題，這里下說(shuō)下有關(guān)于有關(guān)于FlutterBoost的接入。這個(gè)東西接入有兩點(diǎn)要注意。

在主app內(nèi)加上即可，常規(guī)操作，強(qiáng)制統(tǒng)一support包的版本號(hào)

注釋flutter.gradle第655行。因?yàn)榫幾g過(guò)程中，會(huì)去初始化插件項(xiàng)目的buildType下面的debug配置，而插件項(xiàng)目下并未配置debug，導(dǎo)致報(bào)錯(cuò)。

如果發(fā)現(xiàn)文章中有錯(cuò)誤或者有更好的解決方案歡迎指正留言，當(dāng)然如果本篇文章幫助你解決了問(wèn)題，也不要吝嗇你的感謝。謝謝各位。

Flutter圖表庫(kù)fl_chart的使用解析(二)-折線圖

附上開(kāi)發(fā)環(huán)境：

折線圖是一個(gè) Widget，和普通 Widget一樣聲明即可：

LineChart 的構(gòu)造參數(shù)是一個(gè) LineChartData，其屬性如下：

配置了三條線，所以 lineBarsData 對(duì)應(yīng)的數(shù)組有三個(gè)元素。

看下 LineChartBarData 屬性：

圖表四個(gè)方向的邊框，有總顯示開(kāi)關(guān)，決定是否顯示和隱藏所有，如果開(kāi)啟，又想隱藏個(gè)別邊框，需要設(shè)置透明色。

FlBorderData 對(duì)應(yīng)邊框信息，有兩個(gè)參數(shù)， show 就是顯示與隱藏的邊框， border 是邊框數(shù)據(jù)。

FlTitlesData 可以配置4條坐標(biāo)軸，也有一個(gè)總開(kāi)關(guān)，如果要顯示坐標(biāo)軸，就設(shè)為 true ，然后配置對(duì)應(yīng)位置的數(shù)據(jù)：

每個(gè)位置對(duì)應(yīng)的是 SideTitles ，設(shè)置如下：

標(biāo)題是顯示在坐標(biāo)軸后面的文字標(biāo)題，每個(gè)軸對(duì)應(yīng)一個(gè)。

附上源碼

九、Flutter之webview

Flutter的webview常用的第三方庫(kù)有 flutter_webview_plugin 、 webview_flutter ，后者的文檔較少，暫先學(xué)習(xí)flutter_webview_plugin。

添加依賴

導(dǎo)入包

iOS端info.plist配置，其中NSAppTransportSecurity節(jié)點(diǎn)是為了支持http協(xié)議

一個(gè)簡(jiǎn)單的demo

要監(jiān)聽(tīng)鏈接跳轉(zhuǎn)的話，實(shí)現(xiàn)onUrlChanged即可

添加依賴

導(dǎo)入包

iOS端info.plist配置

一個(gè)簡(jiǎn)單的demo

但是在webview里點(diǎn)擊鏈接跳轉(zhuǎn)的時(shí)候，測(cè)試機(jī)有時(shí)會(huì)跳轉(zhuǎn)到系統(tǒng)瀏覽器上，并且點(diǎn)擊文本框無(wú)法彈出鍵盤，交互性很弱。

二者共同的缺點(diǎn)是與javascript難以交互，目前只能實(shí)現(xiàn)Flutter-JS傳遞信息，還沒(méi)找到可以進(jìn)行完美交互的第三方庫(kù)。并且一些常見(jiàn)的協(xié)議還不支持，比如撥號(hào)和調(diào)用攝像頭等，期待后續(xù)完善。

Flutter 集成第三方藍(lán)牙庫(kù)踩坑記錄

最近在寫flutter應(yīng)用，需要集成藍(lán)牙功能，用了一個(gè)第三方的庫(kù)，踩了一些坑，做一下記錄。

這是庫(kù)的地址 PhilipsHue/flutter_reactive_ble: Flutter library that handles BLE operations for multiple devices. (github.com)

安卓主要的坑就是，在使用藍(lán)牙功能的時(shí)候，需要獲取定位權(quán)限，這個(gè)需要?jiǎng)討B(tài)獲取。

集成之后，編譯出錯(cuò)，提示Swift Compiler Error。

（1）首先嘗試，修改對(duì)應(yīng)三方庫(kù)的Swift編譯版本。

我這邊嘗試修改，沒(méi)有成功。

（2） 沒(méi)辦法，我這邊手動(dòng)修改三方庫(kù)的源碼文件，進(jìn)行修復(fù)。重新編譯成功。

其他問(wèn)題

分享標(biāo)題：flutter必備庫(kù),flutter完全手冊(cè)
URL標(biāo)題：http://www.sd-ha.com/article10/dscopdo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供全網(wǎng)營(yíng)銷推廣、網(wǎng)站排名、響應(yīng)式網(wǎng)站、品牌網(wǎng)站設(shè)計(jì)、網(wǎng)站設(shè)計(jì)、品牌網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)