Android仿美團下拉式功能表(商品選購)執行個體代碼_Android

美團電商應用平台大家使用非常頻繁，下面小編通過本文給大家介紹電商應用平台中常用的選擇類別下拉式清單的實現。先給大家展示下效果圖：

一、下拉式清單的實現

其實實現方法有很多，這時實現的也沒有什麼技術含量，只是總結下自己在項目中的做法，也提供一個思路。

首先是列表的資料，一般資料都是從後台讀過來，這裡因為沒有後台，所以寫死在用戶端：

private void initMenuData() {menuData = new ArrayList<map<string, string="">>();String[] menuStr = new String[] { "全部", "糧油", "衣服", "圖書", "電子產品","酒水飲料", "水果" };Map<string, string=""> map;for (int i = , len = menuStr.length; i < len; ++i) {map = new HashMap<string, string="">();map.put("name", menuStr[i]);menuData.add(map);}menuData = new ArrayList<map<string, string="">>();String[] menuStr = new String[] { "綜合排序", "配送費最低" };Map<string, string=""> map;for (int i = , len = menuStr.length; i < len; ++i) {map = new HashMap<string, string="">();map.put("name", menuStr[i]);menuData.add(map);}menuData = new ArrayList<map<string, string="">>();String[] menuStr = new String[] { "優惠活動", "特價活動", "免配送費","可線上支付" };Map<string, string=""> map3;for (int i = 0, len = menuStr3.length; i < len; ++i) {map3 = new HashMap<string, string="">();map3.put("name", menuStr3[i]);menuData3.add(map3);}}</string,></string,></map<string,></string,></string,></map<string,></string,></string,></map<string,>

就是做了簡單的封裝。彈出列表的實現考慮使用Popwindow。

popMenu = new PopupWindow(contentView,LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.MATCH_PARENT);popMenu.setOutsideTouchable(true);popMenu.setBackgroundDrawable(new BitmapDrawable());popMenu.setFocusable(true);popMenu.setAnimationStyle(R.style.popwin_anim_style);popMenu.setOnDismissListener(new OnDismissListener() {public void onDismiss() {productTv.setTextColor(Color.parseColor("#5a5959"));sortTv.setTextColor(Color.parseColor("#5a5959"));activityTv.setTextColor(Color.parseColor("#5a5959"));}});

接著將資料封裝到adapter中：

menuAdapter1 = new SimpleAdapter(this, menuData1,R.layout.item_listview_popwin, new String[] { "name" },new int[] { R.id.listview_popwind_tv });menuAdapter2 = new SimpleAdapter(this, menuData2,R.layout.item_listview_popwin, new String[] { "name" },new int[] { R.id.listview_popwind_tv });menuAdapter3 = new SimpleAdapter(this, menuData3,R.layout.item_listview_popwin, new String[] { "name" },new int[] { R.id.listview_popwind_tv });

設定點擊標題頭彈出列表，並改變標題頭的顏色

public void onClick(View v) {// TODO Auto-generated method stubswitch (v.getId()) {case R.id.supplier_list_product:productTv.setTextColor(Color.parseColor("#ac"));popListView.setAdapter(menuAdapter);popMenu.showAsDropDown(product, , );menuIndex = ;break;case R.id.supplier_list_sort:sortTv.setTextColor(Color.parseColor("#ac"));popListView.setAdapter(menuAdapter);popMenu.showAsDropDown(product, , );menuIndex = ;break;case R.id.supplier_list_activity:activityTv.setTextColor(Color.parseColor("#ac"));popListView.setAdapter(menuAdapter);popMenu.showAsDropDown(product, , );menuIndex = ;break;}}

showAsDropDown是為了讓popwindow定位在Product這個選擇標題的正下方。從而實現上面那種方式。

最後完整的貼出代碼，還是蠻簡單的。最後也會提供代碼下載連結。

public class MainActivity extends Activity implementsOnClickListener {private ListView listView, popListView;private ProgressBar progressBar;private List<map<string, string="">> menuData1, menuData2, menuData3;private PopupWindow popMenu;private SimpleAdapter menuAdapter1, menuAdapter2, menuAdapter3;private LinearLayout product, sort, activity;private ImageView cartIv;private TextView productTv, sortTv, activityTv, titleTv;private int green, grey;private String currentProduct, currentSort, currentActivity;private int menuIndex = 0;private Intent intent;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_supplier_list);findView();initMenuData();initPopMenu();}private void initMenuData() {menuData1 = new ArrayList<map<string, string="">>();String[] menuStr1 = new String[] { "全部", "糧油", "衣服", "圖書", "電子產品","酒水飲料", "水果" };Map<string, string=""> map1;for (int i = 0, len = menuStr1.length; i < len; ++i) {map1 = new HashMap<string, string="">();map1.put("name", menuStr1[i]);menuData1.add(map1);}menuData2 = new ArrayList<map<string, string="">>();String[] menuStr2 = new String[] { "綜合排序", "配送費最低" };Map<string, string=""> map2;for (int i = 0, len = menuStr2.length; i < len; ++i) {map2 = new HashMap<string, string="">();map2.put("name", menuStr2[i]);menuData2.add(map2);}menuData3 = new ArrayList<map<string, string="">>();String[] menuStr3 = new String[] { "優惠活動", "特價活動", "免配送費","可線上支付" };Map<string, string=""> map3;for (int i = 0, len = menuStr3.length; i < len; ++i) {map3 = new HashMap<string, string="">();map3.put("name", menuStr3[i]);menuData3.add(map3);}}@Overridepublic void onClick(View v) {// TODO Auto-generated method stubswitch (v.getId()) {case R.id.supplier_list_product:productTv.setTextColor(Color.parseColor("#39ac69"));popListView.setAdapter(menuAdapter1);popMenu.showAsDropDown(product, 0, 2);menuIndex = 0;break;case R.id.supplier_list_sort:sortTv.setTextColor(Color.parseColor("#39ac69"));popListView.setAdapter(menuAdapter2);popMenu.showAsDropDown(product, 0, 2);menuIndex = 1;break;case R.id.supplier_list_activity:activityTv.setTextColor(Color.parseColor("#39ac69"));popListView.setAdapter(menuAdapter3);popMenu.showAsDropDown(product, 0, 2);menuIndex = 2;break;}}protected void findView() {listView = (ListView) findViewById(R.id.supplier_list_lv);product = (LinearLayout) findViewById(R.id.supplier_list_product);sort = (LinearLayout) findViewById(R.id.supplier_list_sort);activity = (LinearLayout) findViewById(R.id.supplier_list_activity);productTv = (TextView) findViewById(R.id.supplier_list_product_tv);sortTv = (TextView) findViewById(R.id.supplier_list_sort_tv);activityTv = (TextView) findViewById(R.id.supplier_list_activity_tv);titleTv = (TextView) findViewById(R.id.supplier_list_title_tv);cartIv = (ImageView) findViewById(R.id.supplier_list_cart_iv);progressBar = (ProgressBar) findViewById(R.id.progress);product.setOnClickListener(this);sort.setOnClickListener(this);activity.setOnClickListener(this);cartIv.setOnClickListener(this);}private void initPopMenu() {initMenuData();View contentView = View.inflate(this, R.layout.popwin_supplier_list,null);popMenu = new PopupWindow(contentView,LinearLayout.LayoutParams.MATCH_PARENT,LinearLayout.LayoutParams.MATCH_PARENT);popMenu.setOutsideTouchable(true);popMenu.setBackgroundDrawable(new BitmapDrawable());popMenu.setFocusable(true);popMenu.setAnimationStyle(R.style.popwin_anim_style);popMenu.setOnDismissListener(new OnDismissListener() {public void onDismiss() {productTv.setTextColor(Color.parseColor("#5a5959"));sortTv.setTextColor(Color.parseColor("#5a5959"));activityTv.setTextColor(Color.parseColor("#5a5959"));}});popListView = (ListView) contentView.findViewById(R.id.popwin_supplier_list_lv);contentView.findViewById(R.id.popwin_supplier_list_bottom).setOnClickListener(new OnClickListener() {public void onClick(View arg0) {popMenu.dismiss();}});menuAdapter1 = new SimpleAdapter(this, menuData1,R.layout.item_listview_popwin, new String[] { "name" },new int[] { R.id.listview_popwind_tv });menuAdapter2 = new SimpleAdapter(this, menuData2,R.layout.item_listview_popwin, new String[] { "name" },new int[] { R.id.listview_popwind_tv });menuAdapter3 = new SimpleAdapter(this, menuData3,R.layout.item_listview_popwin, new String[] { "name" },new int[] { R.id.listview_popwind_tv });popListView.setOnItemClickListener(new OnItemClickListener() {public void onItemClick(AdapterView arg0, View arg1, int pos,long arg3) {popMenu.dismiss();if (menuIndex == 0) {currentProduct = menuData1.get(pos).get("name");titleTv.setText(currentProduct);productTv.setText(currentProduct);Toast.makeText(MainActivity.this, currentProduct, Toast.LENGTH_SHORT).show();} else if (menuIndex == 1) {currentSort = menuData2.get(pos).get("name");titleTv.setText(currentSort);sortTv.setText(currentSort);Toast.makeText(MainActivity.this, currentSort, Toast.LENGTH_SHORT).show();} else {currentActivity = menuData3.get(pos).get("name");titleTv.setText(currentActivity);activityTv.setText(currentActivity);Toast.makeText(MainActivity.this, currentActivity, Toast.LENGTH_SHORT).show();}}});}}</string,></string,></map<string,></string,></string,></map<string,></string,></string,></map<string,></map<string,>

二、載入圓形ProgressBar的顯示

就是效果圖中的那種載入ProgressBar，圓形ProgresBar可以用原生的Bar來實現，但樣式單一，之前我做這種效果第一時間總是考慮到幀動畫，但用這種方式需要有很多圖片來連結起來，這樣一來實現麻煩，二來圖片多了占記憶體。下面用改變原生ProgressBar的動畫來實現這種效果，非常簡單：

<progressbar android:id="@+id/progress" android:indeterminatedrawable="@drawable/shape_progress" android:indeterminateduration="1000" android:layout_centerinparent="true" android:layout_height="wrap_content" android:layout_width="wrap_content"></progressbar>

indeterminateDrawable是載入背景圖片，indeterminateDuration是旋轉的速度。這裡的思路是用xml來畫一張圖，它是環形的，且環形圈中有漸層顏色。如下：

<rotate android:fromdegrees="" android:pivotx="%" android:pivoty="%" android:todegrees="" xmlns:android="http://schemas.android.com/apk/res/android"><shape android:innerradiusratio="" android:shape="ring" android:thicknessratio="" android:uselevel="false"><gradient android:centercolor="#cdaa" android:centery="." android:endcolor="#ffffff" android:startcolor="#ac" android:type="sweep" android:uselevel="false"></gradient></shape></rotate>

rotate設定旋轉動畫，360度旋轉。shape="ring"設定背景為圓。android:innerRadiusRatio="3"設定內環半徑，android:thicknessRatio="10"設定外環半徑。最後為了讓環中顏色有漸層效果，使用gradient來設定。gradient可以有三種漸層方式，線性，輻射，掃描。這裡type要設定成掃描。然後設定中心點，開始顏色和結束顏色，就能實現上面的那種效果了。

以上內容是小編給大家介紹的Android仿美團下拉式功能表(商品選購)執行個體代碼，希望對大家有所協助！