👀寫在前面：Flutter初心者胡亂摸索&臨場上陣的實驗室紀錄♡( ՞ .ˬ. ՞)⸝ (♡˙︶˙♡)

本文HackMD版本網址參見

開始囉!

20230703：Apple Pencil技術研究

• 原先程式測試：已將學期末最終版本載入Mac mini
• 目前方向：先將pencil Kit試結合原本架構,(PencilKit本身仍未包含筆刷項目的貼紙、筆式)
• 遇到問題：Floating Button結合會有重疊問題、Button kit插入位置需是Body而其他架構仍需調整

相關資料/連結

• pencil_kit 1.0.4套件
• Github討論區
• performance issue in drawing app
  -->The performance issue in drawing app using flutter is resolved by using drawPath() and instead of using setState for each points to update use NotifyListener() to refresh than it will be more efficient than setState.
• 重新創作flutter筆刷
• calender drawing use flutter OPensource

20230704：繼續PencilKit+WebSocket

一、PencilKit

1. 測試PencilKit功能在iPadair上是否筆跡會跳轉⇒功能正常，筆跡可正常顯示
2. 將PencilKit結合FAB(Floating Action Button)，導入套件

💡 記得在Pubget後要重啟VScode才能正常執行

Visual Studio Code - Target of URI doesn't exist 'package:flutter/material.dart' =>記得導入套件後要重啟VSCode才能成功！！

• 套件：flutter_speed_dial 7.0.0，用於動畫

flutter_speed_dial 7.0.0

• Bloc⇒「檔案」間的狀態管理，與「資料」的狀態管理不同
• Flutter體驗 Day 26-bloc

結果展示

二、WebSocket

• Work with WebSockets
• Flutter體驗 Day 23-WebSocket

更新資料取得雙向溝通

20230705：Live Streaming

新增另一專案“test_fluter”測試相關套件

壹、即時分享、Video、Camera相關套件

利用python寫server並以flutter連接執行live sharing

Creating a live video streaming application in Flutter

• Cookbook官方文檔—-Vedeo暫停、播放

Play and pause a video

• 使用套件：Video_Player

video_player | Flutter Package

小節 ：Vedio可使用，但為現有影片的播放暫停

• Cookbook官方文檔—-Camera攝影、展示

Take a picture using the camera

💡 注意：要在ios/Runner/Info.plist檔案中新增對應camera、microphone權限，否則會開啟失敗

小節：Camera 可使用(可直接加入在所需範圍中)

貳、Screen Sharing(螢幕共享)

一、中文keyword：ZEGO

• 另尋套件：zego_express_engine 3.6.1

需另外下載zego sdk

zego_express_engine | Flutter Package

Flutter 移動端螢幕採集（錄屏）方案分享_派大星星星星 - MdEditor

ZEGO公司網站

Flutter Dart实时音视频实现流程 - 开发者中心 - ZEGO即构科技

問題：Package持續引入失敗

已做：

小節：需另外下載zego sdk與進行各個room與id設定，且需使用其公司的server，目前在import階段就不行使用，而中文搜尋結果多收斂在本產品

二、英文keyword：

1. AgoraIO

• Github討論區：AgoraIO-Extensions⇒ Screen sharing functionality

Screen sharing functionality · Issue #109 · AgoraIO-Extensions/Agora-Flutter-SDK

• Agoral IO官方Github

Agora.io

小節：兩者都會額外需要AppID與Certificate，並需要在該對應公司創建開發者帳戶並連結API作為使用

2. LiveKit

• 官網文件

LiveKit Docs

三、插曲

剛剛在試其他Github專案zip檔時載到其他sdk導致Path指向錯誤的問題，刪除該sdk後出現flutter no found

💡 Tip：開啟setting檔案並把路徑改為原本的正確路徑即可

修改為原本正確

四、輔助工具

1. VSCode Compilot
   需要連結github Compilot⇒要學校信箱+ 驗證

如何在 VS Code 中使用 GitHub Copilot

能節省四成開發時間的工具？ GitHub Copilot 的介紹與心得分享

但卡在學生驗證問題(日期)

1. ChatGPT

四、電子白板

• Agora Blog

Blog

• Agora文件

Interactive Whiteboard Fastboard quickstart | Agora Docs

相關套件版本參考

• agora_rtm

agora_rtm | Flutter Package

• agora_rtc_engine

agora_rtc_engine | Flutter Package

💡 注意：GPT可以問程式架構，但是版本相關依據還是要以最新更新的版本號為主，否則會顯示fail error，所以要隨時注意pub.dev上的版本號

• Agora互動白板文檔

开启和配置互动白板服务 - 互动白板 - 文档中心 - 声网Agora

Interactive Whiteboard Samples and demos | Agora Docs

目前有開啟Agora帳戶與新增專案，獲得“APP IP”，且解決import fail問題，但程式仍not work

Agora提供服務項目

五、Screen套件

作為使用公司產品外的替代方案

screen | Flutter Package

小節：版本過舊失敗

20230706

壹、Running Error

出現error

Error (Xcode): File not found: /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/lib/arc/libarclite_iphonesimulator.a

Error (Xcode): Linker command failed with exit code 1 (use -v to see invocation)

Xcode 14 and iOS 5.5 simulators

方向一：模擬器問題

在Xcode中按照以下順序新增一個模擬器

問題未解決：flutter -v印出

方向二：Xcode衝突問題

按照本篇方法刪除Pods紀錄，未奏效

Error Launching Application - Flutter - iOS

💡 小結：直接另外開啟專案執行便可，判斷是在先前測試或下載github專案時改到profile檔導致的Simulator開啟路徑問題，並且實機不便於同時開啟兩個不同的專案交互測試

方向三：實機上開發帳戶額度問題

💡 因為Apple限制免費開發者帳戶一次最多只能有三個APP的執行限度，因此超過時會跳出警告，需要手動刪除！

The maximum number of apps for free development profiles has been reached. Xcode 11.5

像是目前已經有三個已使用的App額度，因此刪除一個便可以順利執行

貳、Sharing相關

一、flutter平台整合提供的相關Channel

Writing custom platform-specific code

A Flutter Channel to Share a File on iOS and Android

二、Apple Developer提供

• ReplayKit

ReplayKit | Apple Developer Documentation

iOS 和 iPadOS 的 ReplayKit 安全性

• enableX Flutter

Flutter SDK – Video API

How to Build a Video Streaming App With Screen Sharing Using Flutter

三、Agora Running

使用agora_rtc_engine 範例程式

agora_rtc_engine | Flutter Package

將程式加上已啟用的Agora IO連接資訊，並且開啟相機與麥克風權限便可建立連線

The app's Info.plist must contain an NSMicrophoneUsageDescription key with a string value explaining to the user how the app uses this data

並且會產生兩個debugger and profiler供使用

• Observatory debugger and profiler
• Flutter DevTool debugger and profiler

💡 小結：目前Agora連接API沒問題(Token, App ID)，且在開啟機體權限後可以正常生成而不會閃退，但尚未測試多於一台機器的連線情況

四、Flutter Dev

• iThome 關於flutter的dev tool(一)

DevTools

五、Apple方便快捷鍵

• 快速切至桌面
  • fn + f11

20230707

壹、Collaborative Writing

一、Collaborative

Create a Collaborative Rich Text Editing Experience with Flutter Web and Appwrite

• Apple Collaboration

Collaboration | Apple Developer Documentation

• Collaboration feature

Adding the collaboration feature in my flutter app

netease_roomkit | Flutter Package

二、Agora Again

{%youtube hN4Q04ODOEw%}

• 啟用電子白板(帳戶端取得access token)

Interactive Whiteboard Enable Interactive Whiteboard | Agora Docs

flutter SDK

https://github.com/netless-io/Whiteboard-Flutter

三、Fluffyboard

https://github.com/Y0ngg4n/fluffy_board

貳、其他功能

一、Zoom Widget

縮放相關

zoom_widget | Flutter Package

參、開完會老師建議

一、延遲相關：SQL like file

肆、Error問題

Could not build the precompiled application for the device. Error (Xcode): File not found: /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/lib/a rc/libarclite_iphoneos.a

• Git

決定先在實驗室Mac上安裝Git比較方便，用homebrew的方式下載

• 將terminal增加權限

• Xcode版本：14.3

在git clone完的專案terminal輸入指令open ios/Runner.xcworkspace

• 嘗試解法

Cocoapods Warning - CocoaPods did not set the base configuration of your project because because your project already has a custom config set

把podlock刪掉後加上本段

post_install do |installer|

installer.generated_projects.each do |project|

project.targets.each do |target|

target.build_configurations.each do |config|

config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '13.0'

end

end

end

end

How to fix Flutter stuck at “running pod install…” when running on vscode building on simulator

出現其他error

Lexical or Preprocessor Issue (Xcode): 'Flutter/Flutter.h' file not found /Users/widelab/.pub-cache/hosted/pub.dev/webview_flutter_wkwebview-2.9.5/ios/Classes/FWF NavigationDelegateHostApi.h:4:8

Lexical or Preprocessor Issue (Xcode): 'Flutter/Flutter.h' file not found /Users/widelab/.pub-cache/hosted/pub.dev/webview_flutter_wkwebview-2.9.5/ios/Classes/FWF WebsiteDataStoreHostApi.h:4:8

https://github.com/tekartik/sqflite/issues/952

我把Xcode玩壞了嗚嗚嗚🥶（有救回來

💡 原始的Project運行前記得照以下流程走一次，才不會有問題

1. flutter pub cache clean
2. flutter clean
3. flutter pub get
4. flutter run

Build process failed, no corre app en windows