//对应的主布局.xml,
//两个子布局.xml
item_shopcart_group.xml
//item_shopcart_product.xml
public class ShopcartAdapter extends BaseExpandableListAdapter {
private List groups;
private Map> children;
private Context context;
private CheckInterface checkInterface;
private ModifyCountInterface modifyCountInterface;
private int flag = 0;
private GroupEdtorListener mListener;
public GroupEdtorListener getmListener() {
return mListener;
}
public void setmListener(GroupEdtorListener mListener) {
this.mListener = mListener;
}
/**
* 构造函数
* @param groups 组元素列表
* @param children 子元素列表
* @param context
*/
public ShopcartAdapter(List groups, Map> children, FragmentActivity context) {
this.groups = groups;
this.children = children;
this.context=context;
}
public void setCheckInterface(CheckInterface checkInterface) {
this.checkInterface = checkInterface;
}
public void setModifyCountInterface(ModifyCountInterface modifyCountInterface) {
this.modifyCountInterface = modifyCountInterface;
}
@Override
public int getGroupCount() {
return groups.size();
}
@Override
public int getChildrenCount(int groupPosition) {
String groupId = groups.get(groupPosition).getId();
return children.get(groupId).size();
}
@Override
public Object getGroup(int groupPosition) {
return groups.get(groupPosition);
}
@Override
public Object getChild(int groupPosition, int childPosition) {
List childs = children.get(groups.get(groupPosition).getId());
return childs.get(childPosition);
}
@Override
public long getGroupId(int groupPosition) {
return groupPosition;
}
@Override
public long getChildId(int groupPosition, int childPosition) {
return childPosition;
}
@Override
public boolean hasStableIds() {
return false;
}
@Override
public View getGroupView(final int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
final GroupViewHolder gholder;
if (convertView == null) {
gholder = new GroupViewHolder();
convertView = View.inflate(context, R.layout.item_shopcart_group, null);
gholder.cb_check = (CheckBox) convertView.findViewById(R.id.determine_chekbox);
gholder.tv_group_name = (TextView) convertView.findViewById(R.id.tv_source_name);
gholder.store_edtor = (Button) convertView.findViewById(R.id.tv_store_edtor);
convertView.setTag(gholder);
} else {
gholder = (GroupViewHolder) convertView.getTag();
}
final StoreInfo group = (StoreInfo) getGroup(groupPosition);
if (group != null) {
gholder.tv_group_name.setText(group.getName());
gholder.cb_check.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v)
{
group.setChoosed(((CheckBox) v).isChecked());
checkInterface.checkGroup(groupPosition, ((CheckBox) v).isChecked());// 暴露组选接口
}
});
gholder.cb_check.setChecked(group.isChoosed());
gholder.store_edtor.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
mListener.groupEdit(groupPosition);
if (flag == 0) {
group.setIsEdtor(true);
gholder.store_edtor.setText("完成");
} else if (flag == 1) {
group.setIsEdtor(false);
gholder.store_edtor.setText("编辑");
}
flag = (flag + 1) % 2;//其余得到循环执行上面2个不同的功能
}
});
} else {
groups.remove(groupPosition);
}
return convertView;
}
@Override
public View getChildView(final int groupPosition, final int childPosition, final boolean isLastChild, View convertView, final ViewGroup parent) {
final ChildViewHolder cholder;
if (convertView == null) {
cholder = new ChildViewHolder();
convertView = View.inflate(context, R.layout.item_shopcart_product, null);
cholder.cb_check = (CheckBox) convertView.findViewById(R.id.check_box);
cholder.tv_product_desc = (TextView) convertView.findViewById(R.id.tv_intro);
cholder.tv_price = (TextView) convertView.findViewById(R.id.tv_price);
cholder.iv_increase = (TextView) convertView.findViewById(R.id.tv_add);
cholder.iv_decrease = (TextView) convertView.findViewById(R.id.tv_reduce);
cholder.tv_count = (TextView) convertView.findViewById(R.id.tv_num);
cholder.rl_no_edtor = (RelativeLayout) convertView.findViewById(R.id.rl_no_edtor);
cholder.tv_color_size = (TextView) convertView.findViewById(R.id.tv_color_size);
cholder.tv_discount_price = (TextView) convertView.findViewById(R.id.tv_discount_price);
cholder.tv_buy_num = (TextView) convertView.findViewById(R.id.tv_buy_num);
cholder.ll_edtor = (LinearLayout) convertView.findViewById(R.id.ll_edtor);
cholder.tv_colorsize = (TextView) convertView.findViewById(R.id.tv_colorsize);
cholder.tv_goods_delete = (TextView) convertView.findViewById(R.id.tv_goods_delete);
cholder.iv_adapter_list_pic= (ImageView) convertView.findViewById(R.id.iv_adapter_list_pic);
convertView.setTag(cholder);
} else {
cholder = (ChildViewHolder) convertView.getTag();
}
if (groups.get(groupPosition).isEdtor() == true) {
cholder.ll_edtor.setVisibility(View.VISIBLE);
cholder.rl_no_edtor.setVisibility(View.GONE);
} else {
cholder.ll_edtor.setVisibility(View.GONE);
cholder.rl_no_edtor.setVisibility(View.VISIBLE);
}
final GoodsInfo goodsInfo = (GoodsInfo) getChild(groupPosition, childPosition);
if (goodsInfo != null) {
cholder.tv_product_desc.setText(goodsInfo.getDesc());
cholder.tv_price.setText("¥" + goodsInfo.getPrice() + "");
cholder.tv_count.setText(goodsInfo.getCount() + "");
cholder.iv_adapter_list_pic.setImageResource(goodsInfo.getGoodsImg());
cholder.tv_color_size.setText("颜色:" + goodsInfo.getColor() + "," + "尺码:" + goodsInfo.getSize() + "瓶/斤");
SpannableString spanString = new SpannableString("¥"+String.valueOf(goodsInfo.getDiscountPrice()));
StrikethroughSpan span = new StrikethroughSpan();
spanString.setSpan(span, 0, String.valueOf(goodsInfo.getDiscountPrice()).length()+1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
if(cholder.tv_discount_price.getText().toString().length()>0){
cholder.tv_discount_price.setText("");
}
cholder.tv_discount_price.append(spanString);
cholder.tv_buy_num.setText("x" + goodsInfo.getCount());
cholder.cb_check.setChecked(goodsInfo.isChoosed());
cholder.cb_check.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
goodsInfo.setChoosed(((CheckBox) v).isChecked());
cholder.cb_check.setChecked(((CheckBox) v).isChecked());
checkInterface.checkChild(groupPosition, childPosition, ((CheckBox) v).isChecked());// 暴露子选接口
}
});
cholder.iv_increase.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
modifyCountInterface.doIncrease(groupPosition, childPosition, cholder.tv_count, cholder.cb_check.isChecked());// 暴露增加接口
}
});
cholder.iv_decrease.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
modifyCountInterface.doDecrease(groupPosition, childPosition, cholder.tv_count, cholder.cb_check.isChecked());// 暴露删减接口
}
});
//删除 购物车
cholder.tv_goods_delete.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
AlertDialog alert = new AlertDialog.Builder(context).create();
alert.setTitle("操作提示");
alert.setMessage("您确定要将这些商品从购物车中移除吗?");
alert.setButton(DialogInterface.BUTTON_NEGATIVE, "取消",
new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
return;
}
});
alert.setButton(DialogInterface.BUTTON_POSITIVE, "确定",
new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
modifyCountInterface.childDelete(groupPosition, childPosition);
}
});
alert.show();
}
});
}
return convertView;
}
@Override
public boolean isChildSelectable(int groupPosition, int childPosition) {
return false;
}
/**
* 组元素绑定器
*/
private class GroupViewHolder {
CheckBox cb_check;
TextView tv_group_name;
Button store_edtor;
}
/**
* 子元素绑定器
*/
private class ChildViewHolder {
CheckBox cb_check;
ImageView iv_adapter_list_pic;
TextView tv_product_name;
TextView tv_product_desc;
TextView tv_price;
TextView iv_increase;
TextView tv_count;
TextView iv_decrease;
RelativeLayout rl_no_edtor;
TextView tv_color_size;
TextView tv_discount_price;
TextView tv_buy_num;
LinearLayout ll_edtor;
TextView tv_colorsize;
TextView tv_goods_delete;
}
/**
* 复选框接口
*/
public interface CheckInterface {
/**
* 组选框状态改变触发的事件
*
* @param groupPosition 组元素位置
* @param isChecked 组元素选中与否
*/
public void checkGroup(int groupPosition, boolean isChecked);
/**
* 子选框状态改变时触发的事件
*
* @param groupPosition 组元素位置
* @param childPosition 子元素位置
* @param isChecked 子元素选中与否
*/
public void checkChild(int groupPosition, int childPosition, boolean isChecked);
}
/**
* 改变数量的接口
*/
public interface ModifyCountInterface {
/**
* 增加操作
*
* @param groupPosition 组元素位置
* @param childPosition 子元素位置
* @param showCountView 用于展示变化后数量的View
* @param isChecked 子元素选中与否
*/
public void doIncrease(int groupPosition, int childPosition, View showCountView, boolean isChecked);
/**
* 删减操作
*
* @param groupPosition 组元素位置
* @param childPosition 子元素位置
* @param showCountView 用于展示变化后数量的View
* @param isChecked 子元素选中与否
*/
public void doDecrease(int groupPosition, int childPosition, View showCountView, boolean isChecked);
/**
* 删除子item
* @param groupPosition
* @param childPosition
*/
public void childDelete(int groupPosition, int childPosition);
}
/**
* 监听编辑状态
*/
public interface GroupEdtorListener{
public void groupEdit(int groupPosition);
}
}
public class Fragment4 extends android.support.v4.app.Fragment implements ShopcartAdapter.CheckInterface,
ShopcartAdapter.ModifyCountInterface, ShopcartAdapter.GroupEdtorListener{
@Bind(R.id.back)
ImageView back;
@Bind(R.id.title)
TextView title;
@Bind(R.id.subtitle)
TextView subtitle;
@Bind(R.id.top_bar)
LinearLayout topBar;
@Bind(R.id.exListView)
ExpandableListView exListView;
@Bind(R.id.all_chekbox)
CheckBox allChekbox;
@Bind(R.id.tv_total_price)
TextView tvTotalPrice;
@Bind(R.id.tv_go_to_pay)
TextView tvGoToPay;
@Bind(R.id.ll_info)
LinearLayout llInfo;
@Bind(R.id.tv_share)
TextView tvShare;
@Bind(R.id.tv_save)
TextView tvSave;
@Bind(R.id.tv_delete)
TextView tvDelete;
@Bind(R.id.ll_shar)
LinearLayout llShar;
private Context context;
private double totalPrice = 0.00;// 购买的商品总价
private int totalCount = 0;// 购买的商品总数量
private ShopcartAdapter selva;
private List groups = new ArrayList();// 组元素数据列表
private Map> children = new HashMap>();// 子元素数据列表
private int flag = 0;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View view = LayoutInflater.from(getContext()).inflate(R.layout.layout4, null);
ButterKnife.bind(this, view);
context = getActivity();
initDatas();
initEvents();
return view;
}
private void initEvents() {
selva = new ShopcartAdapter(groups, children,getActivity());
selva.setCheckInterface(this);// 关键步骤1,设置复选框接口
selva.setModifyCountInterface(this);// 关键步骤2,设置数量增减接口
selva.setmListener(this);
exListView.setAdapter(selva);
for (int i = 0; i < selva.getGroupCount(); i++) {
exListView.expandGroup(i);// 关键步骤3,初始化时,将ExpandableListView以展开的方式呈现
}
}
@Override
public void onResume() {
super.onResume();
setCartNum();
}
/**
* 设置购物车产品数量
*/
private void setCartNum() {
int count=0;
for (int i = 0; i < groups.size(); i++) {
groups.get(i).setChoosed(allChekbox.isChecked());
StoreInfo group = groups.get(i);
List childs = children.get(group.getId());
for (GoodsInfo goodsInfo:childs){
count+=1;
}
}
title.setText("购物车" + "(" + count + ")");
}
/**
* 模拟数据
* 遵循适配器的数据列表填充原则,组元素被放在一个List中,对应的组元素下辖的子元素被放在Map中,
* 其键是组元素的Id(通常是一个唯一指定组元素身份的值)
*/
private void initDatas() {
for (int i = 0; i < 3; i++) {
groups.add(new StoreInfo(i + "", "天猫店铺" + (i + 1) + "号店"));
List products = new ArrayList();
for (int j = 0; j <= i; j++) {
int[] img={R.drawable.goods1,R.drawable.goods2,R.drawable.goods3,R.drawable.goods4,R.drawable.goods5,R.drawable.goods6};
products.add(new GoodsInfo(j + "", "商品", groups.get(i)
.getName() + "的第" + (j + 1) + "个商品", 12.00 + new Random().nextInt(23), new Random().nextInt(5) + 1, "豪华", "1", img[i*j],6.00+ new Random().nextInt(13)));
}
children.put(groups.get(i).getId(), products);// 将组元素的一个唯一值,这里取Id,作为子元素List的Key
}
}
/**
* 删除操作
* 1.不要边遍历边删除,容易出现数组越界的情况
* 2.现将要删除的对象放进相应的列表容器中,待遍历完后,以removeAll的方式进行删除
*/
protected void doDelete() {
List toBeDeleteGroups = new ArrayList();// 待删除的组元素列表
for (int i = 0; i < groups.size(); i++) {
StoreInfo group = groups.get(i);
if (group.isChoosed()) {
toBeDeleteGroups.add(group);
}
List toBeDeleteProducts = new ArrayList();// 待删除的子元素列表
List childs = children.get(group.getId());
for (int j = 0; j < childs.size(); j++) {
if (childs.get(j).isChoosed()) {
toBeDeleteProducts.add(childs.get(j));
}
}
childs.removeAll(toBeDeleteProducts);
}
groups.removeAll(toBeDeleteGroups);
selva.notifyDataSetChanged();
calculate();
}
@Override
public void doIncrease(int groupPosition, int childPosition,
View showCountView, boolean isChecked) {
GoodsInfo product = (GoodsInfo) selva.getChild(groupPosition,
childPosition);
int currentCount = product.getCount();
currentCount++;
product.setCount(currentCount);
((TextView) showCountView).setText(currentCount + "");
selva.notifyDataSetChanged();
calculate();
}
@Override
public void doDecrease(int groupPosition, int childPosition,
View showCountView, boolean isChecked) {
GoodsInfo product = (GoodsInfo) selva.getChild(groupPosition,
childPosition);
int currentCount = product.getCount();
if (currentCount == 1)
return;
currentCount--;
product.setCount(currentCount);
((TextView) showCountView).setText(currentCount + "");
selva.notifyDataSetChanged();
calculate();
}
@Override
public void childDelete(int groupPosition, int childPosition) {
children.get(groups.get(groupPosition).getId()).remove(childPosition);
StoreInfo group = groups.get(groupPosition);
List childs = children.get(group.getId());
if (childs.size() == 0) {
groups.remove(groupPosition);
}
selva.notifyDataSetChanged();
handler.sendEmptyMessage(0);
}
@Override
public void checkGroup(int groupPosition, boolean isChecked) {
StoreInfo group = groups.get(groupPosition);
List childs = children.get(group.getId());
for (int i = 0; i < childs.size(); i++) {
childs.get(i).setChoosed(isChecked);
}
if (isAllCheck())
allChekbox.setChecked(true);
else
allChekbox.setChecked(false);
selva.notifyDataSetChanged();
calculate();
}
@Override
public void checkChild(int groupPosition, int childPosiTion,
boolean isChecked) {
boolean allChildSameState = true;// 判断改组下面的所有子元素是否是同一种状态
StoreInfo group = groups.get(groupPosition);
List childs = children.get(group.getId());
for (int i = 0; i < childs.size(); i++) {
// 不全选中
if (childs.get(i).isChoosed() != isChecked) {
allChildSameState = false;
break;
}
}
//获取店铺选中商品的总金额
if (allChildSameState) {
group.setChoosed(isChecked);// 如果所有子元素状态相同,那么对应的组元素被设为这种统一状态
} else {
group.setChoosed(false);// 否则,组元素一律设置为未选中状态
}
if (isAllCheck()) {
allChekbox.setChecked(true);// 全选
} else {
allChekbox.setChecked(false);// 反选
}
selva.notifyDataSetChanged();
calculate();
}
private boolean isAllCheck() {
for (StoreInfo group : groups) {
if (!group.isChoosed())
return false;
}
return true;
}
/**
* 全选与反选
*/
private void doCheckAll() {
for (int i = 0; i < groups.size(); i++) {
groups.get(i).setChoosed(allChekbox.isChecked());
StoreInfo group = groups.get(i);
List childs = children.get(group.getId());
for (int j = 0; j < childs.size(); j++) {
childs.get(j).setChoosed(allChekbox.isChecked());
}
}
selva.notifyDataSetChanged();
calculate();
}
/**
* 统计操作
* 1.先清空全局计数器
* 2.遍历所有子元素,只要是被选中状态的,就进行相关的计算操作
* 3.给底部的textView进行数据填充
*/
private void calculate() {
totalCount = 0;
totalPrice = 0.00;
for (int i = 0; i < groups.size(); i++) {
StoreInfo group = groups.get(i);
List childs = children.get(group.getId());
for (int j = 0; j < childs.size(); j++) {
GoodsInfo product = childs.get(j);
if (product.isChoosed()) {
totalCount++;
totalPrice += product.getPrice() * product.getCount();
}
}
}
tvTotalPrice.setText("¥" + totalPrice);
tvGoToPay.setText("去支付(" + totalCount + ")");
}
@OnClick({R.id.all_chekbox, R.id.tv_delete, R.id.tv_go_to_pay, R.id.subtitle, R.id.tv_save, R.id.tv_share})
public void onClick(View view) {
AlertDialog alert;
switch (view.getId()) {
case R.id.all_chekbox:
doCheckAll();
break;
case R.id.tv_delete:
if (totalCount == 0) {
Toast.makeText(context, "请选择要移除的商品", Toast.LENGTH_LONG).show();
return;
}
alert = new AlertDialog.Builder(context).create();
alert.setTitle("操作提示");
alert.setMessage("您确定要将这些商品从购物车中移除吗?");
alert.setButton(DialogInterface.BUTTON_NEGATIVE, "取消",
new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
return;
}
});
alert.setButton(DialogInterface.BUTTON_POSITIVE, "确定",
new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
doDelete();
}
});
alert.show();
break;
case R.id.tv_go_to_pay:
if (totalCount == 0) {
Toast.makeText(context, "请选择要支付的商品", Toast.LENGTH_LONG).show();
return;
}
alert = new AlertDialog.Builder(context).create();
alert.setTitle("操作提示");
alert.setMessage("总计:\n" + totalCount + "种商品\n" + totalPrice + "元");
alert.setButton(DialogInterface.BUTTON_NEGATIVE, "取消",
new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
return;
}
});
alert.setButton(DialogInterface.BUTTON_POSITIVE, "确定",
new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
return;
}
});
alert.show();
break;
case R.id.subtitle:
if (flag == 0) {
llInfo.setVisibility(View.GONE);
tvGoToPay.setVisibility(View.GONE);
llShar.setVisibility(View.VISIBLE);
subtitle.setText("完成");
} else if (flag == 1) {
llInfo.setVisibility(View.VISIBLE);
tvGoToPay.setVisibility(View.VISIBLE);
llShar.setVisibility(View.GONE);
subtitle.setText("编辑");
}
flag = (flag + 1) % 2;//其余得到循环执行上面2个不同的功能
break;
case R.id.tv_share:
if (totalCount == 0) {
Toast.makeText(context, "请选择要分享的商品", Toast.LENGTH_LONG).show();
return;
}
Toast.makeText(getActivity(), "分享成功", Toast.LENGTH_SHORT).show();
break;
case R.id.tv_save:
if (totalCount == 0) {
Toast.makeText(context, "请选择要保存的商品", Toast.LENGTH_LONG).show();
return;
}
Toast.makeText(getActivity(), "保存成功", Toast.LENGTH_SHORT).show();
break;
}
}
@Override
public void groupEdit(int groupPosition) {
groups.get(groupPosition).setIsEdtor(true);
selva.notifyDataSetChanged();
}
Handler handler=new Handler(){
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
//删除购物车后动态改变数量
setCartNum();
}
};
@Override
public void onDestroyView() {
super.onDestroyView();
ButterKnife.unbind(this);
}
}
#3F51B5
#303F9F
#FF4081
#999999
#D7D7D7
#ffffff
#fffff0
#ffffe0
#3060a4e3
#ffff00
#fffafa
#fffaf0
#fffacd
#fff8dc
#fff5ee
#fff0f5
#ffefd5
#ffebcd
#ffe4e1
#ffe4c4
#ffe4b5
#ffdead
#ffdab9
#ffd700
#ffc0cb
#ffb6c1
#fd7903
#ffa07a
#ff8c00
#ff7f50
#ff69b4
#ff6347
#ff4500
#ff1493
#ff00ff
#ff00ff
#ff0000
#fdf5e6
#fafad2
#faf0e6
#faebd7
#fa8072
#f8f8ff
#f5fffa
#f5f5f5
#f5f5dc
#f5deb3
#f4a460
#f0ffff
#f0fff0
#f0f8ff
#f0e68c
#f08080
#eee8aa
#ee82ee
#e9967a
#e6e6fa
#e0ffff
#deb887
#dda0dd
#dcdcdc
#dc143c
#db7093
#daa520
#da70d6
#d8bfd8
#d3d3d3
#d3d3d3
#d2b48c
#d2691e
#cd853f
#cd5c5c
#c71585
#c0c0c0
#bdb76b
#bc8f8f
#ba55d3
#b8860b
#b22222
#b0e0e6
#b0c4de
#afeeee
#adff2f
#add8e6
#a9a9a9
#a9a9a9
#a52a2a
#a0522d
#9932cc
#98fb98
#9400d3
#9370db
#90ee90
#8fbc8f
#8b4513
#8b008b
#8b0000
#8a2be2
#87cefa
#87ceeb
#808080
#7c7b7b
#808000
#800080
#800000
#7fffd4
#7fff00
#7cfc00
#7b68ee
#778899
#778899
#708090
#708090
#6b8e23
#6a5acd
#696969
#696969
#66cdaa
#6495ed
#5f9ea0
#556b2f
#4b0082
#48d1cc
#483d8b
#4682b4
#4169e1
#40e0d0
#3cb371
#32cd32
#2f4f4f
#2f4f4f
#2e8b57
#228b22
#20b2aa
#1e90ff
#191970
#00ffff
#00ffff
#00ff7f
#00ff00
#00fa9a
#00ced1
#00bfff
#008b8b
#008080
#008000
#006400
#005dc1
#0000cd
#00008b
#000080
#3B3B3B
#0174E1
#cbcbcb
#eaeaea
#fcfcfc
#1e1d1d
#eaeaea
#464646
#3c3c3c
#3c3c3c
#da1609
#0f90e3
#66c058
#DAE532
#0074E1
#949494
#c4c4c4
#f2f2f2
#fff
#484848
#7d7d7d
#D21A3E
#B41131
#515151
#646464
#a1a1a1
#b5b5b5
#c4c4c4
#b18500
#f7f7f7
#00FF99
#f6f6f6
#929292
#464646
#464646
#ed3b3b
#b0b0b0
#232323
#333333
#777777
#b0000000
#60000000
#c0ffff00
#00000000
#ffffff
#fafafa
#eeeeee
#0067db
#CDCEC9
#C3C3C3
#2e000000
#f2f2f2
#333333
#666666
#999999
#de6838
16dp
16dp
16dp
8sp
14sp
16sp
18sp
16sp
18sp
20sp
22sp
24sp
26sp
28sp