-
一睹为快
需求
1.动态加载属性,如尺码,颜色,款式等
由于每件商品的属性是不确定的,有的商品的属性是颜色和尺码,有的是口味,有的是大小,所以这些属性不能直接写死到页面上。
2.动态加载属性下的标签
每个属性下的标签个数也不是一定的,比如有的商品的尺码是是S,M,XL,有的是均码,也就是每种属性的具体的内容是不一定的。
技术点
自定义ViewGroup,使其中的TextView可以依据内容长短自动换行,如下图所示
实现
布局
通过ListView来显示商品所有属性,每种属性作为ListView的Item。
1<span style=
"font-family: Arial, Verdana, sans-serif;"
>自定义ViewGroup</span>
普通的LinearLayout只能横向和纵向显示控件,但是当一行显示不够时,无法自动换行,需要我们自定义布局容器。
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768<code
class
=
"hljs java"
>
package
jczb.shoping.common;
import
android.content.Context;
import
android.util.AttributeSet;
import
android.util.Log;
import
android.view.View;
import
android.view.ViewGroup;
public
class
MyViewGroup
extends
ViewGroup {
private
final
static
int
VIEW_MARGIN=
15
;
public
MyViewGroup(Context context, AttributeSet attrs){
super
(context, attrs);
}
public
MyViewGroup(Context context) {
super
(context);
}
@Override
protected
void
onMeasure(
int
widthMeasureSpec,
int
heightMeasureSpec) {
int
stages =
1
;
int
stageHeight =
0
;
int
stageWidth =
0
;
int
wholeWidth = MeasureSpec.getSize(widthMeasureSpec);
for
(
int
i =
0
; i < getChildCount(); i++) {
final
View child = getChildAt(i);
// measure
measureChild(child, widthMeasureSpec, heightMeasureSpec);
stageWidth += (child.getMeasuredWidth() + VIEW_MARGIN);
stageHeight = child.getMeasuredHeight();
if
(stageWidth >= wholeWidth) {
stages++;
//reset stageWidth
stageWidth = child.getMeasuredWidth();
}
}
int
wholeHeight = (stageHeight + VIEW_MARGIN) * stages;
// report this final dimension
setMeasuredDimension(resolveSize(wholeWidth, widthMeasureSpec),
resolveSize(wholeHeight, heightMeasureSpec));
}
private
int
jiange =
10
;
//按钮之间的间隔
@Override
protected
void
onLayout(
boolean
arg0,
int
arg1,
int
arg2,
int
arg3,
int
arg4) {
final
int
count = getChildCount();
int
row=
0
;
// which row lay you view relative to parent
int
lengthX=arg1 ;
// right position of child relative to parent
int
lengthY=arg2;
// bottom position of child relative to parent
for
(
int
i=
0
;i<count;i++){
final
=
""
view=
""
child=
"this.getChildAt(i);"
int
=
""
width=
"child.getMeasuredWidth();"
height=
"child.getMeasuredHeight();"
if
(i=
"="
0
){=
""
lengthx+=
"width+VIEW_MARGIN;//第一个的时候不需要加"
}
else
{=
""
+jiange;=
""
按钮之间的间隔=
""
}=
""
lengthy=
"row*(height+VIEW_MARGIN)+VIEW_MARGIN+height+arg2;"
if
=
""
it=
""
can't=
""
drawing=
""
on=
""
a=
""
same=
""
line=
""
,=
""
skip=
""
to=
""
next=
""
if
(lengthx=
""
>arg3){
lengthX=width+VIEW_MARGIN+arg1;
row++;
lengthY=row*(height+VIEW_MARGIN)+VIEW_MARGIN+height+arg2;
}
child.layout(lengthX-width, lengthY-height, lengthX, lengthY);
}
}
}
</code>
ListView的Adapter
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126<code
class
=
"hljs java"
>
package
jczb.shoping.adapter;
import
java.util.ArrayList;
import
java.util.HashMap;
import
jczb.shoping.common.MyViewGroup;
import
jczb.shoping.ui.R;
import
android.content.Context;
import
android.graphics.Color;
import
android.graphics.drawable.Drawable;
import
android.os.Handler;
import
android.view.LayoutInflater;
import
android.view.View;
import
android.view.View.OnClickListener;
import
android.view.ViewGroup;
import
android.widget.BaseAdapter;
import
android.widget.Button;
import
android.widget.LinearLayout;
import
android.widget.LinearLayout.LayoutParams;
import
android.widget.TableLayout;
import
android.widget.TextView;
public
class
PropertyAdapter
extends
BaseAdapter {
private
Context mContext;
private
ArrayList<hashmap<string,object>> mList;
private
ArrayList<hashmap<string,textview[]>> mViewList;
private
Drawable drawableNormal ;
private
Drawable drawablePressed;
private
Handler mHandler;
//用于保存用户的属性集合
private
HashMap<string,string> selectProMap=
new
HashMap<string, string=
""
>();
/**
* 返回选中的属性
* @return
*/
public
HashMap<string, string=
""
> getSelectProMap() {
return
selectProMap;
}
public
void
setSelectProMap(HashMap<string, string=
""
> selectProMap) {
this
.selectProMap = selectProMap;
}
public
PropertyAdapter(Handler handler,Context context,ArrayList<hashmap<string,object>> list){
super
();
this
.mHandler=handler;
this
.mContext=context;
this
.mList=list;
mViewList=
new
ArrayList<hashmap<string,textview[]>>();
drawableNormal=mContext.getResources().getDrawable(R.drawable.tv_property_label);
}
@Override
public
int
getCount() {
// TODO Auto-generated method stub
return
mList.size();
}
@Override
public
Object getItem(
int
position) {
// TODO Auto-generated method stub
return
mList.get(position);
}
@Override
public
long
getItemId(
int
position) {
// TODO Auto-generated method stub
return
position;
}
@Override
public
View getView(
int
position, View convertView, ViewGroup parent) {
ViewHolder holder =
null
;
if
(convertView ==
null
) {
// 获取list_item布局文件的视图
convertView = LayoutInflater.from(
this
.mContext).inflate(R.layout.lv_property_item,
null
,
true
);
holder =
new
ViewHolder();
// 获取控件对象
holder.tvPropName= (TextView) convertView
.findViewById(R.id.tv_property_name);
//holder.llPropContents=(LinearLayout)convertView.findViewById(R.id.ll_property_content);
//holder.tlPropContents=(TableLayout)convertView.findViewById(R.id.ll_property_content);
// 设置控件集到convertView
holder.vgPropContents= (MyViewGroup) convertView.findViewById(R.id.myviewgroup);
convertView.setTag(holder);
}
else
{
holder = (ViewHolder) convertView.getTag();
}
if
(
this
.mList !=
null
) {
//HashMap<string,textview[]> mapView=new HashMap<string,>();
ArrayList<string> lables = (ArrayList<string>)
this
.mList.get(position).get(
"lable"
);
String type = (String)
this
.mList.get(position).get(
"type"
);
holder.tvPropName.setText(type);
//规格名称
//动态加载标签
//判断布局中的子控件是否为0,如果不为0,就不添加了,防止ListView滚动时重复添加
if
(holder.vgPropContents.getChildCount()==
0
){
TextView[] textViews =
new
TextView[lables.size()];
//设置每个标签的文本和布局
//TableRow tr=new TableRow(mContext);
for
(
int
i =
0
; i < lables.size(); i++) {
TextView textView =
new
TextView(mContext); textView.setGravity(
17
);
textView.setPadding(
25
,
15
,
25
,
15
);
textViews[i] = textView;
textViews[i].setBackgroundResource(R.drawable.tv_property_label);
textViews[i].setText(lables.get(i));
textViews[i].setTag(i);
//textViews[i].setBackgroundColor(Color.parseColor("#EE5500"));
//tr.addView(textViews[i]);
// holder.llPropContents.addView(textViews[i]);
holder.vgPropContents.addView(textViews[i]);
}
//holder.tlPropContents.addView(tr);
//绑定标签的Click事件
for
(
int
j=
0
;j<textviews.length;j++){ string=
""
void
=
""
viewholder=
""
view=
""
v=
"(TextView)"
tv=
"(TextView)v;"
this
.type=
"type;"
textviews=
"(TextView[])v.getTag();"
textview=
""
tablelayout=
""
return
=
""
public
=
""
private
=
""
override=
""
new
=
""
myviewgroup=
""
linearlayout=
""
lableclicklistener=
""
int
=
""
implements
=
""
i=
"0;i<textViews.length;i++){"
h=
"0;h<holder.vgPropContents.getChildCount();h++){"
code=
""
></textviews.length;j++){></string></string></string,></string,textview[]></hashmap<string,textview[]></hashmap<string,object></string,></string,></string,></string,string></hashmap<string,textview[]></hashmap<string,object></code>
总结
这里关键就是实现自定义的ViewGroup,重写onMeasure和onLayout方法,判断新添加的控件有没有超出屏幕的宽度来决定是否要换行。
Android开发—电商系列】(二):仿淘宝商品属性标签页
最新推荐文章于 2021-05-26 04:49:54 发布