技术经验解读：一步步实现仿制AndroidLOL多玩盒子(一)概览

一、起源

最近比较闲，玩LOL的时候感觉 Android LOL多玩盒子 里面应用到的东西挺多也挺有意思，打算仿照着做一个。抱着练练手的心态，打算只使用原APK中的图片，代码和布局均自己实现。由于该应用涉及的内容较多、个人能力和空闲时间受限，可能部分功能难以实现。项目完成度达到一定程度后会将代码放到 csdn code中去。如果涉及到版权问题，请告知，我将立刻处理。

二、简单的初步分析

1，仿制过程需要使用的工具

抓包工具Fiddler、图片异步加载框架 universal-image-loader、网络请求框架android-async-http、Json解析工具jacksonjson、百度地图SDK、可能会需要使用到html解析工具 htmlparser。

2，主界面布局分析

官方版本界面如下。底部一排工具按钮，控制上半部分功能界面的切换。可能是因为在资讯页面中左右滑动的事件用来切换资讯类型了，各功能界面的之间的切换不支持左右滑动。于是，这一框架的实现比较简单，各功能界面分别放在Fragment中，底部的工具按钮控制各Fragment的显示或隐藏。标题栏的实现方式，不打算使用ActionBar，而是在布局中自己实现。

三、主界面初步实现

主界面Activity

package com.warren.lolbox;

import android.app.Activity;

import android.app.FragmentTransaction;

import android.os.Bundle;

import com.warren.lolbox.model.BaseContentFragment;

import com.warren.lolbox.model.IListener;

/

主界面

@author warren

@date 2014年12月28日

/

public class MainActivity extends Activity {

private FootFragment mFootFrag;

/

用于各功能Fragment切换的监听器

/

private IListener mListener;

private BaseContentFragment【】 mFragContents = new BaseContentFragment【5】;

private int mCurrentFragIndex = 0;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mListener = new IListener() {

@Override

public void onCall(Integer t) {

FragmentTransaction tranc = getFragmentManager().beginTransaction();

tranc.hide(mFragContents【mCurrentFragIndex】);

// 如果功能Fragment之前从未打开过，则创建并添加之；如果打开过，则显示之。

if (mFragContents【t】 == null) {

switch (t) {

case 0:

mFragContents【t】 = new ToolFragment();

break;

case 1:

mFragContents【t】 = new NewsFragment();

break;

case 2:

mFragContents【t】 = new ChatFragment();

break;

case 3:

mFragContents【t】 = new ActionFragment();

break;

case 4:

mFragContents【t】 = new FindFragment();

break;

default:

break;

}

tranc.add(R.id.fl_main_frags, mFragContents【t】, mFragContents【t】.getName());

} else {

tranc.show(mFragContents【t】);

}

tranc.commit();

mCurrentFragIndex = t;

}

};

initFrags();

}

/

添加初始Fragment

/

private void initFrags() {

FragmentTransaction tranc = getFragmentManager().beginTransaction();

mFootFrag = new FootFragment();

// 设置工具选中监听器回调。

mFootFrag.setListeners(mListener);

tranc.add(R.id.ll_main_foot_root, mFootFrag, mFootFrag.getName());

mFragContents【0】 = new ToolFragment();

tranc.add(R.id.fl_main_frags, mFragContents【0】, mFragContents【0】.getName());

tranc.commit();

}

}

第一个内容Fragment

package com.warren.lolbox;

import java.util.ArrayList;

import java.util.List;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.AbsListView;

import android.widget.AdapterView;

import android.widget.AdapterView.OnItemClickListener;

import android.widget.BaseAdapter;

import android.widget.GridView;

import android.widget.ImageView;

import android.widget.LinearLayout;

import android.widget.TextView;

import com.warren.lolbox.model.BaseContentFragment;

import com.warren.lolbox.model.SimpleTool;

/

工具Fragment

@author warren

@date 2014年12月28日

/

public class ToolFragment extends BaseContentFragment {

private static String LOGTAG = "ToolFragment";

private LinearLayout mLlRoot;

private GridView mGridTools;

private AdapterGridTools mAdapter;

private List mTools = new ArrayList();

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

mLlRoot = (LinearLayout) inflater.inflate(R.layout.frag_tool, container, false);

initTools();

initCtrl();

return mLlRoot;

}

private void initTools() {

SimpleTool stBMYX = new SimpleTool(R.drawable.tool_menu_hero, R.string.toolmenu_bmyxtest);

SimpleTool stHero = new SimpleTool(R.drawable.tool_menu_hero, R.string.toolmenu_yx);

SimpleTool stVideo = new SimpleTool(R.drawable.tool_menu_video, R.string.toolmenu_video);

SimpleTool stShake = new SimpleTool(R.drawable.tool_menu_shake, R.string.toolmenu_shrink);

SimpleTool stLottery = new SimpleTool(R.drawable.tool_menu_shake, R.string.toolmenu_lottery);

SimpleTool stNews = new SimpleTool(R.drawable.tool_menu_news, R.string.toolmenu_boxnews);

SimpleTool stLiveShow = new SimpleTool(R.drawable.tool_menu_live,

R.string.toolmenu_liveshow);

SimpleTool stReflectTest = new SimpleTool(R.drawable.tool_menu_video,

R.string.toolmenu_reflecttest);

SimpleTool stBaike = new SimpleTool(R.drawable.tool_menu_baike, R.string.toolmenu_baike);

mTools.add(stBMYX);

mTools.add(stHero);

mTools.add(stVideo);

mTools.add(stShake);

mTools.add(stLottery);

mTools.add(stNews);

mTools.add(stLiveShow);

mTools.add(stReflectTest);

mTools.add(stBaike);

}

private void initCtrl() {

mGridTools = (GridView) mLlRoot.findViewById(R.id.grid_tools);

mAdapter = new AdapterGridTools(LayoutInflater.from(mLlRoot.getContext()));

mAdapter.setTools(mTools);

mGridTools.setAdapter(mAdapter);

mGridTools.setOnItemClickListener(new OnItemClickListener() {

@Override

public void onItemClick(AdapterView parent, View view, int position, long id) {

}

});

}

@Override

public String getName() {

return "ToolFragment";

}

/

工具网格的Adapter

@author warren

@date 2014年12月28日

/

class AdapterGridTools //代码效果参考：http://www.jhylw.com.cn/212941703.html

extends BaseAdapter {

private LayoutInflater inflater;

private List lstTools;

public AdapterGridTools(LayoutInflater inflater) {

this.inflater = inflater;

}

public void setTools(List tools) {

this.lstTools = tools;

}

@Override

public int getCount() {

return mTools.size();

}

@Override

public Object getItem(int position) {

return mTools.get(position);

}

@Override

public long getItemId(int position) //代码效果参考：http://www.jhylw.com.cn/474927843.html

{

return 0;

}

@Override

public View getView(int position, View convertView, ViewGroup parent) {

ViewHolder holder;

if (convertView == null) {

convertView = inflater.inflate(R.layout.frag_tool_grid, parent, false);

holder = new ViewHolder();

holder.img = (ImageView) convertView.findViewById(R.id.img);

holder.tv = (TextView) convertView.findViewById(R.id.tv);

convertView.setTag(holder);

} else {

holder = (ViewHolder) convertView.getTag();

}

holder.img.setImageResource(lstTools.get(position).imgResId);

holder.tv.setText(lstTools.get(position).txtResId);

// 设置GridView的子项完全填充GridView

AbsListView.LayoutParams param = new AbsListView.LayoutParams(

android.view.ViewGroup.LayoutParams.MATCH_PARENT, mGridTools.getHeight()

/ (lstTools.size() / 3));

convertView.setLayoutParams(param);

return convertView;

}

class ViewHolder {

ImageView img;

TextView tv;

}

}

}

几个基础类和接口

package com.warren.lolbox.model;

public interface IBaseContentFragment extends IBaseFragment{

}

package com.warren.lolbox.model;

import android.app.Fragment;

/

内容Fragment的基类

@author warren

@date 2014年12月28日

/

public abstract class BaseContentFragment extends Fragment implements IBaseContentFragment {

}

package com.warren.lolbox.model;

public interface IBaseContentFragment extends IBaseFragment{

}

package com.warren.lolbox.model;

public interface IListener {

public void onCall(T t);

}

package com.warren.lolbox.model;

/*

简单元工具

@author warren

@date 2014年12月28日

*/

public class SimpleTool {

public int imgResId;

public int txtResId;

public SimpleTool(int imgResId, int txtResId) {

super();

this.imgResId = imgResId;

this.txtResId = txtResId;

}

}

初步的主界面效果