28个案例问题分析---22---原型图的面向对象--xiaopiu

青旅半醒 2023-10-09 15:53 65阅读 0赞

## 背景介绍 ##

软件开发之前，我们必须要先进行原型设计。我们在进行原型设计的时候，用的是xiaopiu进行。平常我们的做法是，需要用到那个，就去画那个。如果其他页面需要用到的话，就去另外的界面粘贴过来。最后导致我们产品的原型图，非常庞大，混乱。  
![在这里插入图片描述][00cb6d8d8f414194a76ac3ea36d56c03.png]  
我们如何去解决这个混乱，难以管理的问题呢？

## 原型图如何面向对象 ##

### 颗粒封装 ###

![在这里插入图片描述][6de8fce2b52d4a7cb21fbebdeb8d5644.png]  
利用组件库功能。将所有的页面的功能内容抽出来，封装成组件。然后通过对组件的组合，组合成为相对应的页面。  
例如我们产品内的：  
**回复组合框**  
![在这里插入图片描述][b96fe560a41e4b4aa171e70a4a1905e4.png]  
**时间进度条**  
![在这里插入图片描述][832b4edf3cfb4b238794769241bbbe8c.png]  
**课程信息组合卡片**  
![在这里插入图片描述][b0274c0aa46644309ce2b5f7899cd240.png]

### 颗粒使用 ###

以后在进行绘画新的页面的时候，如果需要使用到之前的组件的话，直接从我们的组件库里取出就可以了。如果有新的复用读高的组件。也进行一个封装。这样就通过面向对象的方式，将一个一个组件封装成了一个又一个的对象。使用的时候，又将这写独立的对象封装成一个新的对象。  
![在这里插入图片描述][09fe5c0cf5854a8aa65a0b72b86751d4.png]

## 好处，意义 ##

通过这种方式，组织我们的原型图，便于管理，方便维护。面向对象思想无处不在。

[00cb6d8d8f414194a76ac3ea36d56c03.png]: https://img-blog.csdnimg.cn/00cb6d8d8f414194a76ac3ea36d56c03.png
[6de8fce2b52d4a7cb21fbebdeb8d5644.png]: https://img-blog.csdnimg.cn/6de8fce2b52d4a7cb21fbebdeb8d5644.png
[b96fe560a41e4b4aa171e70a4a1905e4.png]: https://img-blog.csdnimg.cn/b96fe560a41e4b4aa171e70a4a1905e4.png
[832b4edf3cfb4b238794769241bbbe8c.png]: https://img-blog.csdnimg.cn/832b4edf3cfb4b238794769241bbbe8c.png
[b0274c0aa46644309ce2b5f7899cd240.png]: https://img-blog.csdnimg.cn/b0274c0aa46644309ce2b5f7899cd240.png
[09fe5c0cf5854a8aa65a0b72b86751d4.png]: https://img-blog.csdnimg.cn/09fe5c0cf5854a8aa65a0b72b86751d4.png