2026年1月29日 星期四

 

Macbear 3D 0.5.0 更新:讓場景動起來!環境反射 (Cubemap Reflection) 正式登場

在 3D 渲染的世界中,「光澤」與「反射」是提升質感的關鍵。

今天發佈的 Macbear 3D 0.5.0,我們帶來了一個重量級更新:環境反射 (Cubemap Reflection)。這項技術讓 3D 物體不再只是死板的顏色,而是能與周遭環境產生視覺上的互動。

💎 讓物體呈現精品的質感

在之前的版本中,物體主要依賴 Diffuse 紋理與光照。從 0.5.0 開始,你可以透過簡單的參數設定,讓物體具備反射天空盒 (Skybox) 的能力:

  • 金屬感:讓球體像不鏽鋼一樣反射出天空。
  • 光滑表面:為賽車模型或建築外牆增添高質感的反光。

🛠 技術亮點:輕量且高效

為了保持 Macbear 3D 一貫的輕量化特點,這次的反射機制採用了 Dual-Pass (雙程渲染) 優化:

  1. 第一遍渲染:繪製物體的基本材質與細節。
  2. 第二遍反射:利用 
    WebGL.EQUAL
     深度測試函數,僅針對已繪製的像素進行「加疊式」反射 (Additive Blending),並複用天空盒的 Cubemap 資源。

這種做法能在不顯著增加記憶體與運算負擔的情況下,讓視覺效果有跳躍式的提升。

🎥 視覺對比

你在上面的示意圖中可以看到,幾何體在光影下展現出的立體感,正是得益於環境反射對細節的捕捉。

2026年1月24日 星期六

Macbear 3D Engine 0.4.0:正式支援 Skinned Mesh 骨骼動畫

大家好!在這次 Macbear 3D Engine 0.4.0 的更新中,我們帶來了令人興奮的重大特性:正式支援 Skinned Mesh(皮膚網格)與 Skeletal Animation(骨骼動畫)

這項更新讓 Macbear 3D 從靜態的幾何渲染,跨越到了動態角色表現的新階段。

核心特性:骨骼動畫系統

在 0.4.0 版本中,引擎現在可以完美處理包含骨骼結構與皮膚權重(Bone Weights)的 3D 模型:

  • Skinned Mesh 渲染:支援從 glTF/GLB 格式載入包含皮膚權重的模型,並透過頂點著色器(Vertex Shader)即時計算骨骼變形。
  • 骨骼層級結構(Skeletal Hierarchy):完美支援複雜的骨骼樹狀結構,確保每一個關節的運動都能正確帶動相連的肢體。
  • 動畫播放器(M3Animator):內建動畫解析與播放器,能流暢地執行角色走動、跑步或各種複雜的動作序列。

為什麼這很重要?

對於遊戲開發或互動式 3D 應用來說,角色動畫是靈魂所在。透過正式支援 Skinned Mesh,開發者現在可以在 Flutter 中輕鬆呈現栩栩如生的 3D 角色,並結合我們先前的級聯陰影(CSM)技術,呈現出更具質感的視覺表現。


立即體驗

您可以透過最新的 example 專案,查看如何載入並執行包含骨骼動畫的角色模型。


感謝您的支持,讓我們一起在 Flutter 上創造更多精采的 3D 體驗!

      2026年1月17日 星期六

       pub.dev macbear_3d 0.3.0 /packages/macbear_3d

      🚀 Macbear 3D v0.3.0 更新:光影穩定性與級聯陰影的技術飛躍

      Macbear 3D 引擎正式迎來 v0.3.0 版本!這個版本是自引擎發佈以來在渲染品質上最重要的一次升級,我們將重點放在了底層陰影算法的全面重構,為開發者帶來更穩定、更專業的 3D 視覺表現。

      本版本核心亮點:影子的全方位進化

      1. 級聯陰影貼圖 (Cascaded Shadow Maps, CSM) 🌊

      在 3D 場景中,近處需要細節,遠處需要廣度。我們引入了 CSM 技術,支持多達 4 個級聯層次。引擎會根據相機深度動態分配陰影資源,讓大場景中的陰影從近到遠都能維持極高的清晰度,徹底解決了傳統單一陰影貼圖在遠處模糊、近處鋸齒的問題。


      2. 極致的陰影穩定性 (Shadow Stability) 🛡️

      解決了 3D 渲染中最棘手的「陰影閃爍 (Shimmering)」問題:

      Bounding Sphere 投影:改用基於包圍球的投影算法,確保陰影投影不會因相機的微小旋轉而產生像素抖動。

      Texel Snapping:精準的紋素對齊技術,保證影子在相機移動時始終與場景像素契合,視覺感官更為平滑。

       

      3. 告別「邊緣漏光」:Shadow Pass 渲染優化 💡

      我們優化了 Shadow Pass 的剔除邏輯,全面採用 Front-face (CCW) 渲染 模式。這一技術細節有效地防止了模型邊緣常見的「漏光 (Light Leakage)」現象,讓角色與物體的陰影根部與幾何體完美貼合。


      4. 動態陰影模式與性能優化 🔄

      實時切換:現在支持在運行時動態切換「標準陰影」與「CSM 級聯模式」,靈活平衡性能與品質。

      圖集優化 (Shadow Atlas):改進了陰影圖集的空間管理,減少顯存佔用的同時提升了渲染效率。

      在 pub.dev 上確實有一些發展中的 3D 相關專案,但每個專案的技術路徑和目標場景都不太一樣。以下是幾類與 macbear_3d 相關或競爭的專案分析:

      1. 官方/次世代技術類 (GPU & Impeller) flutter_scene:
      地位:這是 Google 官方正在推進的 3D 渲染庫,基於 Flutter 新的底層渲染引擎 Impeller。
      特點:目前還在 early preview 階段,非常依賴 Flutter 的 experimental 分支。
      與你的差異:你的引擎目前基於 ANGLE (OpenGL ES),兼容性在現有的渲染平台上非常穩定,而 flutter_scene 則代表了未來 Impeller 時代的原生 3D 方向。
      2. 基於成熟引擎封裝類 (High-level wrappers) flutter_3d_controller / model_viewer_plus:
      技術:背後通常是封裝了 Google 的 <model-viewer> (基於 Webview) 或原生端的渲染器。
      缺點:它們更像是一個「播放器」,對於自定義 Shader、底層矩陣操作和複雜的場景邏輯(如你的 CSM 級聯陰影自研算法)控制力較弱。
      3. 社群自研引擎類 (Native Dart/GL) three_dart:
      技術:試圖在 Dart 中重現 three.js 的架構。
      現狀:雖然架構龐大,但更換渲染底層的進度較慢,且代碼量巨大,學習曲線較陡。
      flame_3d:
      地位:著名的 2D 遊戲引擎 Flame 的 3D 擴展包。目前也處於高度實驗階段。

      2026年1月12日 星期一

       

      Macbear 3D 0.2.0 Pub.dev 已發佈

      新增功能:  TTF, OTF 字型產生 3D 文字

      Antigravity Agent AI 的協助下, 開發上能更快速, 雖然在邊線外框的三角面產生遇到一些問題, 經由數次的來回修正後, 也都順利解決了. 效果還是很不錯的. (早期 Windows 3.1 的螢幕保護程式就有這個功能, 可以自己實作出來感覺也是很棒的)

      2026年1月2日 星期五

       Macbear 3D powered by ANGLE

      2026 新年新計畫, 自己研發的 Macbear 3D 引擎正式發表於 Pub.dev.
      基於 Flutter/dart, 實現跨平台的開發, 使用 Google Antigravity IDE 取代原本的 VS Code    Antigravity AI Agent 的協助下, 讓這個套件能迅速進行. 後續有許多功能會慢慢加上去, 如果有時間的話...

      Pub.dev 開放套件 flutter_angle, oimo_physics 也提供大大的協助. 



      API開發者主要平台特點狀態
      OpenGL (ES)Khronos全平台 / Web高階、好上手、相容性最強逐漸轉為遺留 (Legacy)
      VulkanKhronosAndroid / PC低階、極致效能、跨平台OpenGL 的繼承者
      MetalApplemacOS / iOS低階、專為 Apple 晶片優化Apple 生態系的唯一標準
      Direct3DMicrosoftWindows / Xbox低階、效能強、生態完整Windows 遊戲開發霸主
      Google ANGLE 算是給老 OpenGL 開啟一條明路. Macbear 3D 依然使用 OpenGL 繪圖函式.

      ANGLE (Almost Native Graphics Layer Engine) 就像一個高級翻譯官。它讓您可以只寫一套 OpenGL ES 2.0 (您的 es2.vert/frag),然後由它自動轉換:

      • 在 Mac 上: ANGLE 把 OpenGL 翻譯成 Metal

      • 在 Windows 上: ANGLE 把 OpenGL 翻譯成 Direct3D 11/12

      • 在 Android 上: ANGLE 把 OpenGL 翻譯成 Vulkan


      當然在 Unreal, Unity 這類超強 3D 引擎風行的今日, 自研的這套確實是上不了檯面的. 不過基於學習, 複習的立場, 實作到一個階段後分享到社群, 記錄下學習歷程.

      Antigravity Agent 真是程式設計的好夥伴, 會幫忙 coding, debug, 還能提供滿滿的情緒價值, 如下:


      Macbear 3D 專案評分報告

      這裡是針對 

      macbear_3d
       專案的詳細評分與分析:

      🏆 總體評分: 85/100

      評測項目分數評語
      專案結構10/10目錄結構清晰完善 (
      lib/src
       分層明確: 
      engine
      geom
      shaders
       等)。
      代碼品質9/10
      dart analyze
       通過無報錯。代碼風格良好,命名規範,核心引擎邏輯 (
      M3AppEngine
      ) 設計合理。
      文件完整度8/10
      README.md
       詳細且包含範例與 TODO,
      CHANGELOG.md
       更新即時。部分核心類別有註解。
      功能完整性9/10支援 glTF, OBJ, 物理引擎 (Oimo), 光影效果, 天空盒等,作為 3D 引擎功能豐富。
      測試覆蓋率1/10主要扣分項
      test/
       目錄下幾乎沒有實質測試代碼,建議增加單元測試。

      📝 詳細分析建議

      ✅ 優點 (Pros)

      1. 架構清晰: 使用單例模式管理 
        M3AppEngine
        ,並將渲染邏輯 (
        RenderEngine
        ) 與場景邏輯分離,易於維護。
      2. 依賴選擇: 選用 
        flutter_angle
         確保跨平台 OpenGL ES 支援,整合 
        oimo_physics
         物理引擎,技術選型成熟。
      3. 完善的範例
        example/
         目錄結構完整,提供了很好的入門指引。
      4. 代碼健康度: 靜態分析完全通過 (No issues found!),這在初期專案中很難得。

      ⚠️ 改進建議 (Improvements)

      1. 增加測試
        test/macbear_3d_test.dart
         目前是空的。建議針對數學計算、幾何生成器 (Geometry Builders) 或解析器 (Parsers) 撰寫單元測試。
      2. 錯誤處理: 在 
        initApp
         或模型加載部分可以增加更詳細的錯誤捕獲 (try-catch),避免初始化失敗導致 App 崩潰。
      3. 文件細節: 可以考慮加上 API 文件註解 (
        ///
        ),這對其他開發者使用這個 package 會有很大幫助。

      總結:這是一個非常有潛力的 Flutter 3D 引擎專案!基礎建設非常扎實,只要補足測試部分,就能成為一個高品質的開源套件。