Android自定义PopupWindow实现炫酷的IOS对话框效果

前言:

最近在使用IOS系统的过程中发现IOS底部弹出框甚是漂亮,大气,上档次,于是乎就想啊能不能在Android中实现类似的对话框呢?你说,这不是废话吗,除了一些极少数的系统级的不能模仿外(版权)还有啥不能依瓢画葫芦的呢,所以啊,这篇文章将介绍如何在Android中实现高仿IOS对话框效果,先上图,给大家养养眼:

大家在看到上面的对话框时有没有想到简单的实现思路呢?我这里给出的思路是我们可以自定义一个PopupWindow,然后设置我们的布局。这里的布局很有技巧哦,那就是对话框中间的透明隔断区域其实是一个margin值,每个隔断的item layout的背景为一个白色圆角矩形,之后再让PopupWindow的背景为透明即可,是不是很简单呢。好了,让我们动手编写代码将它带回家吧。

大家也可以看看我的上篇文章:Android自定义Dialog,炫酷主流的加载对话框。

代码实现

1. 编写布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
 <LinearLayout
 android:layout_width="match_parent"
 android:orientation="horizontal"
 android:paddingTop="12dp"
 android:paddingBottom="12dp"
 android:background="@drawable/corner_white_bg"
 android:layout_height="wrap_content">
 <Button
  android:id="@id/btn_share_weixin"
  android:layout_width="0dp"
  android:layout_weight="1"
  android:drawableTop="@mipmap/ic_share_weixin"
  android:drawablePadding="6dp"
  android:background="@null"
  android:textColor="@android:color/black"
  android:textSize="@dimen/text_14_sp"
  android:text="@string/weixin"
  android:layout_height="wrap_content"/>
 <Button
  android:id="@id/btn_share_friends"
  android:layout_width="0dp"
  android:layout_weight="1"
  android:drawableTop="@mipmap/ic_share_friends"
  android:drawablePadding="6dp"
  android:background="@null"
  android:textColor="@android:color/black"
  android:textSize="@dimen/text_14_sp"
  android:text="@string/weixin_friends"
  android:layout_height="wrap_content"/>
 <Button
  android:id="@id/btn_share_qq"
  android:layout_width="0dp"
  android:layout_weight="1"
  android:drawableTop="@mipmap/ic_share_qq"
  android:drawablePadding="6dp"
  android:background="@null"
  android:textColor="@android:color/black"
  android:textSize="@dimen/text_14_sp"
  android:text="@string/qq"
  android:layout_height="wrap_content"/>
 <Button
  android:id="@id/btn_share_qq_zone"
  android:layout_width="0dp"
  android:layout_weight="1"
  android:drawableTop="@mipmap/ic_share_zones"
  android:drawablePadding="6dp"
  android:textColor="@android:color/black"
  android:textSize="@dimen/text_14_sp"
  android:background="@null"
  android:text="@string/qq_zones"
  android:layout_height="wrap_content"/>
 </LinearLayout>
 <Button
 android:id="@id/btn_cancel"
 android:layout_width="match_parent"
 android:textColor="@android:color/black"
 android:textSize="@dimen/text_14_sp"
 android:layout_marginTop="10dp"
 android:layout_marginBottom="10dp"
 android:text="@string/cancel"
 android:background="@drawable/corner_white_bg"
 android:layout_height="wrap_content"/>
</LinearLayout>

这里被隔断的部分有两个,所以布局中有两个view的背景为白色圆角矩形。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
 <corners android:radius="10dp"/>
 <solid android:color="@android:color/white"/>
</shape>

2. 继承PopupWindow

public class IosPopupWindow extends PopupWindow implements View.OnClickListener {
 private Context mContext;
 public IosPopupWindow(Activity activity) {
 super(activity);
 mContext = activity;
 LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
 View contentView = inflater.inflate(R.layout.dialog_share, null);
 setContentView(contentView);
 int screenWidth = activity.getWindowManager().getDefaultDisplay().getWidth();
 //获取popupwindow的高度与宽度
 this.setWidth((int) (screenWidth - 2 * dp2px(mContext,12f)));
 this.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);
 // 设置背景透明度
 setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
 // 设置动画
 this.setAnimationStyle(R.style.IosDialog);
 // 设置弹出窗体可点击
 this.setFocusable(true);
 // 点击外部可取消
 this.setOutsideTouchable(true);
 initView(contentView);
 }

以上代码最关键的就是给我们的PopupWindow设置一个透明的背景Drawable啦。

3. 窗口弹出时让外部变暗

/**
 * 让popupwindow以外区域阴影显示
 */
private void popOutShadow() {
 final Window window = ((Activity) mContext).getWindow();
 WindowManager.LayoutParams lp = window.getAttributes();
 lp.alpha = 0.5f;//设置阴影透明度
 window.setAttributes(lp);
 setOnDismissListener(new OnDismissListener() {
 @Override
 public void onDismiss() {
  WindowManager.LayoutParams lp = window.getAttributes();
  lp.alpha = 1f;
  window.setAttributes(lp);
 }
 });
}

与Dialog不同的是PopupWindow实现外部变暗需通过改变它依附的window的透明度,所以我们传给PopupWindow的Context需为Activity类型,同时在窗口消失的时候记得将Window的透明度重置。

最后,奉上IosPopupWindow的github,你值得拥有:https://github.com/ydxlt/LoadingDialog

总结

以上所述是小编给大家介绍的Android自定义PopupWindow实现炫酷的IOS对话框效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • Android UI设计与开发之PopupWindow仿腾讯新闻底部弹出菜单

    前一篇文章中有用到 PopupWindow 来实现弹窗的功能.简单介绍以下吧. 官方文档是这样解释的:这就是一个弹出窗口,可以用来显示一个任意视图.出现的弹出窗口是一个浮动容器的当前活动. 1.首先来个简单的栗子,效果如下: 只有两个布局文件,一个是弹窗布局(只有一张图片),一个是主界面布局(只有一个按钮). 然后在主界面代码中实例 PopupWindow ,指定弹出的界面,在按钮点击事件中显示或隐藏弹窗就可以了,代码如下: package com.yanis.demo; import andr

  • Android中使用PopupWindow 仿微信点赞和评论弹出

    微信朋友圈的点赞和评论功能,有2个组成部分:左下角的"更多"按钮:点击该按钮后弹出的对话框: PopupWindow,弹出框使用PopupWindow实现,这是点赞和评论的载体,具体要涉及 PopupWindow 点击非窗口位置和再次点击消失以及显示位置的问题(根据相应更多按钮的位置确定 PopupWindow 的显示位置 package com.example.cmm.helloworld; import android.app.AlertDialog; import android

  • Android编程实现popupwindow定时消失的方法

    本文实例讲述了Android编程实现popupwindow定时消失的方法.分享给大家供大家参考,具体如下: 因为是在其他界面弹出的popupwindow,要在横屏切换回竖屏的时候,让popupwindow自动消失,因为弹出popupwindow是普通的类,没有监听横竖屏的函数,所以想到了使用定时器,定时3秒之后如果用户没有操作就让popupwindow消失,代码如下: // 创建弹出窗口 popupMenu = new PopupWindow(view, sourceView.getWidth(

  • Android实现底部半透明弹出框PopUpWindow效果

    Android底部半透明弹出框PopUpWindow,供大家参考,具体内容如下 layout布局: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" androi

  • 详解Android PopupWindow怎么合理控制弹出位置(showAtLocation)

    说到PopupWindow,应该都会有种熟悉的感觉,使用起来也很简单 // 一个自定义的布局,作为显示的内容 Context context = null; // 真实环境中要赋值 int layoutId = 0; // 布局ID View contentView = LayoutInflater.from(context).inflate(layoutId, null); final PopupWindow popupWindow = new PopupWindow(contentView,

  • 详解Android中PopupWindow在7.0后适配的解决

    本文介绍了详解Android中PopupWindow在7.0后适配的解决,分享给大家,具体如下: 这里主要记录一次踩坑的经历. 需求:如上图左侧效果,想在按钮的下方弹一个PopupWindow.嗯,很简单一个效果,然当适配7.0后发现这个PopupWindow显示异常,然后网上找到了下面这种方案. 7.0适配方案(但7.1又复现了) // 将popupWindow显示在anchor下方 public void showAsDropDown(PopupWindow popupWindow, Vie

  • Android开发实现popupWindow弹出窗口自定义布局与位置控制方法

    本文实例讲述了Android开发实现popupWindow弹出窗口自定义布局与位置控制方法.分享给大家供大家参考,具体如下: 布局文件: 主布局文件:activity_main: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools=&q

  • Android开发解决popupWindow重叠报错问题

    在popupWindow里面再弹出popupWindow的时候会报这样的错误 ERROR/AndroidRuntime(888): android.view.WindowManager$BadTokenException: Unable to add window -- token android.view.ViewRoot$W@44ef1b68 is not valid; is your activity running? 报错的意思大概就是说依赖的Activity没了. 解决方法1 不要在当

  • Android 使用PopupWindow实现弹出更多的菜单实例详解

    最近想要做一个弹出更多的菜单,而原生的弹出菜单却不是我们想要的效果,所以必然要自定义菜单咯.本人也是借鉴网上的资料进行封装的,感觉还蛮不错的. 原生的菜单如下图: 自定义之后的效果图: 是不是看到这里之后,对比可知,原生的效果不太理想,所以还是再自己定义吧! 1.PopupWindow可以说是一个浮动在Activity之上的容器,通常用来显示自定义的视图.弹出菜单的封装PopMenuMore /** * 对弹出菜单的封装. * http://blog.csdn.net/maosidiaoxian

  • Android Popupwindow弹出窗口的简单使用方法

    本文实例为大家分享了Android Popupwindow弹出窗口的具体代码,供大家参考,具体内容如下 代码很简单,没有和别的控件连用.布局自己随意定义,我的这个是最基础的,就直接上代码啦! 在MainActivity里 import android.content.Context; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.view.LayoutInflat

  • Android中的popupwindow进入和退出的动画效果

    废话不多说了直接给大家贴代码了,具体代码如下所示: <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"> <translate android:fromXDelta="0" android:toXDelta="0" andro

随机推荐