Android小记-仿淘宝联动地址选择对话框

介绍

github：github.com/apinIron/Li…

由于UI设计需要，模仿了淘宝的收货地址选择对话框，就简单的封装了一个对话框。

使用了TabLayout + ViewPager来进行实现，ViewPager中每个页面都是一个RecyclerView。

效果如下：

使用

在代码中使用：

LinkageDialog dialog = new LinkageDialog.Builder(MainActivity.this, 3).setLinkageData(getCityList())
        .setTitle("配送至")
        .setTabIndicatorColor(Color.parseColor("#EA6F5A"))
        .setTabTitleColor(Color.BLACK, Color.parseColor("#EA6F5A"))
        .setTabIndicatorHeight((int) getResources().getDimension(R.dimen.indicator_height))
        .setContentHeight((int) (getResources().getDimension(R.dimen.item_city_height) * 4))
        .setOnLinkageAdapterListener(new LinkageDialog.IOnLinkageAdapterListener() {
            @Override
            public BaseLinkageItemAdapter getAdapter() {
                return new MyLinkageItemAdapter(MainActivity.this);
            }
        })
        .setOnLinkageSelectListener(new LinkageDialog.IOnLinkageSelectListener() {
            @Override
            public void onLinkageSelect(LinkageItem... items) {
                toastLinkageItem(items);
            }
        }).build();
复制代码

方法描述

//设置对话框的标题
setTitle(String title) 

//设置数据源(数据需实现LinkageItem接口)
setLinkageData(List data) 

//设置内容高度（RecyclerView）
setContentHeight(int contentHeight) 

//设置tabLayout指示器颜色
setTabIndicatorColor(int colorTabIndicator) 

//设置tabLayout指示器高度
setTabIndicatorHeight(int tabIndicatorHeight) 

//设置tabLayout标题选中和未选中的字体颜色
setTabTitleColor(int colorTabSelectTitleColor,int colorTabWaitSelectTitleColor) 

//监听选择事件
setOnLinkageSelectListener(IOnLinkageSelectListener listener) 

//如需要自定义RecyclerView的item布局，需设置这个方法
setOnLinkageAdapterListener(IOnLinkageAdapterListener listener) 
复制代码

如果想要自定义选择列表的item效果，只需要自定义自己的Adapter实现BaseLinkageItemAdapter即可，如下：

public class MyLinkageItemAdapter extends BaseLinkageItemAdapter {

    public MyLinkageItemAdapter(Context context) {
        super(context);
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        return new ViewHolder(LayoutInflater.from(mContext).inflate(R.layout.item_linkage_my, parent,false));
    }

    @Override
    protected void bindView(ViewHolder holder, LinkageItem item, boolean isSelect) {
        holder.textView.setText(item.getLinkageName());
        holder.textView.setTextColor(isSelect ? Color.BLACK : Color.GRAY);
        holder.imageView.setVisibility(isSelect ? View.VISIBLE : View.INVISIBLE);
    }

    class ViewHolder extends RecyclerView.ViewHolder {

        TextView textView;
        ImageView imageView;

        public ViewHolder(View itemView) {
            super(itemView);

            textView = itemView.findViewById(R.id.tv_linkage_title);
            imageView = itemView.findViewById(R.id.iv_select);
        }
    }
}
复制代码

实现

在创建对话框的时候需要设定最多联动级数。

//添加tab
for (int i = 0; i < mBuilder.linkageCount; i++) {
    tlLinkageTab.addTab(tlLinkageTab.newTab());
}
复制代码

但是添加的tab都是可以点击的，可是需要的效果是已选择过的tab和待选择的tab才可以点击，然后就通过设置clickable来让待选择的tab后面的tab都无法点击。（每个tab并不是tabLayout的直接孩子，需要getChildAt(0)，然后遍历获取每一个tab）

LinearLayout tabStrip = ((LinearLayout)tlLinkageTab.getChildAt(0));
for(int i = position; i < tabStrip.getChildCount(); i++) {
    tabStrip.getChildAt(i).setClickable(false);
    setLinkageTabText(i,"");
}
复制代码

到此tab还有一个问题，就是 tabLayout.setTabTextColorssetTabTextColors(int normalColor, int selectedColor) 无法直接使用，因为他是效果是选中和默认情况下tab的字体颜色，而需求是已选择过的tab是一个字体颜色，等待选择的tab字体是一个颜色而不是跟着选择走。所以用了tab.setCustomView(tv)方式自定义tab的View。

然后就是为ViewPager设置适配器，每个页面都创建一个RecyclerView。监听每个recyclerView的item点击事件来处理点击事件。

已这篇文章记录下当初实现的时候遇到的一些问题。

转载于:https://juejin.im/post/5b3f0c5a6fb9a04fac0cf0dd