- 新增 mobile/ 项目:React Native + Expo - 5个核心页面:连接服务器、房间列表、创建房间、加入房间、设置 - Tab 导航 + Minecraft 风格深色 UI - 房间搜索/筛选(名称、房间号、房主、版本类型) - 15秒自动刷新房间列表 - 设置持久化(AsyncStorage) - EAS Build 配置(云端构建 iOS/Android) - 完整 README 含构建指南 - 更新顶层 README 为三项目全平台架构
132 lines
3.2 KiB
Markdown
132 lines
3.2 KiB
Markdown
# FunConnect Mobile
|
||
|
||
Minecraft 联机移动客户端,基于 **React Native + Expo** 构建,支持 **iOS** 和 **Android**。
|
||
|
||
## 功能
|
||
|
||
- **连接服务器** - 输入中继服务器地址连接
|
||
- **浏览房间** - 实时查看在线联机房间(自动刷新)
|
||
- **搜索筛选** - 按名称、房间号、房主搜索,按版本类型筛选
|
||
- **创建房间** - 创建联机房间并分享房间号
|
||
- **加入房间** - 输入房间号加入,支持密码验证
|
||
- **设置持久化** - 记住服务器地址、玩家名
|
||
- **深色主题** - Minecraft 风格暗色 UI
|
||
|
||
## 快速开始
|
||
|
||
### 前置要求
|
||
|
||
- Node.js 18+
|
||
- Expo CLI: `npm install -g expo-cli`
|
||
- iOS: Xcode 15+(仅 macOS)
|
||
- Android: Android Studio + SDK
|
||
|
||
### 安装依赖
|
||
|
||
```bash
|
||
cd mobile
|
||
npm install
|
||
```
|
||
|
||
### 开发模式
|
||
|
||
```bash
|
||
# 启动 Expo 开发服务器
|
||
npm start
|
||
|
||
# 在 iOS 模拟器中运行
|
||
npm run ios
|
||
|
||
# 在 Android 模拟器中运行
|
||
npm run android
|
||
```
|
||
|
||
> 也可以用 **Expo Go** 手机 App 扫描二维码直接在真机上运行。
|
||
|
||
## 编译发布
|
||
|
||
### 方式一:EAS Build(推荐,云端构建)
|
||
|
||
```bash
|
||
# 安装 EAS CLI
|
||
npm install -g eas-cli
|
||
|
||
# 登录 Expo 账号
|
||
eas login
|
||
|
||
# 构建 Android APK(预览版)
|
||
eas build --platform android --profile preview
|
||
|
||
# 构建 Android AAB(生产版,用于上架 Google Play)
|
||
eas build --platform android --profile production
|
||
|
||
# 构建 iOS(需要 Apple Developer 账号)
|
||
eas build --platform ios --profile production
|
||
|
||
# 同时构建两个平台
|
||
eas build --platform all --profile production
|
||
```
|
||
|
||
### 方式二:本地构建
|
||
|
||
```bash
|
||
# 生成原生项目
|
||
npx expo prebuild
|
||
|
||
# Android
|
||
cd android && ./gradlew assembleRelease
|
||
# 输出: android/app/build/outputs/apk/release/app-release.apk
|
||
|
||
# iOS(需要 macOS + Xcode)
|
||
cd ios && xcodebuild -workspace FunConnect.xcworkspace -scheme FunConnect archive
|
||
```
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
mobile/
|
||
├── App.tsx # 入口 + Tab 导航
|
||
├── index.js # 注册根组件
|
||
├── src/
|
||
│ ├── screens/
|
||
│ │ ├── ConnectScreen.tsx # 连接服务器
|
||
│ │ ├── RoomsScreen.tsx # 房间列表
|
||
│ │ ├── CreateScreen.tsx # 创建房间
|
||
│ │ ├── JoinScreen.tsx # 加入房间
|
||
│ │ └── SettingsScreen.tsx # 设置
|
||
│ ├── lib/
|
||
│ │ ├── api.ts # API 客户端 + 存储
|
||
│ │ └── theme.ts # 主题色彩
|
||
│ └── components/ # 共享组件
|
||
├── app.json # Expo 配置
|
||
├── eas.json # EAS Build 配置
|
||
├── package.json
|
||
└── tsconfig.json
|
||
```
|
||
|
||
## 联机流程
|
||
|
||
### 房主
|
||
|
||
1. 在「连接」页连接中继服务器
|
||
2. 在「创建」页创建房间,复制房间号
|
||
3. 将房间号分享给好友
|
||
4. 启动本地 Minecraft 服务器
|
||
|
||
### 玩家
|
||
|
||
1. 在「连接」页连接同一个中继服务器
|
||
2. 在「加入」页输入房间号
|
||
3. 验证通过后获取服务器地址
|
||
4. 在 Minecraft 中添加该服务器地址
|
||
5. 开始联机!
|
||
|
||
## 技术栈
|
||
|
||
- **React Native 0.73** + **Expo 50**
|
||
- **TypeScript**
|
||
- **React Navigation** - Tab 导航
|
||
- **AsyncStorage** - 本地持久化
|
||
- **Axios** - HTTP 请求
|
||
- **EAS Build** - 云端编译发布
|