Liquid Glass Screens教程：React Native液态玻璃欢迎屏两本做法手册

📌 项目日期：2026年9月 | 数据来源：GitHub官方仓库 | 星数：168+

📋 项目简介

Liquid Glass Screens 是一份 React Native Expo "cookbook"：两套上滑式液态玻璃欢迎屏（日光 Sky 与夜空 Astro 两主题），同一 TypeScript 组件换皮实现。整块画面绘制在一个 React Native Skia 画布上，动效完全由 Reanimated + Gesture Handler 在 UI 线程完成——不跨桥，跟手度拉满。

移动端界面从设计到实现，可以把它与 M3E Canvas设计画布（出设计稿与提示词）、shadcn官方cn引擎（类名层基建）串成一条前端工作流。

🔧 交互语法拆解

📦 上手

# Expo 项目，两本cookbook二选一复制
git clone https://github.com/Appllama/liquid-glass-screens.git
cd liquid-glass-screens
npm install
npx expo start

核心依赖：react-native-skia（画布渲染）、react-native-reanimated（UI线程动画）、react-native-gesture-handler（手势捕获）。

⚠️ 知识产权边界（必读）

• 官方明确标注仅供学习参考：与 Wabi、Apple 等公司无关，所有位图与视频素材均为本项目自产
• 交互语法是对公开可见屏幕的研究；不要原样上架——商用前替换字标、贴纸、文案与背景，并让最终构图与动效有实质独特性
• 仓库内附完整知识产权说明章节，发布前逐条对照