# AnimationLearningApp

**Repository Path**: developer_wind/AnimationLearningApp

## Basic Information

- **Project Name**: AnimationLearningApp
- **Description**: Jetpack Compose 动画实战
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-05-22
- **Last Updated**: 2026-05-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 🎬 AnimationLearningApp - Android 动画学习项目

一个用于学习 Android 动画的教学应用，对比 View 系统动画与 Jetpack Compose 动画。

---

## 📱 功能模块

### 1. View 系统动画演示
- ✅ 补间动画 (Tween Animation)
- ✅ 属性动画 (Property Animation)
- ✅ 布局过渡 (LayoutTransition)

### 2. Compose 动画演示
- ✅ `animate*AsState` - 状态驱动单值动画
- ✅ `AnimatedVisibility` - 显示/隐藏动画
- ✅ `updateTransition` - 多属性协同过渡
- ✅ `Crossfade` - 内容切换
- ✅ `AnimatedContent` - 内容替换动画
- ✅ `infiniteTransition` - 无限循环动画

### 3. 动画游乐场 (Playground)
- 🔄 自由组合动画参数
- 🔄 实时预览效果
- 🔄 对比不同 AnimationSpec

---

## 🚀 快速开始

### 环境要求
- Android Studio Hedgehog (2023.1.1) 或更高
- JDK 17
- Android SDK 35
- Kotlin 2.0+

### 构建步骤

1. **打开项目**
   ```
   File → Open → 选择 AnimationLearningApp 文件夹
   ```

2. **同步 Gradle**
   ```
   File → Sync Project with Gradle Files
   ```

3. **运行应用**
   ```
   点击 Run 按钮 或 Shift+F10
   选择模拟器或真机
   ```

---

## 📚 学习路径

### 第一阶段：View 动画基础
1. 运行应用，进入 "View 系统动画"
2. 点击 "补间动画" 观察效果
3. 阅读 `animation_guide.md` 对应章节
4. 尝试修改 `res/anim/` 中的 XML 参数

### 第二阶段：Compose 动画入门
1. 进入 "Compose 动画演示"
2. 从 `animate*AsState` 开始学习
3. 逐步尝试其他动画类型
4. 对照文档理解 API 差异

### 第三阶段：实战应用
1. 在 Playground 自由实验
2. 修改代码创建自己的动画
3. 将动画应用到实际项目

---

## 📁 项目结构

```
AnimationLearningApp/
├── app/
│   ├── src/main/
│   │   ├── java/com/example/animationlearning/
│   │   │   ├── MainActivity.kt              # 主入口
│   │   │   ├── ViewAnimationActivity.kt     # View 动画演示
│   │   │   └── ui/
│   │   │       ├── compose/                 # Compose 动画
│   │   │       ├── playground/              # 游乐场
│   │   │       └── navigation/              # 导航
│   │   │
│   │   ├── res/
│   │   │   ├── anim/                        # View 动画 XML
│   │   │   ├── drawable/
│   │   │   └── values/
│   │   │
│   │   └── AndroidManifest.xml
│   │
│   └── build.gradle.kts
│
├── animation_guide.md                       # 对比文档
├── build.gradle.kts
└── settings.gradle.kts
```

---

## 🎯 关键代码示例

### View 补间动画
```kotlin
val animation = AnimationUtils.loadAnimation(context, R.anim.scale_up)
view.startAnimation(animation)
```

### Compose 状态动画
```kotlin
val size by animateDpAsState(
    targetValue = if (expanded) 200.dp else 100.dp,
    animationSpec = spring()
)
```

### Compose 显示/隐藏
```kotlin
AnimatedVisibility(
    visible = visible,
    enter = fadeIn() + slideInVertically(),
    exit = fadeOut() + slideOutVertically()
) {
    Content()
}
```

---

## 📖 配套文档

- **animation_guide.md** - 完整对比指南
- **Android 官方文档** - https://developer.android.com/develop/ui/compose/animation
- **Compose Codelab** - https://developer.android.com/codelabs/jetpack-compose-animation

---

## 🤝 贡献

欢迎提交 Issue 和 PR，帮助改进这个学习项目！

---

## 📄 许可证

MIT License - 自由学习和修改

---