# 玩Android Uniapp 客户端

基于Uniapp框架开发的玩Android客户端应用。

## 项目信息

- **项目名称**: 玩Android客户端
- **技术栈**: Uniapp + Vue 3
- **目标平台**: Android (可通过HBuilder生成APK)
- **API源**: https://www.wanandroid.com
- **开发状态**: 第一阶段完成

## 功能特性

### ✅ 已完成功能
1. **底部导航**：首页、项目、公众号、体系、我的
2. **首页功能**：
   - Banner轮播图（自动轮播+手动滑动）
   - 搜索热词展示
   - 文章列表展示
   - 下拉刷新功能
   - 上拉加载更多
   - 回到顶部按钮
3. **网络请求**：
   - 集成玩Android公开API
   - 错误处理
   - 加载状态管理

### ⏳ 待开发功能
1. 项目页面
2. 公众号页面
3. 体系页面
4. 我的页面
5. 搜索功能
6. 收藏功能
7. 登录功能
8. WebView文章详情

## 项目结构

```
uniapp/
├── pages/                    # 页面文件
│   ├── index/               # 首页（已完成）
│   ├── project/             # 项目页（占位）
│   ├── wxarticle/           # 公众号页（占位）
│   ├── tree/                # 体系页（占位）
│   └── mine/                # 我的页（占位）
├── components/              # 组件
│   └── uni-load-more.vue    # 加载更多组件
├── static/                  # 静态资源
│   └── images/icons/        # 底部导航图标
├── unpackage/               # 打包目录
├── manifest.json           # 应用配置
├── pages.json              # 页面配置
├── App.vue                 # 应用入口
├── create_icons.py         # 图标生成脚本
└── README.md               # 本文件
```

## API接口使用

### 已集成的API
1. **首页Banner**: `GET /banner/json`
2. **搜索热词**: `GET /hotkey/json`
3. **首页文章列表**: `GET /article/list/{页码}/json`

### 网络请求封装
使用Uniapp内置的 `uni.request`：
```javascript
const response = await uni.request({
  url: 'https://www.wanandroid.com/banner/json',
  method: 'GET'
})
```

## 运行和打包

### 1. 使用HBuilder X
1. 打开HBuilder X
2. 导入本项目文件夹
3. 运行到浏览器或手机模拟器
4. 打包为Android APK

### 2. 命令行运行（H5模式）
```bash
# 安装依赖（如果需要）
npm install

# 运行H5版本
npm run dev:h5

# 构建H5版本
npm run build:h5
```

### 3. 打包为APK
1. 在HBuilder X中选择「发行」->「原生App-云打包」
2. 选择Android平台
3. 配置证书（可使用公共测试证书）
4. 开始打包

## 页面说明

### 首页 (pages/index/index.vue)
- **Banner轮播**: 支持自动轮播和手动滑动
- **搜索热词**: 点击可触发搜索（待实现）
- **文章列表**: 卡片式布局，显示标题、作者、分类、时间
- **交互功能**: 下拉刷新、上拉加载、回到顶部
- **点击事件**: 文章点击可跳转到详情（待实现）

### 其他页面
目前为占位页面，显示"开发中"提示。

## 图标说明

底部导航图标使用自定义生成的图标：
- **首页**: 房子图标（绿色激活）
- **项目**: 盒子图标（绿色激活）
- **公众号**: 微信图标（绿色激活）
- **体系**: 树形图标（绿色激活）
- **我的**: 人头图标（绿色激活）

图标文件位于 `static/images/icons/`

## 样式设计

### 颜色主题
- **主色**: #3cc51f (绿色)
- **文字色**: #333 (主要), #666 (次要), #999 (辅助)
- **背景色**: #f8f8f8
- **卡片背景**: #ffffff

### 响应式单位
使用 `rpx` 单位，适配不同屏幕尺寸：
- 750rpx = 100%屏幕宽度
- 设计稿基于750rpx宽度

## 开发建议

### 1. 后续开发步骤
1. 实现WebView文章详情页
2. 实现搜索功能页面
3. 实现登录和用户系统
4. 实现收藏功能
5. 完善其他页面内容

### 2. 性能优化建议
1. 图片懒加载
2. 列表虚拟滚动
3. 数据缓存
4. 请求节流

### 3. 代码规范
1. 使用ES6+语法
2. 组件化开发
3. 统一的错误处理
4. 注释和文档

## 测试说明

### 已测试功能
1. ✅ 底部导航切换
2. ✅ Banner轮播
3. ✅ 文章列表加载
4. ✅ 下拉刷新
5. ✅ 上拉加载更多
6. ✅ 网络请求

### 测试方法
1. 在HBuilder X中运行到浏览器
2. 使用Chrome开发者工具模拟移动端
3. 测试网络请求和响应
4. 测试页面交互

## 注意事项

1. **API限制**: 玩Android API有请求频率限制
2. **图片加载**: 部分图片可能加载较慢，建议实现占位图
3. **网络错误**: 需要处理网络异常情况
4. **登录状态**: 部分API需要登录，目前只使用公开API

## 更新日志

### v1.0.0 (2026-03-17)
- 初始版本发布
- 实现底部导航
- 完成首页所有功能
- 集成玩Android API
- 生成可打包的Uniapp项目

## 联系信息

- **项目位置**: `/home/ubuntu/wanandroid/uniapp/`
- **生成时间**: 2026-03-17
- **测试状态**: 基本功能测试通过

---

**提示**: 将此项目导入HBuilder X后，可直接运行和打包。首页功能完整，其他页面为占位内容，可根据需求继续开发。