Language繁體中文
類別:製作 UI 動效
用於互動介面的 UI 動畫工具
停止傳遞視訊和靜態貝塞爾曲線。設計響應式、實體驅動的 UI 動畫並將相同的檔案傳送到您的應用程式。
What is 用於互動介面的 UI in ExodeUI?
ExodeUI 是一款專為建立生活軟體的產品團隊設計的 UI 動畫工具。與輸出靜態視訊或大量 JSON 資源的工具不同,ExodeUI 將視覺運動畫布與彈簧物理和狀態機配對,並將結果保存為一個打開的 .exode 文件,運行時包可以在React、Vue、Svelte、Angular、Solid、React Native、SwiftUI 和Flutter。
核心架構
為什麼工程師和設計師選擇 [ExodeUI
Design, logic and motion in one file that runs inside your app.
即時彈簧物理
將脆性持續時間曲線替換為自然剛度、質量和阻尼物理,對使用者速度做出流暢反應。
視覺狀態機邏輯
直觀地連接複雜的懸停、活動、拖曳和載入狀態,而無需編寫數千行脆弱的 CSS 過渡。
原生生產程式碼導出
使用程式碼控制的輸入和事件在 React、Vue、Svelte、Angular、Solid、React Native、SwiftUI 和 Flutter 中播放相同的檔案。
連續手勢追蹤
一流的拖曳、投擲、捏合和指針跟踪,具有連續動量和邊界碰撞檢測。
客觀評價
ExodeUI 相比如何 Traditional UI Animation Tools
Where ExodeUI is stronger, and what to weigh before you switch.
ExodeUI
- 一個打開的檔案在八個框架運行時運行
- 具有真實速度和動量的嵌入式實體引擎
- 用於分支邏輯的可視化狀態機節點圖
- 您的應用程式碼控制的輸入和事件
Traditional UI Animation Tools
- 輸出靜態 MP4 視訊、GIF 或重型 After Effects JSON
- 基於時間的線性關鍵影格會在使用者中斷互動時中斷
- 開發人員必須在程式碼中手動重建每條動畫曲線
- 交互狀態通常必須圍繞玩家手動編碼
開發者交接
在您的程式碼中使用它
Your app loads the compiled file through the ExodeUI runtime and talks to it through inputs and events.
從 'exodeui' 導入 { ExodeUICanvas };
// 彈簧、狀態和計時位於 .exode 檔案中(設計於
// 編輯器)。您的代碼傳遞輸入並聽取事件返回。
導出函數InteractiveButton() {
返回(
<ExodeUI畫布
src="/interactive_button.bexode"
輸入={{按下}}
onTrigger={(name) => console.log('ExodeUI 事件:', name)}
/>
);
}有疑問嗎?
常見問題解答
透過真實的運動建構生命組件。
Start free in the browser or download the desktop app. Compile spring physics and state machines directly to React and SwiftUI.