轻松实现Android仿淘宝地区选择功能

概述最近用淘宝客户端的时候，编辑地址的时候有个地区选择的功能。看上面的效果觉得挺酷，滚动的时候，是最后一个从下面飞上来挨着前一个。就自己鼓捣一个出来玩玩。

最近用淘宝客户端的时候，编辑地址的时候有个地区选择的功能。看上面的效果觉得挺酷，滚动的时候，是最后一个从下面飞上来挨着前一个。就自己鼓捣一个出来玩玩。

说了效果可能不太直观，下面上两张图看看效果

淘宝地区选择效果

再来一张自己的效果

gif的效果可能不太好，大家自己用AndroID手机打开淘宝看看

实现分析

展示很简单，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://123.184.16.19:8008/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<AreaInfo> 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<position&&lastposition!=0){    ObjectAnimator.offloat(convertVIEw,"translationY",convertVIEw.getHeight()*2,0).setDuration(500).start();   }   lastposition = position;   return convertVIEw;  }  class VIEwHolder{   TextVIEw textVIEw;  } }

很常见的一个Adapter写法，只是在getVIEw当中获取到了要显示的vIEw，通过
ObjectAnimator.offloat(convertVIEw,”translationY”,0).setDuration(500).start()为veiw设置了动画，

这里还用了个变量position来区别只有在向上滚动的时候才会有动画。不过我觉得不加position区别的效果也不错，大家可以试试。

其实这样已经实现了效果，接下来顺便提一下Activity对Framgnet中onItemClick的处理。

3、Activity和fragment的交互处理

public class AreaSelectActivity extends AppCompatActivity implements AreaFragment.OnFragmentInteractionListener{ private Fragment oneFragment; private Fragment twoFragment; private Map map = new HashMap(); @OverrIDe protected voID onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentVIEw(R.layout.activity_area_select);  ButterKnife.bind(this);  //新建第一级地区，parentCode参数为null  oneFragment = AreaFragment.newInstance("");  FragmentManager fragmentManager = getSupportFragmentManager();  fragmentManager.beginTransaction().replace(R.ID.content,oneFragment).commit(); } @OverrIDe public boolean onoptionsItemSelected(MenuItem item) {  switch (item.getItemID()){   case androID.R.ID.home:    FragmentManager fragmentManager = getSupportFragmentManager();    if (fragmentManager.getBackStackEntryCount()>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",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://123.184.16.19:8008/area/List

源码提供给大家参考：Android仿淘宝地区选择

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的轻松实现Android仿淘宝地区选择功能全部内容，希望文章能够帮你解决轻松实现Android仿淘宝地区选择功能所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。