登录 立即注册
安币:

安卓巴士 - 安卓开发 - Android开发 - 安卓 - 移动互联网门户

楼主: 天天bug
打印 上一主题 下一主题

Android仿美团下拉菜单(商品选购)实例代码,android高仿美团

[复制链接]

329

主题

921

帖子

726

安币

手工艺人

跳转到指定楼层
楼主
发表于 2018-1-18 16:12:27 | 只看该作者 |只看大图 回帖奖励 |倒序浏览 |阅读模式

            

        美团电商应用?#25945;?#22823;家使用非常频繁,下面小编通过本文给大家介绍电商应用?#25945;?#20013;常用的选择类别下拉列表的实现。先给大?#33402;?#31034;下效果图:

        

        一、下拉列表的实现

        其实实?#22336;?#27861;有很多,这时实?#20540;?#20063;没有什么技术含量,只是总结下自己在项目中的做法,也提供一个思路。

        首先是列表的数据,一般数据都是从后台读过来,这里因为没有后台,所以写死在客户端:

[Java] 查看源文件 复制代码
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,>

        就是做?#24605;?#21333;的封装。弹出列表的实现考虑使用popwindow。

[Java] 查看源文件 复制代码
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中:

[Java] 查看源文件 复制代码
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 });

        设置点击标题?#36820;?#20986;列表,并改变标题?#36820;?#39068;色

[Java] 查看源文件 复制代码
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这个选择标题的正下方。从而实现上面那?#22336;?#24335;。

        最后完整的贴出代码,还是蛮简单的。最后也会提供代码下载链?#21360;?/font>

[Java] 查看源文件 复制代码
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[] { "全部", "粮油", "衣服", "图书", "电子产品",
"酒水饮料", "水果" };
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);
}
}
@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来实现,但样式单一,之前我做这?#20013;?#26524;第一时间总是考虑到帧动画,但用这?#22336;?#24335;需要有很多图片来链接起来,这样一来实现麻?#24120;?#20108;来图片多了占内存。下面用改变原生progressbar的动画来实现这?#20013;?#26524;,非常简单:

[Java] 查看源文件 复制代码
<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是加载背?#24052;?#29255;,indeterminateduration是旋转的速度。这里的思路是用xml来画一张图,它是环形?#27169;一?#24418;圈中有渐变颜色。如下:

[Java] 查看源文件 复制代码
<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"设置外环半径。最后为了?#27809;?#20013;颜色有渐变效果,使用gradient来设置。gradient可以有三种渐变方式,线性,辐射,扫描。这里type要设置成扫描。然后设置中心点,开始颜色和结束颜色,就能实现上面的那?#20013;?#26524;了。



        
分享到:  QQ好友和群 QQ空间 微信
收藏收藏 支持支持1 反对反对

0

主题

9471

帖子

2472

安币

Android大神

Rank: 6Rank: 6

沙发
发表于 2018-1-19 21:36:19 | 只看该作者
支持楼主,支持安卓巴士!

8

主题

9273

帖子

3549

安币

码皇(巴士元老)

Rank: 8Rank: 8

板凳
发表于 2018-1-21 04:47:07 | 只看该作者
楼主威武,以后多发干货,多办活动~!

9

主题

9392

帖子

1814

安币

Android大神

Rank: 6Rank: 6

QQ达人

地板
发表于 2018-1-22 01:27:16 | 只看该作者
不错不错,楼主?#37327;?#20102;。。。

0

主题

72

帖子

64

安币

程序猿

Rank: 2

5#
发表于 2018-1-22 12:04:59 | 只看该作者
?#34892;环?#20139;,安卓巴士有你更精彩:)
我学习我快乐

3

主题

29

帖子

713

安币

代码手工艺人

爵士

Rank: 4

QQ达人

QQ
6#
发表于 2019-6-5 09:55:29 | 只看该作者

?#34892;环?#20139;,安卓巴士有你更精彩
人生只有不断努力才能获得自?#21512;?#35201;的一切!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

站长推荐

通过邮件订阅最新安卓weekly信息
上一条 /4 下一条

下载安卓巴士客户端

全国最大的安卓开发者社区

联系我们
关闭
合作电话:
15618560077
Email:
[email protected]
商务市场合作/投稿
问题反馈及帮助
联系我们

广告投放| 广东互联网违法和不良信息举报中心|中国互联网举报中心|下载客户端|申请友链|手机版|站点统计|安卓巴士 ( 粤ICP备15117877号 )

快速回复 返回顶部 返回列表
拳皇命运一共48集
天恒最新时时彩 森林舞会教案 嫦娥奔月剪纸 广东快乐十分计划专业版 银狼试玩 包银虎爪 大发快三计划网页 跳跳猫猫注册 有水果拉霸的棋牌游戏 幸运28计划app