校园文化是以学生为主体，以课外文化活动为主要内容，校园文化建设是以学生为主体，校园为主要空间，涵盖院校领导、教职工在内，以校园精神为主要特征的一种群体文化。
校园app，作为学校对外展示校园文化的一个窗口，这一模块的功能也必不可少。科师有约 将这一模块分为 【表白墙 & 图说校园 & 社团活动】 三方面来进行实现。
在这里附一下【河北科技师范学院】校训： 敏学、修身、乐业、创新
前言
系列文章
Github地址： 科师有约校园APP
- 手把手带你撸一个校园APP（一）：项目简介
- 手把手带你撸一个校园APP（二）：应用启动和欢迎页面
- 手把手带你撸一个校园APP（三）：用户模块（登录注册等）
- 手把手带你撸一个校园APP（四）：APP框架及功能设计
- 手把手带你撸一个校园APP（五）：新闻页面中心模块
- 手把手带你撸一个校园APP（六）：失物招领&二手交易模块
- 手把手带你撸一个校园APP（七）：校园文化模块（社团活动&表白墙&图说校园）
- 手把手带你撸一个校园APP（八）：校园通讯录模块
- 手把手带你撸一个校园APP（九）：课程表模块（模拟登陆爬取教务处课程信息）
- 手把手带你撸一个校园APP（十）：APP通用模块（更新，意见反馈等）
社团组织
社团活动是校园文化的重要载体，也是学生愉悦身心、拓宽兴趣、开阔视野的主要阵地。
丰富多彩的社团活动，能提升学生能力，培养兴趣爱好，激发学生寻找个人特色与才能。每个学校的校园文化也多由此体现。因此设置这个模块，用以展示校园的组织社团等，也为各组织社团提供一种新的线上宣传途径。
实现效果
实现
数据库
| 字段名 | 描述 | 类型 | 是否主键 |
|---|---|---|---|
| objectId | 唯一标识 | String | 是 |
| title | 标题 | String | - |
| description | 描述 | Number | - |
| pic | 图片 | String | - |
| time | 发布时间 | Date | - |
安卓代码
查询列表数据，并展示
mAdapter = new GeneralAdapter();
teamBeen = new ArrayList<>();
rvTeam.setLayoutManager(new LinearLayoutManager(TeamActivity.this));
BmobQuery<TeamBean> query = new BmobQuery<TeamBean>();
query.order("-time");
query.setLimit(15);
query.findObjects(new FindListener<TeamBean>() {
@Override
public void done(List<TeamBean> object, BmobException e) {
if (e == null) {
LogUtils.e("查询成功：共" + object.size() + "条数据。");
teamBeen.addAll(object);
mAdapter.setData(teamBeen);
} else {
LogUtils.e("失败：" + e.getMessage() + "," + e.getErrorCode());
}
}
});
rvTeam.setAdapter(mAdapter);
表白墙
近年来，表白墙作为大学校园一种新的社交平台迅速崛起，不仅流行范围广、传播速度快，而且显得异常活跃。这种别具一格的表达方式，由于具有鲜明的时代特点和浓厚的感情色彩，深受大学生的青睐。
效果
表白墙及发布页面如下：
本人实在没有美术与设计功底，审美也常年掉线。还望勿笑~~
分析
从代码层面来分析的话，其实就是数据的发布与查询操作。
这部分代码重复性较高，此处就不再赘述了。着重讲下表白信的背景图片【9-patch 图片】。
9-patch 图片
9-patch 图片常叫做 .9图片。因为文件的后缀名是 .9.png 。
是一个指定一些区域可拉伸，另外一些区域不拉伸的位图，同时还可以指定显示内容的区域。在Android开发中，经常使用到.9图片，比如聊天页的消息背景等，以避免因内容导致位图变形。
给一个对比图来感受一下，使用和不使用的区别（左：不使用，右：使用）：
可以看到，使用普通图片的话，变形会很严重，而使用9patch则会好很多。
如何制作9patch图片
制作.9图片有很多种方法，最方便快捷的莫过于在Android Studio中进行制作。具体步骤如下：
step1. 准备png图片，需要至少预留1像素的透明区域，然后放到项目drawable或mipmap文件中；
step2. 选中该文件，右键选择 “Create 9-Patch file …”，之后drawable 文件夹下回出现同名的 .9.png 图片；
step3. 绘制可拉伸区域（在顶部以及左侧划线表示，绘制页面如下图所示，右侧可预览拉伸后的效果）；
step4. 和其它图片一样正常使用即可。
图说校园
效果
分析
这一部分逻辑比较简单，同样是请求数据列表然后展示。
不同的是，列表采用了瀑布流的形式展示，其实 RecycleView 可以轻易实现这种效果。
数据请求部分代码重复性较高，在此就不再赘述了。这里着重讲跳转页面时的转场动画【共享元素】的实现。
共享元素(Shared Element)
共享元素属于 Material Design， 为场景切换提供了非常优雅的视觉效果，在进入和退出页面，元素共享页面的时候可以添加想要的效果，能给人元素在运动的感觉。Gif 图如下：
实现
数据库
数据库字段设计如下：
| 字段名 | 描述 | 类型 | 是否主键 |
|---|---|---|---|
| objectId | id | String | 是 |
| name | 标题 | String | - |
| description | 描述 | Number | - |
| pic | 图片 | String | - |
| createdAt | 发布时间 | Date | - |
查询列表等数据请求操作部分代码重复性较高，可参考之前文件代码。在此就不再赘述了。
共享元素
Step1:
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="android:windowContentTransitions">true</item>
</style>
Step2:
为共享元素设置 transtionName，两个界面都需要要添加，用以标识哪两个元素共享。
<!--已省略其它属性-->
<ImageView
android:layout_width="274dp"
android:layout_height="307dp"
android:transitionName="shareView" />
当然也可以在代码中设置：
imageView.setTransitionName("shareView");
Step3:
设置好以上的参数后，就可以通过跳转来添加相应的动画了。需要用到 ActivityOptionsCompat 的 makeSceneTransitionAnimation 函数。代码如下：
Intent i = new Intent(mContext, PicDetailActivity.class);
ActivityOptionsCompat optionsCompat =
ActivityOptionsCompat.makeSceneTransitionAnimation(mContext, holder.image, "shareView");
startActivity(i,optionsCompat.toBundle());
设置多个元素共享的代码如下:
Intent i = new Intent(mContext, PicDetailActivity.class);
Pair<View, String> pair = new Pair<View, String>(holder.image,"shareView");
Pair<View,String> pairText = new Pair<View, String>(holder.text,"text");
ActivityOptionsCompat optionsCompat =
ActivityOptionsCompat.makeSceneTransitionAnimation(mContext, pair,pairText);
startActivity(i,optionsCompat.toBundle());
至此，本文内容全部完毕，项目中内容均为简易实现，深究的话，可以优化的细节极多，然而作者可能并没有更大的精力去全部完善。此项目也权当抛砖引玉之用，望以后可以有学弟学妹做出真正的产品。
另外，项目中大量依赖或采用了第三方项目的代码。在此向各位有分享精神的大佬们致敬！
如果本文对你有所帮助，还望可以随手赏一个点赞哈 ~ ~
