你的浏览器禁用了JavaScript, 请开启后刷新浏览器获得更好的体验!
首页
热门
推荐
精选
登录
|
注册
Android 轻松实现仿淘宝地区选择
立即下载
用AI写一个
金额:
1
元
支付方式:
友情提醒:源码购买后不支持退换货
立即支付
我要免费下载
发布时间:2017-08-11
22人
|
浏览:6357次
|
收藏
|
分享
技术:AndroidUI+Android动画
运行环境:Andorid Studio
概述
最近用淘宝客户端的时候,编辑地址的时候有个地区选择的功能。看上面的效果觉得挺酷,滚动的时候,是最后一个从下面飞上来挨着前一个。就自己鼓捣一个出来玩玩。
详细
### 一、准备工作 Android开发环境,学习Android的童鞋肯定都知道了,这里我就不累述了。 ### 二、运行效果 说了效果可能不太直观,下面上两张图看看效果 淘宝地区选择效果 ![淘宝](http://img.blog.csdn.net/20160609221909097) 再来一张自己的效果 ![这里写图片描述](http://img.blog.csdn.net/20160609222009034) gif的效果可能不太好,大家自己用Android手机打开淘宝看看 ### 三、项目结构 ![](/contentImages/image/20170811/ddhKFrIK7BzwUHHTEtb.png) ### 四、程序实现 展示很简单,ListView就可以了。对于动画效果,只需要在getView的时候获取到要展示的View,通过属性动画修改translationY就ok啦。由于地区选择是一个界面,所以这里还用到了Fragment的 addToBackStack知识 #### 1、用来展示的Fragment 用一个Fragment来接受parentCode参数来获取父地区的所有子地区,然后进行显示。这里用Fragment来做是因为用Activity的话,这样的连续点击都是同一类的界面不太适合。 ``` public class AreaFragment extends Fragment implements AdapterView.OnItemClickListener { private static final String ARG_PARAM1 = "parentCode"; @Bind(R.id.refresh_list_view) ListView mRefreshListView; @Bind(R.id.loadingBar) ProgressBar mLoadingBar; private String mParam1;//parentCode参数 OkHttpClient mOkHttpClient = new OkHttpClient(); private OnFragmentInteractionListener mListener; private AreaAdapter adapter;//地区adapter public AreaFragment() { } /** * Use this factory method to create a new instance of * this fragment using the provided parameters. * * @param param1 Parameter 1. * @return A new instance of fragment AreaFragment. */ public static AreaFragment newInstance(String param1) { AreaFragment fragment = new AreaFragment(); Bundle args = new Bundle(); args.putString(ARG_PARAM1, param1); fragment.setArguments(args); return fragment; } @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); if (getArguments() != null) { //获取父地区的code,用来查询子地区 mParam1 = getArguments().getString(ARG_PARAM1); } } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Inflate the layout for this fragment View view = inflater.inflate(R.layout.fragment_area, container, false); ButterKnife.bind(this, view); mRefreshListView.setOnItemClickListener(this); FormEncodingBuilder builder = new FormEncodingBuilder(); builder.add(ARG_PARAM1,mParam1); //通过parentCode来请求地区,如果parentCode不存在就是第一级 final Request request = new Request.Builder() .url("http://120.77.175.168:9000/area/list") .post(builder.build()) .build(); mOkHttpClient.newCall(request).enqueue(new Callback(){ @Override public void onFailure(Request request, IOException e) { } @Override public void onResponse(Response response) throws IOException { final String res = response.body().string(); if (res!=null){ Gson gson = new Gson(); JsonResult jsonResult = gson.fromJson(res, JsonResult.class); if (jsonResult.isSuccess()){ List list = (List) jsonResult.getResult(); List newList = new ArrayList(); Iterator iterator = list.iterator(); while (iterator.hasNext()){ Map map = (Map) iterator.next(); AreaInfo areaInfo = gson.fromJson(gson.toJson(map),AreaInfo.class); newList.add(areaInfo); } adapter = new AreaAdapter(getContext(),newList); getActivity().runOnUiThread(new Runnable() { @Override public void run() { //拿到数据进行展示 mRefreshListView.setAdapter(adapter); } }); } } } }); return view; } @Override public void onAttach(Context context) { super.onAttach(context); if (context instanceof OnFragmentInteractionListener) { mListener = (OnFragmentInteractionListener) context; } else { throw new RuntimeException(context.toString() + " must implement OnFragmentInteractionListener"); } } @Override public void onDetach() { super.onDetach(); mListener = null; } @Override public void onDestroyView() { super.onDestroyView(); ButterKnife.unbind(this); } @Override public void onItemClick(AdapterView> parent, View view, int position, long id) { //单击的时候需要处理地区点击事件,统一交给Activity处理 AreaInfo areaInfo = (AreaInfo) parent.getAdapter().getItem(position); if (areaInfo==null) return; if (mListener!=null){ mListener.onFragmentInteraction(areaInfo); } } //用来和Activity交互的回调接口 public interface OnFragmentInteractionListener { void onFragmentInteraction(AreaInfo areaInfo); } ``` 我们用了一个Fragment来接受parentCode,用于请求下一级的地区,获取成功之后进行了展示。并且提供了一个OnFragmentInteractionListener用来在onItemClick时与Activity交互。 接下来看adapter,最开始我们提到了要实现淘宝的效果我们只需要拿到即将显示的View,设置动画就可以了。 #### 2、处理显示效果的adapter ``` class AreaAdapter extends BaseAdapter { private List list; private int lastPosition; public AreaAdapter(Context context, List
list) { this.list = list; } @Override public int getCount() { return list.size(); } @Override public Object getItem(int position) { return list.get(position); } @Override public long getItemId(int position) { return 0; } @Override public View getView(int position, View convertView, ViewGroup parent) { ViewHolder viewHolder = null; if (convertView==null){ convertView = LayoutInflater.from(getContext()).inflate(R.layout.area_list_item,parent,false); viewHolder = new ViewHolder(); viewHolder.textView = (TextView) convertView.findViewById(android.R.id.text1); convertView.setTag(viewHolder); } viewHolder = (ViewHolder) convertView.getTag(); AreaInfo item = (AreaInfo) list.get(position); viewHolder.textView.setText(item.getAreaName()); if (lastPosition
0){ fragmentManager.popBackStack(); }else{ finish(); } break; } return true; } /** * 处理交互,hide前一个fragment,并且调用addToBackStack让Fragment可以点击back的时候显示前一个fragment * 如果是第三级地区则直接返回地区选择数据给上个Activity * @param areaInfo 被点击的地区信息 */ @Override public void onFragmentInteraction(AreaInfo areaInfo) { if (areaInfo==null){ return; } FragmentTransaction transaction = getSupportFragmentManager().beginTransaction(); int level = areaInfo.getLevel(); switch (level){ case 1: map.put("provId",areaInfo.getId()); map.put("provName",areaInfo.getAreaName()); if (areaInfo.isLeaf()){ Intent intent = new Intent(); intent.putExtra("addressInfo", (Serializable) map); setResult(RESULT_OK,intent); finish(); }else{ transaction.hide(oneFragment); transaction.add(R.id.content,twoFragment=AreaFragment.newInstance(areaInfo.getAreaCode()+"")).addToBackStack(null).commit(); } break; case 2: map.put("cityId",areaInfo.getId()); map.put("cityName",areaInfo.getAreaName()); if (areaInfo.isLeaf()){ Intent intent = new Intent(); intent.putExtra("addressInfo", (Serializable) map); setResult(RESULT_OK,intent); finish(); }else { transaction.hide(twoFragment); transaction.add (R.id.content, AreaFragment.newInstance(areaInfo.getAreaCode()+"")).addToBackStack(null).commit(); } break; case 3: map.put("districtId",areaInfo.getId()); map.put("districtName",areaInfo.getAreaName()); Intent intent = new Intent(); intent.putExtra("addressInfo", (Serializable) map); setResult(RESULT_OK,intent); finish(); break; } } } ``` 这样仿淘宝地区选择就实现啦! ### 五、其他补充 大家可以自己写测试接口,也可以直接调用我写好的接口: http://120.77.175.168:9000/area/list 赶快下载运行一下吧,是不是很淘宝地区选择神似!
本实例支付的费用只是购买源码的费用,如有疑问欢迎在文末留言交流,如需作者在线代码指导、定制等,在作者开启付费服务后,可以点击“购买服务”进行实时联系,请知悉,谢谢
感谢
1
手机上随时阅读、收藏该文章 ?请扫下方二维码
相似例子推荐
评论
作者
岁月轻狂啊
1
例子数量
22
帮助
1
感谢
评分详细
可运行:
4.5
分
代码质量:
4.5
分
文章描述详细:
4.5
分
代码注释:
4.5
分
综合:
4.5
分
作者例子
Android 轻松实现仿淘宝地区选择