admin/nanocode

Fork 0

Files

T

Ubuntu 32b43f85bd a

2026-07-03 16:58:28 +08:00

5.1 KiB

Raw Blame History

玩Android Uniapp 客户端

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

项目信息

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

功能特性

✅ 已完成功能

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

⏳ 待开发功能

项目页面
公众号页面
体系页面
我的页面
搜索功能
收藏功能
登录功能
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

首页Banner: GET /banner/json
搜索热词: GET /hotkey/json
首页文章列表: GET /article/list/{页码}/json

网络请求封装

使用Uniapp内置的 uni.request：

const response = await uni.request({
  url: 'https://www.wanandroid.com/banner/json',
  method: 'GET'
})

运行和打包

1. 使用HBuilder X

打开HBuilder X
导入本项目文件夹
运行到浏览器或手机模拟器
打包为Android APK

2. 命令行运行（H5模式）

# 安装依赖（如果需要）
npm install

# 运行H5版本
npm run dev:h5

# 构建H5版本
npm run build:h5

3. 打包为APK

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

页面说明

首页 (pages/index/index.vue)

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

其他页面

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

图标说明

底部导航图标使用自定义生成的图标：

首页: 房子图标（绿色激活）
项目: 盒子图标（绿色激活）
公众号: 微信图标（绿色激活）
体系: 树形图标（绿色激活）
我的: 人头图标（绿色激活）

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

样式设计

颜色主题

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

响应式单位

使用 rpx 单位，适配不同屏幕尺寸：

750rpx = 100%屏幕宽度
设计稿基于750rpx宽度

开发建议

1. 后续开发步骤

实现WebView文章详情页
实现搜索功能页面
实现登录和用户系统
实现收藏功能
完善其他页面内容

2. 性能优化建议

图片懒加载
列表虚拟滚动
数据缓存
请求节流

3. 代码规范

使用ES6+语法
组件化开发
统一的错误处理
注释和文档

测试说明

已测试功能

✅ 底部导航切换
✅ Banner轮播
✅ 文章列表加载
✅ 下拉刷新
✅ 上拉加载更多
✅ 网络请求

测试方法

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

注意事项

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

更新日志

v1.0.0 (2026-03-17)

初始版本发布
实现底部导航
完成首页所有功能
集成玩Android API
生成可打包的Uniapp项目

联系信息

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

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

5.1 KiB Raw Blame History Unescape Escape