【- Flutter 桌面篇 -】 FlutterUnit win版閃亮登場

零、前言

FlutterUnit是【張風捷特烈】長期維護的一個開源項目， 歡迎star ，
以前讓FlutterUnit支持了MacOS： FlutterUnit mac版閃亮登場
前幾天發了一篇嚐鮮Windows的文章: Flutter&Windows應用嚐鮮

你們能夠在下面連接下載食用體驗:

FlutterUnit.apk 下載	FlutterUnit mac版 下載	FlutterUnit win版 下載

• 【Android版FlutterUnit】: toly1994.com/file/Flutte…
• 【iOS版FlutterUnit - 本身下載項目運行】: github.com/toly1994328…
• 【MacOS版FlutterUnit】: toly1994.com/file/flutte…
• 【Windows版FlutterUnit】: toly1994.com/file/Flutte…

---

• 鎮樓圖

---

1、如何運行FlutterUnit windows

1.若是你只是想用

能夠下載我打的包，而後運行FlutterUnit.exe便可

在我電腦上是能夠運行的，別人電腦不知道怎麼樣

---

2. 若是須要運行FlutterUnit&Windows項目

• 確保你的Flutter&Windows開發環境，若是不知道，可見上篇: Flutter&Windows應用嚐鮮
• 克隆 toly1994328/FlutterUnit 項目的flutter_unit_windows分支

• 獲取依賴包: flutter pub get
• 運行命令: flutter run -d windows， 或直接經過AndroidStudio 選擇設備運行

---

3. 如何打包項目

• 打包windows: flutter build windows,在build/windows/Build/Release中能夠看到應用

---

2、關於FlutterUnit&Windows一些處理

1. Flutter&Windows 數據庫的支持

pub插件地址： pub.flutter-io.cn/packages/mo…

GitHub主頁 : github.com/simolus3/mo…
至於怎麼用的，本文就不說了，有興趣的能夠本身研究一下。

有一點須要注意的是，你須要本身將sqlite3.dll拷貝到項目根目錄下才能使用。在打包以後也須要將sqlite3.dll拷貝到項目根目錄。
複製代碼

---

2. 屏幕尺寸問題

根據官方桌面項目的處理，可使用window_size插件

import 'dart:io';
import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter_unit_mac/views/app/bloc_wrapper.dart';
import 'views/app/flutter_app.dart';
import 'package:window_size/window_size.dart' as window_size;

void main() {

  WidgetsFlutterBinding.ensureInitialized();
  // 獲取窗口信息，而後設置窗口信息
  window_size.getWindowInfo().then((window) {
    if (window.screen != null) {
      final screenFrame = window.screen.visibleFrame;
      final width = max((screenFrame.width / 2).roundToDouble(),1100.0);
      final height = max((screenFrame.height / 2).roundToDouble(), 850.0);
      final left = ((screenFrame.width - width) / 2).roundToDouble();
      final top = ((screenFrame.height - height) / 3).roundToDouble();
      final frame = Rect.fromLTWH(left, top, width, height);
      //設置窗口信息
      window_size.setWindowFrame(frame);
      //設置窗口頂部標題
      window_size
          .setWindowTitle('Flutter Unit Windows');

      if (Platform.isMacOS) {
        window_size.setWindowMinSize(Size(800, 600));
        window_size.setWindowMaxSize(Size(1600, 1200));
      }
    }
  });
  runApp(BlocWrapper(child: FlutterApp()));
}
複製代碼

---

3. 待處理的其餘問題

• 因爲shared_preferences未支持windows,使用設置的儲存被我註釋了，即暫時沒法保存配置

---

2、. FlutterUnit win 功能簡述

因爲桌面端錄屏出的gif太大了，就不放動圖了，全部功能同移動端

使用詳情可參見: 【 FlutterUnit 食用指南】 開源篇

---

1. FlutterUnit主頁界面

• 對於桌面來講，最麻煩的當屬導航欄了，若是直接用底欄或頂欄，那會很是醜
• 一般須要左欄，固然這些對於動手能力超強的我，都是小菜。有就用，沒有就造。
• 桌面程序通常都很寬,能夠用GridView根據狀況分多欄顯示item,這樣會好看些。

---

2. 左滑菜單欄

• 單擊右側導航欄底部的設置能夠打開左側的菜單
• 也能夠經過左邊滑來打開左側的菜單，菜單內容保持一致，功能保持一致

---

3. 組件詳情頁

• 調整相關組件和介紹的位置，同排顯示，好看一些。

---

• 因爲Share插件還不支持windows,這裏代碼分享的功能直接改爲代碼複製。
• 代碼面板的展開功能依舊存在,可經過展開按鈕進行展開。

---

4.收藏集功能正常

• 收藏集的增刪改查操做和移動端保持一致

---

5. 組件詳情頁的添加收藏

功能保持一致

---

6. 搜索頁

• 模糊查詢

• 星級查詢

---

四.FlutterUnit近期更新

距離上一次統計已經一個多月了,因爲這段時間比較忙，更新的不怎麼頻繁

1. 移動端支持顯示性能浮層

.	.	.

---

2.增長Widget

CustomSingleChildLayout	CustomMultiChildLayout	LayoutId

---

LayoutBuilder	BackdropFilter	CupertinoSegmentedControl

---

LayoutBuilder	BackdropFilter	CupertinoSegmentedControl

---

AbsorbPointer	IgnorePointer	湊陣容

---

NestedScrollView	SliverOverlapInjector	SliverOverlapAbsorber

---

3.標準結尾

歡迎加入編程技術交流聖地[-Flutter羣-]，一塊兒交流。我想要營造一個分享Flutter技術、問題，平等交流的地方，絕非一個需求/新手答疑羣。
注1: 張口就需求的人勿擾；招聘、廣告、內推勿擾；庸俗劣質言談者勿擾。
注2: 提問前請準備好充分的描述及相關代碼。
注3: 每週三，羣裏英文日,全部人需用英文交流。

---

@張風捷特烈 2020.07.09 未允禁轉
個人公衆號:編程之王
聯繫我--郵箱:1981462002@qq.com --微信:zdl1994328
~ END ~