仿淘宝、京东多重商品属性组合Sku标签

一、概述

首先声明,在这个Demo中我用到了zhy大神的自定义控件Android TagFlowLayout完全解析 一款针对Tag的布局,我只是在他的基础上对源码进行了一些修改,可以运用到我的项目中。

好了,现在话不多说,大家先看下效果:
商品属性选择

这个效果就是我现在APP里的效果,在平时看见大家好像这方面问得比较多,所以我就写成了一个Demo,希望对大家有帮助。

这个Demo可满足:
1、商品属性无上限(多少个都可以)
2、实时刷新不可选择属性
3、布局完全可自定义。(文字、颜色、框体)


二、使用

(1)前面也说了,是在zhy大神的自定义控件的基础上,所以我们要先接入这个项目

dependencies {
compile ‘com.zhy:flowlayout-lib:1.0.3’
}

(2)在添加完依懒后把Demo中的FlowLayout、TagFlowLayout、TagAdapter复制到项目中,前面说过我进行了一些修改。
Attribute是商品属性的Base类,可自定义,里面记录了当前属性的集合和不可选属性的集合。
(3)布局中使用

用的是已修改过在项目中的Tag.

    <com.example.itzwh.shoppingattribute.TagFlowLayout
                        android:id="@+id/tf_color"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        zhy:gravity="@string/gravity_left"
                        zhy:max_select="1"/>

(3)代码中:

前期数据处理(拿到各个属性的商品数据集合和不可选的商品属性集合

 String[] split = Sku.split(":");
        String splitsColor = split[0];
        String splitsSize = split[1];
        ColorAtt.FailureAliasName.clear();
        for (int i = 0; i < mColorDate.size(); i++) {
            if (splitsColor.equals(mColorDate.get(i))) {
                DefaultColor = i;
                Color = DefaultColor;
            }
            //拿到颜色属性不可选的属性集合
            String sku = mColorDate.get(i) + ":" + splitsSize;
            for (int j = 0; j < mFailureSkuDate.size(); j++) {
                if (sku.equals(mFailureSkuDate.get(j))) {
                    ColorAtt.FailureAliasName.add(mColorDate.get(i));
                }
            }
        }
        SizeAtt.FailureAliasName.clear();
        for (int i = 0; i < mSizeDate.size(); i++) {
            if (splitsSize.equals(mSizeDate.get(i))) {
                DefaultSize = i;
                Size = DefaultSize;
            }
            //拿到大小属性不可选的属性集合
            String sku = splitsColor + ":" + mSizeDate.get(i);
            for (int j = 0; j < mFailureSkuDate.size(); j++) {
                if (sku.equals(mFailureSkuDate.get(j))) {
                    SizeAtt.FailureAliasName.add(mSizeDate.get(i));
                }
            }
        })

属性点击事件
//颜色属性标签点击事件

      mTfColor.setOnTagClickListener(new TagFlowLayout.OnTagClickListener() {
                boolean is;

                @Override
                public boolean onTagClick(View view, int position, FlowLayout parent) {

                    is = false;
                    //从Base类中拿到不可点击的属性名称进行比较
                    List<String> st = ColorAtt.getFailureAliasName();
                    for (int i = 0; i < st.size(); i++) {
                        if (st.get(i).equals(mColorDate.get(position))) {
                            is = true;
                        }
                    }
                    //如是不可点击就进接return 这样就形成了不可点击的假像,达到了我们的目的
                    if (is) {
                        return true;
                    }

                    if (position == DefaultColor) {
                        DefaultColor = -1;
                        ColorStr = "";
                        SizeAtt.FailureAliasName.clear();
                        TagAdapNotify(mSizeAdapter, DefaultSize);
                        return true;
                    } else {
                        DefaultColor = position;
                        ColorStr = mColorDate.get(position);
                    }
                    SizeAtt.FailureAliasName.clear();
                    for (int i = 0; i < mSizeDate.size(); i++) {
                        String sku = ColorStr + ":" + mSizeDate.get(i);
                        for (int j = 0; j < mFailureSkuDate.size(); j++) {
                            if (sku.equals(mFailureSkuDate.get(j))) {
                                SizeAtt.FailureAliasName.add(mSizeDate.get(i));
                            }
                        }
                    }
                    TagAdapNotify(mSizeAdapter, DefaultSize);
                    return true;
                }
            });

Tag Adpater 每个属性控件加载数据和布局

  class mTagAdapter extends TagAdapter<String> {

        private TextView tv;

        public mTagAdapter(Attribute ab) {
            super(ab);
        }

        @Override
        public View getView(FlowLayout parent, int position, Attribute t) {
            boolean is = false;
            //两个布局,一个是可点击的布局,一个是不可点击的布局
            List<String> st = t.FailureAliasName;
            if (st != null) {
                for (int i = 0; i < st.size(); i++) {
                    if (st.get(i).equals(t.aliasName.get(position))) {
                        is = true;
                    }
                }
            }
            if (!is) {
                tv = (TextView) mInflater.inflate(R.layout.popupwindow_tv, parent, false);
                tv.setText(t.aliasName.get(position));
            } else {
                tv = (TextView) mInflater.inflate(R.layout.popupwindow_tv1, parent, false);
                tv.setText(t.aliasName.get(position));
            }

            return tv;
        }
    }


说了这么多大家可能在想这个2货写的啥呢,其实我也想说上面那些代码分开看真的我都看不懂,哈哈。
所以我还是建议大家下载Demo来看,玩一下, 就知道怎么玩了。

本文Demo

大家有什么意见和建议可以在下面提示来哦。

  • 5
    点赞
  • 32
    收藏
    觉得还不错? 一键收藏
  • 18
    评论
评论 18
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值