Android仿ios风格底部弹框
2017-05-31 17:19
417 查看
最近在项目中遇到一个需求,让Android的菜单类弹框和ios一样从底部弹出来,产品考虑到Android和ISO风格要统一,但是作为开发人员知道,这种是两种不同操作系统下各自的风格,虽然个人觉得有点不伦不类,但是产品与开发之间,你懂的,做就做吧,做完之后感觉效果还不错,使用起来也挺方便,所以和大家分享一下。
话不多说,先看效果:
![](http://img.blog.csdn.net/20170531183154967?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd2FuZ3l1bnR1YW4=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center)
好了 下面具体看看怎么实现的 ,我的想法是既然要实现一个菜单,那么就要考虑到它的易用性和便用性,所以要做到菜单里面的选项可以穿进去,取消按钮一般是“取消”二字,但是不排除用到这个框的时候会有一些其他功能,所以要实现所有内容都可以用参数的方式传进去。我的思路是用pop做,上面一个listview,下面一个textview,看布局:
代码是这样的:
第一:只有一个菜单,需要四个角都是圆角;
第二:两个菜单,这样需要上面的菜单左上和右上圆角,然后第二个左下和右下圆角;
第三:三个及以上,这种情况需要在二的基础上中间的都是直角;(写到这突然想到一句话,一生二二生三三生万物好像是这么个道理)
基于有这些情况,所以我们要对不同数量的菜单做判断来设置背景以及点击效果,当然点击效果包含于背景里面,判断是这样写的:
最终做到完美适配,当然点击事件我们要做到可以控,所以点击的监听不能少,这里做两个监听,listview的item,和取消按钮,先把监听定义好:
第一:listview的item:
如果觉得好用欢迎加入qq群交流:579699145
话不多说,先看效果:
好了 下面具体看看怎么实现的 ,我的想法是既然要实现一个菜单,那么就要考虑到它的易用性和便用性,所以要做到菜单里面的选项可以穿进去,取消按钮一般是“取消”二字,但是不排除用到这个框的时候会有一些其他功能,所以要实现所有内容都可以用参数的方式传进去。我的思路是用pop做,上面一个listview,下面一个textview,看布局:
代码是这样的:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="@dimen/padding_lsmall" > <ListView android:id="@+id/pop_list" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="10" android:background="@drawable/pop_list_bg" > </ListView> <TextView android:id="@+id/cancle_tv" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:background="@drawable/pop_cancle" android:clickable="true" android:gravity="center" android:padding="16dp" android:text="取消" android:textColor="@color/text_color_blue" android:textSize="@dimen/text_size_big" android:textStyle="bold" /> </LinearLayout>在构造方法里把需要的参数传进去:
/** * * @param mContext * @param mCancleContent 取消按钮文字 * @param mItems 菜单数组 * @param mCancleAbleOutSide 是否让点击外部取消 */ public MyPopBottom(Context mContext,String mCancleContent, String[] mItems, Boolean mCancleAbleOutSide) { super(); this.mContext = mContext; this.mCancleContent = mCancleContent; this.mItems = mItems; this.mCancleAbleOutSide = mCancleAbleOutSide; showMyBottomPop(); }显示方法我就先不放了,可以下载项目具体看,这里要说一下pop里面listview的适配器,因为我们的菜单数量不确定,菜单做的是圆角,所以要考虑3种情况:
第一:只有一个菜单,需要四个角都是圆角;
第二:两个菜单,这样需要上面的菜单左上和右上圆角,然后第二个左下和右下圆角;
第三:三个及以上,这种情况需要在二的基础上中间的都是直角;(写到这突然想到一句话,一生二二生三三生万物好像是这么个道理)
基于有这些情况,所以我们要对不同数量的菜单做判断来设置背景以及点击效果,当然点击效果包含于背景里面,判断是这样写的:
if (getCount() == 1) { convertView.setBackgroundResource(R.drawable.pop_cancle); }else { if (position == 0) { convertView.setBackgroundResource(R.drawable.pop_item_first_bg); }else if (position == (mItems.length - 1)) { convertView.setBackgroundResource(R.drawable.pop_item_last_bg); }else { convertView.setBackgroundResource(R.drawable.pop_item_middle_bg); } }
最终做到完美适配,当然点击事件我们要做到可以控,所以点击的监听不能少,这里做两个监听,listview的item,和取消按钮,先把监听定义好:
private MyPopClickListener myPopClickListener; public void setOnMyPopClickListener(MyPopClickListener myPopClickListener){ this.myPopClickListener = myPopClickListener; } public interface MyPopClickListener{ public void myListItemClick(int itemPosition, String itemContent); public void myCancleClick(String cancleContent); } private void disMissPop(){ if (mPopupWindow!=null && mPopupWindow.isShowing()) { mPopupWindow.dismiss(); } }再分别在对应的地方设置就行了,
第一:listview的item:
convertView.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { if (myPopClickListener!=null) { disMissPop(); myPopClickListener.myListItemClick(position, getItem(position).toString()); } } });第二:取消按钮:
cancle.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { if (myPopClickListener!=null) { disMissPop(); myPopClickListener.myCancleClick(mCancleContent); } } });这里把点击的菜单项以及取消项的文字都传回去方便以后调用的时候用,下面再看看调用,其实方法写好后调用就很简单了,完全按照你定义的思路写好了,这里只举例一个三项的例子,一个两个的同理:
findViewById(R.id.btn_three_item).setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { new MyPopBottom(mContext, "取消", new String[] { "菜单项一" ,"菜单项二", "菜单项三"}, true) .setOnMyPopClickListener(new MyPopClickListener() { @Override public void myListItemClick(int itemPosition, String itemContent) { switch (itemPosition) { case 0: Toast.makeText(mContext, "click" + itemContent, Toast.LENGTH_SHORT).show(); break; case 1: Toast.makeText(mContext, "click" + itemContent, Toast.LENGTH_SHORT).show(); break; case 2: Toast.makeText(mContext, "click" + itemContent, Toast.LENGTH_SHORT).show(); break; } } @Override public void myCancleClick(String cancleContent) { Toast.makeText(mContext, "click" + cancleContent, Toast.LENGTH_SHORT).show(); } }); } });到此已经大功告成,有没有很方便,哈哈
如果觉得好用欢迎加入qq群交流:579699145
源码下载地址:http://download.csdn.net/detail/wangyuntuan/9856856
相关文章推荐
- Android模拟IOS风格的自定义Dialog底部弹窗案例
- android底部弹出iOS7风格对话选项框(QQ对话框)--第三方开源之IOS_Dialog_Library
- Android开发中实现IOS风格底部选择器(支持时间 日期 自定义)
- (转)android底部弹出iOS7风格对话选项框(QQ对话框)--第三方开源--IOS_Dialog_Library
- (转)android底部弹出iOS7风格对话选项框(QQ对话框)--第三方开源--IOS_Dialog_Library
- AndroidIOS风格底部选择器(支持时间,日期,自定义)
- Android控件PopupWindow模仿ios底部弹窗
- IOS实战 (1) 之 仿 LOFTER 底部 水平滑动(也有 Android 版本哦)
- Android底部弹出iOS7风格对话选项框
- Android 自定义Dialog仿Ios底部弹出
- Android仿IOS底部弹出对话框
- android仿IOS底部弹对话框
- [开源]在iOS上实现Android风格的控件Toast
- Android实现类似iOS风格的对话框实例代码
- android仿IOS,滑动隐藏底部ScrollView
- 张高兴的 Xamarin.Forms 开发笔记:为 Android 与 iOS 引入 UWP 风格的汉堡菜单 ( MasterDetailPage )
- iOS小技巧-UITableView去除底部多余的分割线方法以及设置分割线风格和颜色
- 在iOS上实现Android风格的控件Toast
- [demo]仿IOS底部弹框效果及Android各类对话框和弹框效果
- Android使用popwindow高仿IOS底部弹框