Android仿美團(tuán)下拉菜單(商品選購(gòu))實(shí)例代碼
更新時(shí)間：2016年03月11日 11:30:27 作者：u014486880
這篇文章主要介紹了Android仿美團(tuán)下拉菜單(商品選購(gòu))實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下
美團(tuán)電商應(yīng)用平臺(tái)大家使用非常頻繁，下面小編通過(guò)本文給大家介紹電商應(yīng)用平臺(tái)中常用的選擇類別下拉列表的實(shí)現(xiàn)。先給大家展示下效果圖：
一、下拉列表的實(shí)現(xiàn)
其實(shí)實(shí)現(xiàn)方法有很多，這時(shí)實(shí)現(xiàn)的也沒(méi)有什么技術(shù)含量，只是總結(jié)下自己在項(xiàng)目中的做法，也提供一個(gè)思路。
首先是列表的數(shù)據(jù)，一般數(shù)據(jù)都是從后臺(tái)讀過(guò)來(lái)，這里因?yàn)闆](méi)有后臺(tái)，所以寫死在客戶端：
private void initMenuData() {
menuData = new ArrayList<map<string, string="">>();
String[] menuStr = new String[] { "全部", "糧油", "衣服", "圖書", "電子產(chǎn)品",
"酒水飲料", "水果" };
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[] { "綜合排序", "配送費(fèi)最低" };
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[] { "優(yōu)惠活動(dòng)", "特價(jià)活動(dòng)", "免配送費(fèi)",
"可在線支付" };
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,>
就是做了簡(jiǎn)單的封裝。彈出列表的實(shí)現(xiàn)考慮使用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"));
}
});
接著將數(shù)據(jù)封裝到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 });
設(shè)置點(diǎn)擊標(biāo)題頭彈出列表，并改變標(biāo)題頭的顏色
public void onClick(View v) {
// TODO Auto-generated method stub
switch (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這個(gè)選擇標(biāo)題的正下方。從而實(shí)現(xiàn)上面那種方式。
最后完整的貼出代碼，還是蠻簡(jiǎn)單的。最后也會(huì)提供代碼下載鏈接。
public class MainActivity extends Activity implements
OnClickListener {
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;
@Override
protected 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[] { "全部", "糧油", "衣服", "圖書", "電子產(chǎn)品",
"酒水飲料", "水果" };
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[] { "綜合排序", "配送費(fèi)最低" };
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[] { "優(yōu)惠活動(dòng)", "特價(jià)活動(dòng)", "免配送費(fèi)",
"可在線支付" };
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);
}
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (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來(lái)實(shí)現(xiàn)，但樣式單一，之前我做這種效果第一時(shí)間總是考慮到幀動(dòng)畫，但用這種方式需要有很多圖片來(lái)鏈接起來(lái)，這樣一來(lái)實(shí)現(xiàn)麻煩，二來(lái)圖片多了占內(nèi)存。下面用改變?cè)鶳rogressBar的動(dòng)畫來(lái)實(shí)現(xiàn)這種效果，非常簡(jiǎn)單：
<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是旋轉(zhuǎn)的速度。這里的思路是用xml來(lái)畫一張圖，它是環(huán)形的，且環(huán)形圈中有漸變顏色。如下：
<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設(shè)置旋轉(zhuǎn)動(dòng)畫，360度旋轉(zhuǎn)。shape="ring"設(shè)置背景為圓。android:innerRadiusRatio="3"設(shè)置內(nèi)環(huán)半徑，android:thicknessRatio="10"設(shè)置外環(huán)半徑。最后為了讓環(huán)中顏色有漸變效果，使用gradient來(lái)設(shè)置。gradient可以有三種漸變方式，線性，輻射，掃描。這里type要設(shè)置成掃描。然后設(shè)置中心點(diǎn)，開(kāi)始顏色和結(jié)束顏色，就能實(shí)現(xiàn)上面的那種效果了。
以上內(nèi)容是小編給大家介紹的Android仿美團(tuán)下拉菜單(商品選購(gòu))實(shí)例代碼，希望對(duì)大家有所幫助！
相關(guān)文章
activity類是Android 應(yīng)用生命周期的重要部分。在系統(tǒng)中的Activity被一個(gè)Activity棧所管理。當(dāng)一個(gè)新的Activity啟動(dòng)時(shí)，將被放置到棧頂，成為運(yùn)行中的Activity，前一個(gè)Activity保留在棧中，不再放到前臺(tái)，直到新的Activity退出為止。2016-05-05
Android編程之TabWidget選項(xiàng)卡用法實(shí)例分析
這篇文章主要介紹了Android編程之TabWidget選項(xiàng)卡用法,結(jié)合實(shí)例形式較為詳細(xì)的分析了TabWidget選項(xiàng)卡的具體實(shí)現(xiàn)技巧與使用注意事項(xiàng),需要的朋友可以參考下2015-12-12
Android ViewPager實(shí)現(xiàn)每隔兩秒自動(dòng)切換圖片功能
圖片來(lái)回自動(dòng)切換，設(shè)計(jì)非常人性化，那么圖片自動(dòng)切換功能基于代碼如何實(shí)現(xiàn)的呢？下面小編給大家?guī)?lái)了Android ViewPager實(shí)現(xiàn)每隔兩秒自動(dòng)切換圖片功能，感興趣的朋友一起看看吧2021-10-10
Android studio實(shí)現(xiàn)簡(jiǎn)單計(jì)算器
這篇文章主要為大家詳細(xì)介紹了Android studio實(shí)現(xiàn)簡(jiǎn)單計(jì)算器，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-03-03
Android 事件觸發(fā)機(jī)制的深入學(xué)習(xí)
這篇文章主要介紹了 Android 事件觸發(fā)機(jī)制的深入學(xué)習(xí)的相關(guān)資料,需要的朋友可以參考下2017-06-06
Android?Flutter實(shí)現(xiàn)在多端運(yùn)行的掃雷游戲
當(dāng)我們回憶起小時(shí)候的經(jīng)典電腦游戲，掃雷一定是其中之一。本文將通過(guò)Flutter實(shí)現(xiàn)一個(gè)能在多端運(yùn)行的掃雷游戲，感興趣的可以了解一下2023-03-03
這篇文章主要介紹了Android注解ButterKnife的基本使用的相關(guān)資料,需要的朋友可以參考下2017-01-01
Android開(kāi)發(fā)自學(xué)筆記（六）：聲明權(quán)限和Activity
這篇文章主要介紹了Android開(kāi)發(fā)自學(xué)筆記（六）：聲明權(quán)限和Activity,本文是上一篇的補(bǔ)充,需要的朋友可以參考下2015-04-04
Android圖片三級(jí)緩存的原理及其實(shí)現(xiàn)
本篇文章主要介紹了Android圖片三級(jí)緩存的原理及其實(shí)現(xiàn)，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
Android SlidingDrawer 抽屜效果的實(shí)現(xiàn)
本篇文章小編為大家介紹，Android SlidingDrawer 抽屜效果的實(shí)現(xiàn)。需要的朋友參考下2013-04-04