512 lines
13 KiB
Plaintext
512 lines
13 KiB
Plaintext
# DiscoveryFragment 广场页面逻辑分析
|
||
|
||
## 📋 页面概述
|
||
|
||
**文件位置**: `app/src/main/java/com/xunpaisoft/social/im/main/DiscoveryFragment.java`
|
||
**布局文件**: `app/src/main/res/layout/main_fragment_discovery.xml`
|
||
**页面类型**: Fragment（继承自 `Fragment`）
|
||
**主要功能**: 社交广场页面，类似朋友圈功能，支持发布动态、浏览动态、点赞评论等社交功能
|
||
|
||
---
|
||
|
||
## 🎯 核心功能模块
|
||
|
||
### 1. 页面初始化 (`onCreateView()`)
|
||
|
||
#### 1.1 初始化流程
|
||
```java
|
||
onCreateView()
|
||
↓
|
||
bindViews(view) // 绑定视图控件
|
||
↓
|
||
bindEvents(view) // 绑定事件监听
|
||
↓
|
||
initMoment() // 初始化朋友圈功能
|
||
↓
|
||
检查会议功能支持 // 如果不支持则隐藏会议入口
|
||
```
|
||
|
||
#### 1.2 关键UI组件
|
||
- `mRcyItem`: 动态列表 RecyclerView
|
||
- `tvGuangchang`: 广场Tab按钮
|
||
- `tvGuanzhu`: 关注Tab按钮
|
||
- `swipeRefreshLayout`: 下拉刷新和上拉加载控件
|
||
- `mTVPublish`: 发布按钮
|
||
|
||
---
|
||
|
||
### 2. 页面切换功能
|
||
|
||
#### 2.1 广场/关注切换
|
||
- **状态变量**: `mIsClickGuangchang`（布尔值，默认 `true`）
|
||
- `true`: 显示广场动态（所有用户动态）
|
||
- `false`: 显示关注动态（仅关注用户动态）
|
||
|
||
#### 2.2 切换逻辑
|
||
```java
|
||
clickGuangchang() {
|
||
mIsClickGuangchang = true;
|
||
refreshView(); // 更新Tab样式
|
||
mPage = 1; // 重置页码
|
||
getPublish(); // 重新加载数据
|
||
}
|
||
|
||
clickGuanzhu() {
|
||
mIsClickGuangchang = false;
|
||
refreshView(); // 更新Tab样式
|
||
mPage = 1; // 重置页码
|
||
getPublish(); // 重新加载数据
|
||
}
|
||
```
|
||
|
||
#### 2.3 Tab样式更新 (`refreshView()`)
|
||
- 根据 `mIsClickGuangchang` 状态，在对应Tab底部显示下划线
|
||
- 使用 `bottom_line_style` drawable 作为下划线样式
|
||
|
||
---
|
||
|
||
### 3. 动态列表功能 (`initRcyItem()`)
|
||
|
||
#### 3.1 RecyclerView配置
|
||
- **布局管理器**: `LinearLayoutManager`（垂直列表）
|
||
- **适配器**: `BaseRcyAdapter`
|
||
- **布局文件**: `adapter_pengyouquan_item.xml`
|
||
|
||
#### 3.2 列表项数据绑定
|
||
|
||
**基本信息显示**:
|
||
- 昵称 (`tv_ada_nikename`)
|
||
- 头像 (`img_ada_head`)
|
||
- 性别图标 (`img_ada_sex`)
|
||
- 内容 (`tv_ada_content`)
|
||
- 时间 (`tv_ada_time`)
|
||
- 点赞数 (`tv_ada_like`)
|
||
- 评论数 (`tv_ada_commit`)
|
||
|
||
**图片显示**:
|
||
- 支持多图片网格布局（3列）
|
||
- 单张图片：使用 `LinearLayoutManager`
|
||
- 2张及以上：使用 `GridLayoutManager`（3列）
|
||
- 点击图片可预览（`MMPreviewActivity`）
|
||
|
||
**评论列表**:
|
||
- 最多显示3条评论
|
||
- 超过3条时显示"查看详情"按钮
|
||
- 评论支持点击回复功能
|
||
|
||
---
|
||
|
||
### 4. 数据加载功能 (`getPublish()`)
|
||
|
||
#### 4.1 请求参数
|
||
```java
|
||
HashMap<String, String> {
|
||
"type": "0" 或 "1", // 0=广场, 1=关注
|
||
"page": "页码", // 当前页码
|
||
"limit": "每页数量" // AppService.PAGE_MAX_NUMBER
|
||
}
|
||
```
|
||
|
||
#### 4.2 分页逻辑
|
||
- **下拉刷新**: `mPage = 1`，重置数据（`setmData`）
|
||
- **上拉加载**: `mPage++`，追加数据（`setLoadmData`）
|
||
|
||
#### 4.3 数据刷新
|
||
- 成功时调用 `swipeRefreshLayout.finishRefresh()` 和 `finishLoadMore()`
|
||
- 失败时同样调用，并显示错误提示
|
||
|
||
---
|
||
|
||
### 5. 社交互动功能
|
||
|
||
#### 5.1 点赞功能 (`likeDeal()`)
|
||
|
||
**API调用**:
|
||
- 接口: `POST /api/post/like`
|
||
- 参数: `post_id`（帖子ID）
|
||
|
||
**UI更新逻辑**:
|
||
```java
|
||
if ("0".equals(listBean.getIs_like())) {
|
||
// 未点赞 → 已点赞
|
||
- 切换图标为已点赞状态（icon_dianzan_yi）
|
||
- 设置 is_like = "1"
|
||
- 点赞数 +1
|
||
} else {
|
||
// 已点赞 → 取消点赞
|
||
- 切换图标为未点赞状态（icon_dianzan）
|
||
- 设置 is_like = "0"
|
||
- 点赞数不变（后端处理）
|
||
}
|
||
```
|
||
|
||
#### 5.2 评论功能 (`submitComment()`)
|
||
|
||
**新增评论**:
|
||
```java
|
||
submitComment(postId, content, callback) {
|
||
// 调用 submitComment(postId, null, content, callback)
|
||
}
|
||
```
|
||
|
||
**回复评论**:
|
||
```java
|
||
submitComment(postId, parentCommentId, content, callback) {
|
||
HashMap {
|
||
"post_id": postId,
|
||
"content": content,
|
||
"comment_id": parentCommentId // 可选，回复时传入
|
||
}
|
||
}
|
||
```
|
||
|
||
**评论显示逻辑**:
|
||
- 如果有 `receiver`（被回复人），显示格式：`"nickname 回复 receiver: content"`
|
||
- 如果没有 `receiver`，显示格式：`"nickname: content"`
|
||
|
||
**评论对话框**:
|
||
- 使用 `CommentDialog` 显示评论输入框
|
||
- 点击评论列表项可回复该评论
|
||
- 回复时输入框提示：`"回复 nickname"`
|
||
|
||
#### 5.3 删除功能 (`deleteSelfPyq()`)
|
||
|
||
**删除条件**:
|
||
- 仅自己的动态显示删除按钮
|
||
- 判断条件：`Constants.getUserId().equals(listBean.getUser_id())`
|
||
|
||
**删除流程**:
|
||
1. 显示确认对话框（`CommDialog`）
|
||
2. 用户确认后调用删除接口
|
||
3. 删除成功后刷新列表（`mPage = 1`, `getPublish()`）
|
||
|
||
**API调用**:
|
||
- 接口: `POST /api/post/delete`（推测）
|
||
- 参数: `post_id`（帖子ID）
|
||
|
||
---
|
||
|
||
### 6. 用户交互功能
|
||
|
||
#### 6.1 用户信息查看
|
||
- **点击头像**: 跳转到 `UserInfoActivity`
|
||
- **点击昵称**: 跳转到 `UserInfoActivity`
|
||
- 通过 `UserViewModel.getUserInfo()` 获取 `UserInfo` 对象
|
||
|
||
#### 6.2 动态详情
|
||
- **点击"查看详情"**: 跳转到 `PengyouquanDetailActivity`
|
||
- 传递参数: `detailInfo`（`GetPengyouquanResult.ListBean` 对象）
|
||
|
||
#### 6.3 图片预览
|
||
- **点击图片**: 使用 `MMPreviewActivity.previewImageArrayList()` 预览
|
||
- 支持多图片滑动查看
|
||
- 图片URL格式: `AppService.APP_FILE_ADDRESS + url`
|
||
|
||
#### 6.4 发布动态
|
||
- **点击发布按钮**: 跳转到 `PublishActivity`
|
||
|
||
---
|
||
|
||
### 7. 其他功能入口
|
||
|
||
#### 7.1 功能菜单项
|
||
- **聊天室** (`chatRoom()`): 跳转到 `ChatRoomListActivity`
|
||
- **机器人** (`robot()`): 跳转到与 `FireRobot` 的会话
|
||
- **频道** (`channel()`): 跳转到 `ChannelListActivity`
|
||
- **朋友圈** (`moment()`): 跳转到朋友圈页面（隐式Intent）
|
||
- **会议** (`conference()`): 跳转到 `ConferencePortalActivity`
|
||
- **开发文档** (`cookbook()`): 打开WebView显示文档
|
||
|
||
#### 7.2 朋友圈功能 (`initMoment()`)
|
||
- 检查是否支持朋友圈功能
|
||
- 监听消息变化，更新朋友圈未读消息数（badge）
|
||
- 如果不支持，隐藏朋友圈入口
|
||
|
||
---
|
||
|
||
### 8. 状态栏颜色设置 (`onResume()`)
|
||
|
||
```java
|
||
@Override
|
||
public void onResume() {
|
||
super.onResume();
|
||
// 设置状态栏颜色为 #D4E4FE（广场页面专用颜色）
|
||
if (getActivity() instanceof MainActivity) {
|
||
MainActivity mainActivity = (MainActivity) getActivity();
|
||
mainActivity.setStatusBarColorForFragment(
|
||
R.color.discovery_status_bar_color,
|
||
false // 深色图标（适合浅色背景）
|
||
);
|
||
}
|
||
// 更新朋友圈未读消息数
|
||
if (WfcUIKit.getWfcUIKit().isSupportMoment()) {
|
||
updateMomentBadgeView();
|
||
}
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 🔄 完整业务流程
|
||
|
||
### 发布动态流程
|
||
```
|
||
用户点击发布按钮
|
||
↓
|
||
跳转到 PublishActivity
|
||
↓
|
||
用户编辑内容并发布
|
||
↓
|
||
发布成功后返回
|
||
↓
|
||
自动刷新列表（refreshAllView）
|
||
```
|
||
|
||
### 点赞流程
|
||
```
|
||
用户点击点赞按钮
|
||
↓
|
||
调用 likeDeal() 接口
|
||
↓
|
||
成功后更新UI状态
|
||
↓
|
||
切换图标和点赞数
|
||
```
|
||
|
||
### 评论流程
|
||
```
|
||
用户点击评论按钮
|
||
↓
|
||
显示 CommentDialog
|
||
↓
|
||
用户输入评论内容
|
||
↓
|
||
调用 submitComment() 接口
|
||
↓
|
||
成功后关闭对话框并刷新列表
|
||
```
|
||
|
||
### 回复评论流程
|
||
```
|
||
用户点击评论列表项
|
||
↓
|
||
显示 CommentDialog（提示"回复 nickname"）
|
||
↓
|
||
用户输入回复内容
|
||
↓
|
||
调用 submitComment(postId, commentId, content)
|
||
↓
|
||
成功后关闭对话框并刷新列表
|
||
```
|
||
|
||
---
|
||
|
||
## 📊 数据结构
|
||
|
||
### 动态列表项 (`GetPengyouquanResult.ListBean`)
|
||
```java
|
||
{
|
||
"id": "帖子ID",
|
||
"user_id": "用户ID",
|
||
"nickname": "昵称",
|
||
"avatar": "头像URL",
|
||
"gender": "性别（0=男, 1=女）",
|
||
"content": "内容",
|
||
"images": "图片URL列表（逗号分隔）",
|
||
"createtime": "创建时间（秒）",
|
||
"likes": "点赞数",
|
||
"is_like": "是否已点赞（0=未点赞, 1=已点赞）",
|
||
"province": "省份（可为null）",
|
||
"city": "城市（可为null）",
|
||
"district": "区县（可为null）",
|
||
"poi": "地点信息/POI（可为null）",
|
||
"lat": "纬度（可为null）",
|
||
"lng": "经度（可为null）",
|
||
"comments": [评论列表]
|
||
}
|
||
```
|
||
|
||
### 评论项 (`GetCommentInfoResult.ListBean`)
|
||
```java
|
||
{
|
||
"id": "评论ID",
|
||
"nickname": "评论者昵称",
|
||
"receiver": "被回复人昵称（可选）",
|
||
"receiver_id": "被回复人ID（可选）",
|
||
"content": "评论内容",
|
||
"createtime": "创建时间（秒）"
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 🛠️ 技术要点
|
||
|
||
### 1. 下拉刷新和上拉加载
|
||
- **库**: `SmartRefreshLayout`
|
||
- **功能**:
|
||
- 下拉刷新：重置页码，重新加载第一页
|
||
- 上拉加载：页码+1，追加数据
|
||
|
||
### 2. 图片布局自适应
|
||
- **单张图片**: `LinearLayoutManager`（单列，可横向滑动）
|
||
- **多张图片**: `GridLayoutManager`（3列网格布局）
|
||
|
||
### 3. 评论显示逻辑
|
||
- **显示规则**:
|
||
- 评论数 ≤ 3：全部显示，不显示"查看详情"
|
||
- 评论数 > 3：只显示前3条，显示"查看详情"
|
||
- **回复格式**: 使用反射获取 `receiver` 字段，支持多种getter方法
|
||
|
||
### 4. 数据刷新机制
|
||
- **删除后**: `mPage = 1`, `getPublish()`
|
||
- **评论后**: `mPage = 1`, `getPublish()`
|
||
- **点赞后**: 仅更新当前项UI，不刷新列表
|
||
|
||
---
|
||
|
||
## ⚠️ 注意事项
|
||
|
||
1. **分页逻辑**: 第一页使用 `setmData()`（重置），后续页使用 `setLoadmData()`（追加）
|
||
2. **评论显示**: 使用反射获取 `receiver` 字段，确保兼容性
|
||
3. **删除权限**: 仅自己的动态显示删除按钮
|
||
4. **状态栏颜色**: 在 `onResume()` 中设置，确保每次显示时都更新
|
||
5. **图片预览**: 使用 `MMPreviewActivity`，支持多图片滑动查看
|
||
|
||
---
|
||
|
||
## 🔍 相关文件
|
||
|
||
- **布局文件**: `app/src/main/res/layout/main_fragment_discovery.xml`
|
||
- **列表项布局**: `uikit/src/main/res/layout/adapter_pengyouquan_item.xml`
|
||
- **评论项布局**: `uikit/src/main/res/layout/adapter_user_comment_item.xml`
|
||
- **网络服务**: `AppService.publishList()` - 获取动态列表
|
||
- **网络服务**: `AppService.publishLike()` - 点赞接口
|
||
- **网络服务**: `AppService.publishComment()` - 评论接口
|
||
- **网络服务**: `AppService.postpyqDelete()` - 删除接口
|
||
|
||
---
|
||
|
||
## 📝 代码关键位置
|
||
|
||
### 列表初始化（第183行）
|
||
```java
|
||
private void initRcyItem() {
|
||
// 设置布局管理器和适配器
|
||
}
|
||
```
|
||
|
||
### 数据加载（第576行）
|
||
```java
|
||
private void getPublish() {
|
||
// 根据type参数加载广场或关注动态
|
||
}
|
||
```
|
||
|
||
### 点赞处理（第680行）
|
||
```java
|
||
private void likeDeal(String commentId, BooleanCallback callback) {
|
||
// 调用点赞接口
|
||
}
|
||
```
|
||
|
||
### 评论提交（第548行、552行）
|
||
```java
|
||
private void submitComment(String postId, String parentCommentId, String content, BooleanCallback callback) {
|
||
// 提交评论或回复
|
||
}
|
||
```
|
||
|
||
### 评论列表显示（第414行）
|
||
```java
|
||
private void initRcyCommentView(RecyclerView rcy, ArrayList<GetCommentInfoResult.ListBean> list, String postId) {
|
||
// 显示评论列表，支持点击回复
|
||
}
|
||
```
|
||
|
||
---
|
||
|
||
## 🎨 UI交互细节
|
||
|
||
### Tab切换动画
|
||
- 使用 `CompoundDrawablesWithIntrinsicBounds` 设置底部下划线
|
||
- 切换时动态更新，无动画效果
|
||
|
||
### 点赞状态切换
|
||
- 使用 `setCompoundDrawablesWithIntrinsicBounds` 切换图标
|
||
- 图标：
|
||
- 未点赞: `icon_dianzan`
|
||
- 已点赞: `icon_dianzan_yi`
|
||
|
||
### 评论对话框
|
||
- 使用 `CommentDialog` 自定义对话框
|
||
- 支持输入框聚焦和软键盘弹出（注释代码）
|
||
|
||
---
|
||
|
||
## 📈 性能优化
|
||
|
||
1. **图片加载**: 使用 `GlideUtils` 进行图片加载和缓存
|
||
2. **列表复用**: 使用 `RecyclerView` 实现列表项复用
|
||
3. **嵌套滚动**: 图片RecyclerView设置 `setNestedScrollingEnabled(false)`，避免滚动冲突
|
||
4. **固定大小**: 设置 `setHasFixedSize(true)` 优化布局计算
|
||
|
||
---
|
||
|
||
## 🔄 数据流
|
||
|
||
```
|
||
用户操作
|
||
↓
|
||
UI更新
|
||
↓
|
||
API调用
|
||
↓
|
||
服务器响应
|
||
↓
|
||
更新UI状态
|
||
↓
|
||
刷新列表（如需要）
|
||
```
|
||
|
||
---
|
||
|
||
## 📚 相关API接口
|
||
|
||
### 获取动态列表
|
||
- **接口**: `POST /api/post/postList`
|
||
- **参数**: `type`, `page`, `limit`
|
||
- **返回**: `GetPengyouquanResult`
|
||
|
||
### 点赞/取消点赞
|
||
- **接口**: `POST /api/post/like`
|
||
- **参数**: `post_id`
|
||
- **返回**: 成功/失败
|
||
|
||
### 发表评论/回复
|
||
- **接口**: `POST /api/post/comment`
|
||
- **参数**: `post_id`, `content`, `comment_id`（可选，回复时传入）
|
||
- **返回**: 成功/失败
|
||
|
||
### 删除动态
|
||
- **接口**: `POST /api/post/delete`（推测）
|
||
- **参数**: `post_id`
|
||
- **返回**: 成功/失败
|
||
|
||
---
|
||
|
||
## 💡 特殊处理
|
||
|
||
### 评论回复显示
|
||
- 使用反射机制获取 `receiver` 字段，确保兼容不同版本的API返回
|
||
- 如果获取不到 `receiver`，则不显示"回复"前缀
|
||
|
||
### 图片布局
|
||
- 根据图片数量动态调整布局管理器
|
||
- 单张图片使用横向滚动布局，多张图片使用网格布局
|
||
|
||
### 状态栏颜色
|
||
- 广场页面专用状态栏颜色：`#D4E4FE`
|
||
- 在 `onResume()` 中设置，确保每次显示时都更新
|
||
|