鎮(zhèn)樓圖
一、如何運行出FlutterUnit mac1. 如何使用Flutter mac目前穩(wěn)定版(Stable)本并不支持macos,你可以切換到master分支進行體驗。
---[· flutter config --enable-macos-desktop
---[· flutter --version
Flutter 1.18.0-7.0.pre.46 · channel master ·
https://github.com/flutter/flutter.git
Framework · revision 1f132e90f8 (11 days ago) · 2020-04-23 11:00:12 +0530
Engine · revision d3f1c08f52
Tools · Dart 2.9.0 (build 2.9.0-2.0.dev 64b8ded48b)
復制代碼
2. 如何獲取FlutterUnit mac代碼由于移動端和桌面端的情況有很大的不同，而且兩者需要的SDK不同。
所以我并不在原移動端代碼中進行適配，而是新建分支進行兩個獨立的項目。
其實兩種完全不同的情景，并沒有必要強行合一，否則會感覺到處束手束腳。
判斷起來也會讓代碼變的復雜和難以閱讀，獨立維護也許是更好的選擇。
3. 如何運行和打包
二、. FlutterUnit mac 功能簡述由于mac端錄屏出的gif太大了，就不放動圖了，所有功能同移動端
使用詳情可參見: 【 FlutterUnit 食用指南】 開源篇
本文會說一下我做FlutterUnit mac端的原因和一些界面的變動。
1. FlutterUnit主頁界面對于桌面來說，最麻煩的當屬導航欄了，如果直接用底欄或頂欄，那會非常丑 通常需要左欄，當然這些對于動手能力超強的我，都是小菜。有就用，沒有就造。 桌面程序一般都很寬,可以用GridView根據(jù)情況分多欄顯示item,這樣會好看些。
2. 左滑菜單欄
3. 組件詳情頁
由于Share插件還不支持macos,這里代碼分享的功能直接改成代碼復制。 代碼面板的展開功能依舊存在,可通過展開按鈕進行展開。
4.收藏集功能正常 
5. 組件詳情頁的添加收藏功能保持一致
6. 搜索頁其實適配到macos我就花了小半天的時間。主要就是主頁右邊欄的設(shè)計和實現(xiàn)。
這也得益于項目的清晰，我知道哪些文件是干嘛的，所以抽離是很重要的，酌情抽出變量、方法或類，不要什么東西都塞在一起，一旦代碼變動就是滅頂之災。另外bloc維護的業(yè)務(wù)邏輯可以絲毫不動，只需將相關(guān)頁面的一些結(jié)構(gòu)進行調(diào)整即可，這也是bloc的優(yōu)勢。
三、做FlutterUnit mac端的原因1. 其一: 裝X
2. 其二: 讓更多人知道flutter的桌面應用我接觸flutter也有一年半了，半年前開始從事flutter桌面應用的開發(fā)，踩過很多坑，也學到很多東西。一切的經(jīng)歷將我對flutter的理解提升了一個層次?？赡芎芏嗳诉€在觀望flutter在移動端的情況 。卻已不知，flutter的桌面應用已在茁壯成長，特別是很多三方插件已經(jīng)有macos支持。
一套代碼運行在所有的設(shè)備上，我稱為統(tǒng)一的跨平臺解決方案,由于設(shè)備的應用場景不同，大小不同，強行進行適配感覺維護的成本太高，這是平臺本身的局限性。
我越來越感覺Flutter 并非是一個統(tǒng)一的跨平臺解決方案，而且可以給編程者一個跨平臺的可能性。其中最重要的一點是: 任何一個程序員，即使它不會C++、C#、Java、Js,也可以通過flutter/dart代碼寫出mac程序、寫出windows程序、寫出android程序、寫出ios程序、寫出linux程序、寫出web程序，這就是Flutter所提供的可能性。做夢都沒想過玩移動端的我能做出一個mac程序、寫出一個windows程序。
當然只會flutter/dart，瓶頸也會存在的，對于平臺的特性你不太可能完全理解。但也無須了解所有的平臺特性，畢竟軟件的開發(fā)并非一個人的事。插件生態(tài)的日益豐富，會逐漸降低flutter開發(fā)者對平臺的依賴性。對于特定領(lǐng)域、特定功能的軟件、也許會出現(xiàn)各端的flutter插件師職業(yè)。
天下大勢，合久必分，因為沒有一個人可以抗住所有的事,一人玩轉(zhuǎn)六端平臺也不切實際。精一而協(xié)同,各司其職,這是解決大問題的有效手段。就像人體由各種功能的細胞共同協(xié)作，維持個體生命，而不是一個萬能細胞統(tǒng)合作用。
統(tǒng)一的跨平臺解決方案是個美好而偉大的夢。就像讓所有人都說一種語言溝通一樣，也許只是一個夢而已。它也許不會終止于Flutter。但Flutter所提供的讓編程者跨平臺的可能性，就像一個萬能的翻譯機，這無疑是里程碑式的，會閃爍它的光芒。在此，雖然我個人能力微薄，但愿舉起這星火，F(xiàn)lutterUnit將是這根火把，與我前行。你們要來，便隨; 要離，便去, 皆與我無關(guān)。
3. 其三: 最重要的一點,為了數(shù)據(jù)維護的方便其實除了FlutterUnit之外，之前還有一個FlutterUnit tool的項目
這個項目是用來維護數(shù)據(jù)庫的?？催^FlutterUnit源碼的應該都知道，FlutterUnit是由本地數(shù)據(jù)庫驅(qū)動的。沒錯，就是那個flutter.db。其中關(guān)于組件信息、詳情信息、詳情代碼、收藏集信息全部都儲存在這個數(shù)據(jù)庫中。
但這樣做有個很大的缺點: 數(shù)據(jù)的更新非常困難，比如修改了實例代碼，或修復了文案，或者再拓展一個組件都要去修改數(shù)據(jù)庫，這樣維護的成本非常高。于是聰明的我想到了一個解決方案。定義規(guī)則和解析規(guī)則。
于是我花了兩天，對所以的組件源碼進行重構(gòu)，滿足如下格式
/// create by 張風捷特烈 on 2020-03-24
/// contact me by email 1981462002@qq.com
/// 說明:
///
// {
// "widgetId": 34,
// "priority": 1,
// "name": "Divider顏色和粗細",
// "subtitle": "【color】: 顏色 【Color】\n"
// "【thickness】: 線粗細 【double】",
// }
import 'package:flutter/material.dart';
class CustomDivider extends StatelessWidget {
@override
Widget build(BuildContext context) {
var dataColor = [
Colors.red, Colors.yellow,
Colors.blue, Colors.green];
var dataThickness = [1.0, 2.0, 4.0, 6.0];
var data = Map.fromIterables(dataColor, dataThickness);
return Column(
children: dataColor
.map((e) => Divider(
color: e,
thickness: data[e],
))
.toList(),
);
}
}
復制代碼
通過node_parser.dart進行解析。爬取整個項目，一一解析生成bean。
再通過tool插入數(shù)據(jù)庫中。這樣一來，我可以隨意修改和添加介紹組件的信息。只需不到1s的時間就能爬取全部所有文件進行數(shù)據(jù)同步，這就是工具帶來的價值。但這價值的背后，是一個正則的匹配、規(guī)則的構(gòu)思和實踐的過程。遇到問題和解決問題的過程。當我寫完整個工具時，那這感覺無疑是暢快的,是能力付諸于現(xiàn)實的快感。
當然這個工具我并未提交，也不會影響到FlutterUnit的任何展現(xiàn)。
使用mac的有點在于可以很方便地訪問文件,進行爬取分析，這是移動端所不及的。
最后挖個新坑: 我的個人博客正在整理中: king./
不久的將來會有一個Flutter相關(guān)的長期更新計劃。這時候適合喊一句:
我是張風捷特烈，那個要成為編程之王的男人。Bye
|
