转载请注明出处
作者:developerHaoz
Github 地址:developerHaoz
本文为 手把手教你从零开始做一个好看的 APP - Day two ,如果想看该系列的其他文章,请点击以下连接
手把手教你从零开始做一个好看的 APP - Day three
手把手教你从零开始做一个好看的 APP - Day four
手把手教你从零开始做一个好看的 APP - Day five
Day two
一、界面的设计及实现
既然我们想要完成一个好看的 APP,那么好看的界面便是必不可少的,这里我强烈推荐 APP 界面的设计必须尽量遵从 Google 提出的 Material Design,在这里推荐一个能够让我们实现 Material Design 变得更加简单的网站 material design palette,我这个 APP 的配色就是用这个网站完成的,贴几张图片,让你感受一下它的强大
借助这个网站便能让我们完成 APP 的配色以及图标的收集,为下一步功能的实现,先打好了基础,至于界面的设计就仁者见仁智者见智了,篇幅有限,我就不多讲了。
APP 的最终设计效果如下:
二、公共类的实现
因为这个项目有三个模块,有一些东西其实是可以通用的,如果我们先把这些能够通用的东西,封装起来,供给所有的模块调用的话,相信会大大提高我们的开发效率。
1、网络工具类的封装
这个 APP 中,很多地方都要用到网络请求,因此也就很有必要将网络请求封装起来,因为这个 APP 的规模比较小,因此我选择了 Volley 这个网络框架作为我们网络请求库,把网络请求封装起来,那哪个地方需要,调用一下就行了。对于网络请求,我觉得每个程序员都该懂点 HTTP,这里附上一篇有关 HTTP 的文章 程序员都该懂点 HTTP。
先让我们来写个将网络请求进行回调的接口
public interface VolleyResponseCallback {
void onSuccess(String response);
void onError(VolleyError error);
}
然后将网络请求封装起来
public class VolleyHelper {
/**
* 用于发送 Get 请求的封装方法
*
* @param context Activity 的实例
* @param url 请求的地址
* @param callback 用于网络回调的接口
*/
public static void sendHttpGet(Context context, String url, final VolleyResponseCallback callback){
RequestQueue requestQueue = Volley.newRequestQueue(context);
StringRequest stringRequest = new StringRequest(url
, new Response.Listener<String>() {
@Override
public void onResponse(String s) {
callback.onSuccess(s);
}
}, new Response.ErrorListener() {
@Override
public void onErrorResponse(VolleyError error) {
callback.onError(error);
}
});
requestQueue.add(stringRequest);
}
}
2、Json 解析的帮助类
因为我们这个 APP 中,获取到的数据都是 Json 格式的,因此也就有必要将有关的 Json 解析封装成一个工具类,传入一个 String 类型的数据,直接得到数据实体类的 List。
public class CommonParser {
/**
* 用来解析列表性的JSON数据
* 如:
* {"success":true,"fileList":[{"filename":"文件名1","fileSize":"文件大小1"},
* {"filename":"文件名2","fileSize":"文件大小2"}]}
*
* @param result 网络返回来的JSON数据 比如:上面的整串数据
* @param successKey 判断网络是否成功的字段 比如:上面的success字段
* @param arrKey 列表的字段 比如:上面的fileList字段
* @param clazz 需要解析成的Bean类型
* @param <T> 需要解析成的Bean类型
* @return
*/
public static <T> List<T> parseForList(String result, String successKey, String arrKey, Class<T> clazz) {
List<T> list = new ArrayList<>();
JSONObject rootJsonObject = null;
try {
rootJsonObject = new JSONObject(result);
if (rootJsonObject.getBoolean(successKey)) {
JSONArray rootJsonArray = rootJsonObject.getJSONArray(arrKey);
Gson g = new Gson();
for (int i = 0; i < rootJsonArray.length(); i++) {
T t = g.fromJson(rootJsonArray.getJSONObject(i).toString(), clazz);
list.add(t);
}
}
} catch (JSONException e) {
e.printStackTrace();
}
return list;
}
}
3、HomeActivity(主页面)的封装
主页面我用的是 TabLayout + ViewPager + Fragment,也是现在主流 APP 主页面的显示方式。主界面底部是我们三个模块的图标和名称,通过左右滑动能实现界面的跳转。
底部图标的实体类 CommonTabBean
public class CommonTabBean implements CustomTabEntity{
private int selectedIcon;
private int unselectedIcon;
private String title;
public CommonTabBean(String title){
this.title = title;
}
public CommonTabBean(String title, int selectedIcon, int unselectedIcon) {
this.title = title;
this.selectedIcon = selectedIcon;
this.unselectedIcon = unselectedIcon;
}
@Override
public String getTabTitle() {
return title;
}
@Override
public int getTabSelectedIcon() {
return selectedIcon;
}
@Override
public int getTabUnselectedIcon() {
return unselectedIcon;
}
}
ViewPager + Fragment 通用的 Adapter
public class CommonPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> mFragments;
public CommonPagerAdapter(FragmentManager fragmentManager, List<Fragment> mFragments){
super(fragmentManager);
this.mFragments = mFragments;
}
@Override
public Fragment getItem(int position) {
return mFragments.get(position);
}
@Override
public int getCount() {
return mFragments.size();
}
}