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

 更新时间:2020年06月23日 17:21:35   作者:yissan  
这篇文章主要介绍了轻松实现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”,convertView.getHeight()*2,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",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://123.184.16.19:8008/area/list

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • android实现切换日期左右无限滑动效果

    android实现切换日期左右无限滑动效果

    本篇内容给大家分享了android开发时候实现自定义的日期无限左右滑动效果以及控件使用的技巧。
    2017-11-11
  • Android 5.0中CoordinatorLayout的使用技巧

    Android 5.0中CoordinatorLayout的使用技巧

    这篇文章主要为大家详细介绍了Android 5.0中CoordinatorLayout的使用技巧,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-09-09
  • 解析Android应用启动后自动创建桌面快捷方式的实现方法

    解析Android应用启动后自动创建桌面快捷方式的实现方法

    和IOS开发和Windows Phone开发相比,Android是开放的,Android上的开发也相对更加灵活,能够做很多事情。有的朋友会发现,在某些Android应用安装以后,第一次运行,就会在桌面创建快捷方式。这是如何做到的呢
    2013-05-05
  • Flutter permission_handler 权限插件的使用详解

    Flutter permission_handler 权限插件的使用详解

    这篇文章主要介绍了Flutter permission_handler 权限插件的使用,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-04-04
  • android打开本地图像的方法

    android打开本地图像的方法

    这篇文章主要介绍了android打开本地图像的方法,涉及Android操作图像的相关技巧,需要的朋友可以参考下
    2015-04-04
  • Android三种GSM手机技术分析

    Android三种GSM手机技术分析

    本文将详细介绍Android三种GSM技术比较差别,有感兴趣的朋友可以参考下
    2012-12-12
  • 详解在Flutter中如何使用dio

    详解在Flutter中如何使用dio

    应用程序开发的一个关键部分是优雅地处理网络请求。网络返回的响应可能包含意想不到的结果,为了获得良好的用户体验,您需要提前处理边缘情况。本文将详细为大家介绍Flutter如何使用dio,需要的可以参考一下
    2022-04-04
  • Android自定义Dialog内部透明、外部遮罩效果

    Android自定义Dialog内部透明、外部遮罩效果

    这篇文章主要为大家详细介绍了Android自定义Dialog内部透明、外部遮罩效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-10-10
  • Android实现简单QQ登录页面

    Android实现简单QQ登录页面

    这篇文章主要为大家详细介绍了Android实现简单QQ登录页面,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04
  • android实现QQ微信侧滑删除效果

    android实现QQ微信侧滑删除效果

    这篇文章主要为大家详细介绍了android实现QQ微信侧滑删除效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-12-12

最新评论