Android 仿淘寶商品屬性標(biāo)簽頁(yè)
更新時(shí)間：2016年11月27日 10:27:48 作者：孤獨(dú)戰(zhàn)狼
這篇文章主要介紹了Android 仿淘寶商品屬性標(biāo)簽頁(yè)的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
![這里寫(xiě)圖片描述](http://img.jbzj.com/file_images/article/201611/201611271029142.png "\")
需求
1.動(dòng)態(tài)加載屬性，如尺碼，顏色，款式等
由于每件商品的屬性是不確定的，有的商品的屬性是顏色和尺碼，有的是口味，有的是大小，所以這些屬性不能直接寫(xiě)死到頁(yè)面上。
2.動(dòng)態(tài)加載屬性下的標(biāo)簽
每個(gè)屬性下的標(biāo)簽個(gè)數(shù)也不是一定的，比如有的商品的尺碼是是S,M,XL，有的是均碼，也就是每種屬性的具體的內(nèi)容是不一定的。
技術(shù)點(diǎn)
自定義ViewGroup，使其中的TextView可以依據(jù)內(nèi)容長(zhǎng)短自動(dòng)換行，如下圖所示
![這里寫(xiě)圖片描述](http://img.jbzj.com/file_images/article/201611/201611271029163.png "\")
實(shí)現(xiàn)
布局
通過(guò)ListView來(lái)顯示商品所有屬性，每種屬性作為L(zhǎng)istView的Item。
<span style="font-family: Arial, Verdana, sans-serif;">自定義ViewGroup</span>
普通的LinearLayout只能橫向和縱向顯示控件，但是當(dāng)一行顯示不夠時(shí)，無(wú)法自動(dòng)換行，需要我們自定義布局容器。
<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;//第一個(gè)的時(shí)候不需要加" }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
<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();
// 獲取控件對(duì)象
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);
// 設(shè)置控件集到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);//規(guī)格名稱
//動(dòng)態(tài)加載標(biāo)簽
//判斷布局中的子控件是否為0，如果不為0，就不添加了，防止ListView滾動(dòng)時(shí)重復(fù)添加
if(holder.vgPropContents.getChildCount()==0){
TextView[] textViews = new TextView[lables.size()];
//設(shè)置每個(gè)標(biāo)簽的文本和布局
//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);
//綁定標(biāo)簽的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>
總結(jié)
這里關(guān)鍵就是實(shí)現(xiàn)自定義的ViewGroup，重寫(xiě)onMeasure和onLayout方法，判斷新添加的控件有沒(méi)有超出屏幕的寬度來(lái)決定是否要換行。
以上所述是小編給大家介紹的Android 仿淘寶商品屬性標(biāo)簽頁(yè)，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)歡迎給我留言，小編會(huì)及時(shí)回復(fù)大家的，在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
如何判斷軟件程序是否聯(lián)網(wǎng) 聯(lián)網(wǎng)狀態(tài)提示信息Android實(shí)現(xiàn)
這篇文章主要為大家詳細(xì)介紹了如何判斷軟件程序是否聯(lián)網(wǎng)的實(shí)現(xiàn)代碼，Android實(shí)現(xiàn)聯(lián)網(wǎng)狀態(tài)信息提示，感興趣的小伙伴們可以參考一下2016-05-05
本篇文章小編為大家介紹，Android CheckBox 的使用案例分析。需要的朋友參考下2013-04-04
這篇文章給大家整理了關(guān)于Android進(jìn)階資深開(kāi)發(fā)必備技能-切面編程的相關(guān)知識(shí)點(diǎn)內(nèi)容，有興趣的朋友可以參考學(xué)習(xí)下。2018-07-07
Android 文件操作詳解及簡(jiǎn)單實(shí)例
這篇文章主要介紹了 Android 文件操作詳解及簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-02-02
Android自動(dòng)文本框輸入識(shí)別提示功能代碼
這篇文章主要介紹了Android開(kāi)發(fā)之自動(dòng)文本框輸入識(shí)別提示功能代碼的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-07-07
Android拖拽助手ViewDragHelper的創(chuàng)建與使用實(shí)例
ViewDragHelper是針對(duì) ViewGroup 中的拖拽和重新定位 views 操作時(shí)提供了一系列非常有用的方法和狀態(tài)追蹤,下面這篇文章主要給大家介紹了關(guān)于Android拖拽助手ViewDragHelper的創(chuàng)建與使用的相關(guān)資料,需要的朋友可以參考下2022-05-05
Android 實(shí)現(xiàn)云知聲版離線語(yǔ)音合成
這篇文章主要介紹了Android 實(shí)現(xiàn)云知聲版離線語(yǔ)音合成，目前云知聲提供免費(fèi)的離線TTS，功能也比較簡(jiǎn)單，合成的語(yǔ)音也比較生硬，如果對(duì)合成的語(yǔ)音要求不高的話可以考慮接入。具體合成需要的小伙伴可以參考下面文章內(nèi)容2022-06-06
Android?Jetpack庫(kù)剖析之ViewModel組件篇
這篇文章主要介紹了Android?Jetpack架構(gòu)組件?ViewModel詳解，ViewModel類(lèi)讓數(shù)據(jù)可在發(fā)生屏幕旋轉(zhuǎn)等配置更改后繼續(xù)存在，ViewModel類(lèi)旨在以注重生命周期的方式存儲(chǔ)和管理界面相關(guān)的數(shù)據(jù)。感興趣可以來(lái)學(xué)習(xí)一下2022-07-07
今天在公司遇到一個(gè)需求；TextView設(shè)置最多顯示8個(gè)字符，超過(guò)部分顯示...(省略號(hào))，那么android如何獲取textview最多顯示，感興趣的可以了解一下2021-06-06
Android開(kāi)發(fā)實(shí)現(xiàn)的Intent跳轉(zhuǎn)工具類(lèi)實(shí)例
這篇文章主要介紹了Android開(kāi)發(fā)實(shí)現(xiàn)的Intent跳轉(zhuǎn)工具類(lèi),簡(jiǎn)單描述了Intent組件的功能并結(jié)合實(shí)例形式給出了頁(yè)面跳轉(zhuǎn)、拍照、圖片調(diào)用等相關(guān)操作技巧,需要的朋友可以參考下2017-11-11