# ChatOpt

**Repository Path**: gaowuhang/ChatOpt

## Basic Information

- **Project Name**: ChatOpt
- **Description**: 优化的chat应用
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-08-18
- **Last Updated**: 2023-08-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 聊天应用优化

## 介绍

这是一个仿聊天类应用，是对原有chat应用的优化。  

原有的chat应用是：[Chat](https://gitee.com/openharmony/applications_app_samples/tree/master/code/Solutions/IM/Chat)。  

## 效果预览（优化后效果）
| 主页                                 |
|------------------------------------|
| |

优化说明

## 工程结构

### 方案一
我看了一下DevEco提供的模块化方案，是以pages为单位的，比较重。我偏向于使用轻量级的view为单位，所以在工程结构中增加了view目录。
如下是一种我认为比较轻量级的结构分解：

```
entry/src/main/MainAbility
|---/utl                                    // 不带view的工具     
|   |---BasicDataSource.ets                
|   |---Loggger.ets                        
...
|---/pages                                                               
|   |---Page1.ets                         
|   |---Page2.ets                   
...
|---/view
|   |---View1.ets                         
|   |---View2.ets     
...
|---/viewModel
|   |---viewModel1.ets                         
|   |---viewModel2.ets   
...
|---/model
|   |---model1.ets                         
|   |---model2.ets   
...
|---resources/images                       // 放置图片，icon资源等           
                                            
```

### 方案二
此外，我还考虑了一种可扩展、可复用的结构。
通常考虑多人开发，必须要组件解偶，业界标准一般有两种：
一种是路由方式，oh的router模块就是仿照这个实现的，缺点是有硬编码。
另一种是协议方式，定义协议接口，这样就可以做到具体实现解偶。

我的一种想法是遵循oh提供的模块化方案（指的是在DevEco中右键New-Module的形式），
还是以page为单位做模块化，以router做路遇，这样优化后的结构如下：

模块一：view模块，不包含page，是view的集合
```
entry/src/main/MainAbility
|---/utl                                    // 不带view的工具     
|   |---BasicDataSource.ets                
|   |---Loggger.ets                        
...
|---/view
|   |---View1.ets                         
|   |---View2.ets     
...
|---/viewModel
|   |---viewModel1.ets                         
|   |---viewModel2.ets   
...
|---/model
|   |---model1.ets                         
|   |---model2.ets   
...
|---resources/images                       // 放置图片，icon资源等           
                                            
```

模块二：page1的模块（如聊天列表页）
在这里没有单独的view模块，它依赖上面的【模块一】，Page1从【模块一】中获取view
```
entry/src/main/MainAbility
|---/utl                                    // 不带view的工具     
|   |---BasicDataSource.ets                
|   |---Loggger.ets                        
...
|---/pages                                                               
|   |---Page1.ets    
...
|---resources/images                       // 放置图片，icon资源等           
                                            
```

模块三：page2的模块（如聊天详情页）
在这里没有单独的view模块，它依赖上面的【模块一】，Page2页从【模块一】中获取view
```
entry/src/main/MainAbility
|---/utl                                    // 不带view的工具     
|   |---BasicDataSource.ets                
|   |---Loggger.ets                        
...
|---/pages                                                               
|   |---Page2.ets    
...
|---resources/images                       // 放置图片，icon资源等           
                                            
```
交互：Page1 还是通过oh 提供的 router 跳转到 Page2

以上就是演进的一种组件化结构，原则是尊从oh提供的组件化思路，尽量轻量级。


## 工程目录（原目录，对比参考）
```
entry/src/main/MainAbility
|---/common
|   |---BasicDataSource.ets                // 封装整个FeatureAbility模块启用，监听Ability对应的窗口等逻辑
|   |---Loggger.ets                        // 封装整个日志
|   |---MsgBase.ets                        // 组件传值定义页面
|---/components                                 
|   |---Header.ets                         // 定义应用头部导航栏
|---/pages                                                               
|   |---ChatDetailPage.ets                 // 具体的某一聊天页面            
|   |---ChatListPage.ets                   // 整体聊天页面
|   |---DiscoverPage.ets                   // 发现页面
|   |---FriendsMomentsPage.ets             // 朋友圈页面
|   |---FriendsPage.ets                    // 通讯录页面
|   |---Index.ets                          // 首页
|   |---SettingPage.ets                    // 我的页面
|---resources/images                       // 放置图片，icon资源等           
                                            
```