Android实现毛玻璃效果的对话框

2024-08-03 15:53:08

一个popwindow，在弹出的时候背景是原界面的截图加高斯模糊效果：

先给出popwindow的布局文件

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/FrameLayout1"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="@drawable/roundcorner" > 

 <com.npi.blureffect.ScrollableImageView
 android:id="@+id/imageView1"
 android:background="@drawable/roundcorner"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:src="@drawable/roundcorner" /> 

 <RelativeLayout
 android:id="@+id/RelativeLayout1"
 android:layout_width="match_parent"
 android:layout_height="match_parent" > 

 <TextView
  android:id="@+id/textView1"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_alignParentLeft="false"
  android:layout_alignParentTop="false"
  android:layout_centerHorizontal="true"
  android:layout_centerInParent="false"
  android:layout_centerVertical="false"
  android:layout_marginLeft="33dp"
  android:layout_marginTop="44dp"
  android:text="这是提示语" /> 

 <TextView
  android:id="@+id/textView2"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_alignParentLeft="false"
  android:layout_below="@+id/textView1"
  android:layout_centerHorizontal="true"
  android:layout_marginTop="49dp"
  android:text="确定"
  android:textAppearance="?android:attr/textAppearanceLarge" /> 

 </RelativeLayout> 

</FrameLayout>

里面那个自定义imageView控件在我上一篇博客里，下面是activity的布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:id="@+id/window"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:paddingBottom="@dimen/activity_vertical_margin"
 android:paddingLeft="@dimen/activity_horizontal_margin"
 android:paddingRight="@dimen/activity_horizontal_margin"
 android:paddingTop="@dimen/activity_vertical_margin"
 tools:context="com.npi.blureffect.TestActivity" > 

 <TextView
 android:id="@+id/textView1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="@string/hello_world" /> 

 <RatingBar
 android:id="@+id/ratingBar1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignLeft="@+id/textView1"
 android:layout_below="@+id/textView1"
 android:layout_marginTop="124dp" /> 

 <Switch
 android:id="@+id/switch1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignLeft="@+id/ratingBar1"
 android:layout_below="@+id/ratingBar1"
 android:layout_marginLeft="24dp"
 android:layout_marginTop="81dp"
 android:text="Switch" /> 

 <Button
 android:id="@+id/button1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignRight="@+id/ratingBar1"
 android:layout_below="@+id/ratingBar1"
 android:text="Button" /> 

 <Button
 android:id="@+id/button2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignBottom="@+id/ratingBar1"
 android:layout_alignLeft="@+id/switch1"
 android:layout_marginBottom="52dp"
 android:text="Button" /> 

 <TextView
 android:id="@+id/textView2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignBottom="@+id/button1"
 android:layout_alignLeft="@+id/ratingBar1"
 android:text="Large Text"
 android:textAppearance="?android:attr/textAppearanceLarge" /> 

</RelativeLayout>

用于圆角的背景xml，放在drawable文件夹中

<?xml version="1.0" encoding="UTF-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
 <item>
  <shape>
  <solid android:color="#efefef" /><!-- 连框颜色值 --> 

  <!-- 设置圆角边框 -->
   <corners
   android:topLeftRadius="20dp"
   android:topRightRadius="20dp"
   android:bottomRightRadius="20dp"
   android:bottomLeftRadius="20dp"
   />
  </shape>
 </item>
 <!-- 主体背景颜色值 -->
 <item android:bottom="20dp" android:top="20dp" android:left="20dp" android:right="20dp"> <!--上下左右四个边框的宽度，为0的话就没有了-->
  <shape>
  <solid android:color="#efefef" /> <!-- 背景白色 -->
  </shape>
 </item>
 </layer>

activity的源码

package com.npi.blureffect; 

import android.annotation.SuppressLint;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.Point;
import android.os.Build;
import android.os.Bundle;
import android.util.Log;
import android.view.Display;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.widget.PopupWindow;
import android.widget.RelativeLayout;
import android.widget.TextView; 

public class TestActivity extends Activity {
TextView textView1;
RelativeLayout window;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_test);
 textView1 = (TextView) findViewById(R.id.textView1);
 window = (RelativeLayout)findViewById(R.id.window);
 textView1.setOnClickListener(new OnClickListener() { 

  @Override
  public void onClick(View v) {
  // TODO Auto-generated method stub
  initPopuptWindow(window);
  }
 }); 

 }
PopupWindow popupWindow; 

 /**
 * 创建PopupWindow
 */
 protected void initPopuptWindow(View layout) {
 // TODO Auto-generated method stub
 //对当前页面进行截屏
 layout.setDrawingCacheEnabled(true);
 layout.buildDrawingCache(); //启用DrawingCache并创建位图
 Bitmap screen = Bitmap.createBitmap(layout.getDrawingCache()); //创建一个DrawingCache的拷贝，因为DrawingCache得到的位图在禁用后会被回收
 layout.setDrawingCacheEnabled(false); //禁用DrawingCahce否则会影响性能 

 //将截屏进行模糊
 screen = Blur.fastblur(this, screen, 15); 

 // 获取自定义布局文件activity_popupwindow_left.xml的视图
 final View popupWindow_view = getLayoutInflater().inflate(R.layout.ioswindow, null,
  false);
 // 创建PopupWindow实例,200,LayoutParams.MATCH_PARENT分别是宽度和高度
 final ScrollableImageView background = (ScrollableImageView) popupWindow_view.findViewById(R.id.imageView1);
 background.setoriginalImage(screen);
 final int screenWidth = getScreenWidth(this);
 final int screenHeight = screen.getHeight();
 final int heightless = getScreenHeight(this)-screenHeight;
 Log.i("Alex", "屏幕宽度为"+screenWidth+"高度为"+screenHeight+"偏差为"+heightless);
 popupWindow = new PopupWindow(popupWindow_view, (int) (screenWidth*0.8), (int) (screenWidth*0.85*0.5), true); //设置popwindow的大小
 popupWindow.showAtLocation(textView1, Gravity.CENTER, 0, 0);//设置popwindow的位置
 popupWindow_view.post(new Runnable() { 

  @Override
  public void run() {
  // TODO Auto-generated method stub
  int left = screenWidth/10;
  Log.i("Alex", screenHeight+"-"+screenWidth*0.85*0.5);
  int top = (int) ((screenHeight-screenWidth*0.85*0.5)/2-heightless/2);
  Log.i("Alex", "top是"+top);
  background.handleScroll(top, left);
  }
 }); 

 // 设置动画效果
 // 点击其他地方消失
 TextView confirm = (TextView) popupWindow_view.findViewById(R.id.textView2);
 confirm.setOnClickListener(new OnClickListener() { 

  @Override
  public void onClick(View v) {
  // TODO Auto-generated method stub
  popupWindow.dismiss();
  }
 }); 

 } 

 /**
 * Get the screen width.
 *
 * @param context
 * @return the screen width
 */
 @SuppressWarnings("deprecation")
 @SuppressLint("NewApi")
 public static int getScreenWidth(Activity context) { 

 Display display = context.getWindowManager().getDefaultDisplay();
 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB_MR2) {
  Point size = new Point();
  display.getSize(size);
  return size.x;
 }
 return display.getWidth();
 } 

 /**
 * Get the screen height.
 *
 * @param context
 * @return the screen height
 */
 @SuppressWarnings("deprecation")
 @SuppressLint("NewApi")
 public static int getScreenHeight(Activity context) { 

 Display display = context.getWindowManager().getDefaultDisplay();
 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB_MR2) {
  Point size = new Point();
  display.getSize(size);
  return size.y;
 }
 return display.getHeight();
 }
}

第二种样式，比第一种简单但是效果更明显也更大众化

这个是在原来布局的最上层加上了一个不可见的imageView，在弹出popwindow之前用这个imageView盖住底下的东西

布局如下

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:id="@+id/window"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context="com.npi.blureffect.DialogActivity" > 

 <TextView
 android:id="@+id/textView1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:text="@string/hello_world" />
 <RatingBar
 android:id="@+id/ratingBar1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignLeft="@+id/textView1"
 android:layout_below="@+id/textView1"
 android:layout_marginTop="124dp" /> 

 <Switch
 android:id="@+id/switch1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignLeft="@+id/ratingBar1"
 android:layout_below="@+id/ratingBar1"
 android:layout_marginLeft="24dp"
 android:layout_marginTop="81dp"
 android:text="Switch" /> 

 <Button
 android:id="@+id/button1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignRight="@+id/ratingBar1"
 android:layout_below="@+id/ratingBar1"
 android:text="Button" /> 

 <Button
 android:id="@+id/button2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignBottom="@+id/ratingBar1"
 android:layout_alignLeft="@+id/switch1"
 android:layout_marginBottom="52dp"
 android:text="Button" /> 

 <TextView
 android:id="@+id/textView2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignBottom="@+id/button1"
 android:layout_alignLeft="@+id/ratingBar1"
 android:text="Large Text"
 android:textAppearance="?android:attr/textAppearanceLarge" /> 

 <ProgressBar
 android:id="@+id/progressBar1"
 style="?android:attr/progressBarStyleHorizontal"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignParentBottom="true"
 android:layout_marginBottom="49dp"
 android:layout_toLeftOf="@+id/button1" /> 

 <ProgressBar
 android:id="@+id/progressBar2"
 style="?android:attr/progressBarStyleLarge"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_below="@+id/switch1"
 android:layout_toRightOf="@+id/switch1" /> 

 <RadioButton
 android:id="@+id/radioButton1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_above="@+id/progressBar1"
 android:layout_alignLeft="@+id/switch1"
 android:text="RadioButton" /> 

 <Button
 android:id="@+id/button3"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_alignLeft="@+id/progressBar2"
 android:layout_below="@+id/progressBar2"
 android:text="Button" /> 

 <ImageView
 android:id="@+id/background"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="#fff"
 android:visibility="gone" /> 

</RelativeLayout>

activity 如下

package com.npi.blureffect; 

import android.annotation.SuppressLint;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Matrix;
import android.graphics.Point;
import android.os.Build;
import android.os.Bundle;
import android.util.Log;
import android.view.Display;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.PopupWindow;
import android.widget.RelativeLayout;
import android.widget.TextView; 

public class DialogActivity extends Activity {
TextView textView1;
RelativeLayout window;
ImageView background;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_dialog);
 textView1 = (TextView) findViewById(R.id.textView1);
 window = (RelativeLayout)findViewById(R.id.window);
 background = (ImageView) findViewById(R.id.background); 

 textView1.setOnClickListener(new OnClickListener() { 

 @Override
 public void onClick(View v) {
 // TODO Auto-generated method stub
 initPopuptWindow(window);
 }
 });
 } 

 PopupWindow popupWindow; 

 /**
 * 创建PopupWindow
 */
 protected void initPopuptWindow(View layout) {
 // TODO Auto-generated method stub
 //对当前页面进行截屏
 layout.setDrawingCacheEnabled(true);
 layout.buildDrawingCache(); //启用DrawingCache并创建位图
 Bitmap screen = Bitmap.createBitmap(layout.getDrawingCache()); //创建一个DrawingCache的拷贝，因为DrawingCache得到的位图在禁用后会被回收
 layout.setDrawingCacheEnabled(false); //禁用DrawingCahce否则会影响性能
 Log.i("Alex", "转换前bitmap的大小是"+screen.getWidth()+" : "+screen.getHeight());
 screen = scaleBitmap(screen, screen.getWidth()/2, screen.getHeight()/2);//压缩bitmap到指定大小
 Log.i("Alex", "转换后bitmap的大小是"+screen.getWidth()+" : "+screen.getHeight());
 //将截屏进行模糊
 screen = Blur.fastblur(this, screen, 10); 

 // 获取自定义布局文件activity_popupwindow_left.xml的视图
 final View popupWindow_view = getLayoutInflater().inflate(R.layout.ioswindow, null,
 false); 

 // 创建PopupWindow实例,200,LayoutParams.MATCH_PARENT分别是宽度和高度
 background.setImageBitmap(screen);
 background.setVisibility(View.VISIBLE);
 final int screenWidth = getScreenWidth(this);
 popupWindow = new PopupWindow(popupWindow_view, (int) (screenWidth*0.8), (int) (screenWidth*0.85*0.5), true); //设置popwindow的大小
 popupWindow.showAtLocation(textView1, Gravity.CENTER, 0, 0);//设置popwindow的位置
 popupWindow_view.post(new Runnable() { 

 @Override
 public void run() {
 // TODO Auto-generated method stub
 int left = screenWidth/10;
 }
 }); 

 // 设置动画效果
 // 点击其他地方消失
 TextView confirm = (TextView) popupWindow_view.findViewById(R.id.textView2);
 confirm.setOnClickListener(new OnClickListener() { 

 @Override
 public void onClick(View v) {
 // TODO Auto-generated method stub
 background.setVisibility(View.GONE);
 popupWindow.dismiss();
 }
 }); 

 } 

 /**
 * Get the screen width.
 *
 * @param context
 * @return the screen width
 */
 @SuppressWarnings("deprecation")
 @SuppressLint("NewApi")
 public static int getScreenWidth(Activity context) { 

 Display display = context.getWindowManager().getDefaultDisplay();
 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB_MR2) {
 Point size = new Point();
 display.getSize(size);
 return size.x;
 }
 return display.getWidth();
 } 

 /**
 * 把一个bitmap压缩，压缩到指定大小
 * @param bm
 * @param width
 * @param height
 * @return
 */
 private static Bitmap scaleBitmap(Bitmap bm, float width, float height) {
 if (bm == null) {
 return null;
 }
 int bmWidth = bm.getWidth();
 int bmHeight = bm.getHeight();
 float scaleWidth = width / bmWidth;
 float scaleHeight = height / bmHeight;
 Matrix matrix = new Matrix();
 matrix.postScale(scaleWidth, scaleHeight); 

 if (scaleWidth == 1 && scaleHeight == 1) {
 return bm;
 } else {
 Bitmap resizeBitmap = Bitmap.createBitmap(bm, 0, 0, bmWidth,
  bmHeight, matrix, false);
 bm.recycle();//回收图片内存
 bm.setDensity(240);
 return resizeBitmap;
 }
 }
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

Android模糊处理实现图片毛玻璃效果

本文实例讲解了Android 虚化图片.模糊图片.图片毛玻璃效果的实现方法,具体内容如下效果如图: 在Android可以用RenderScript方便的实现这个方法: private void blur(Bitmap bkg, View view, float radius) { Bitmap overlay = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(), Bitmap.Config.ARGB_8
Android 实现图片模糊、高斯模糊、毛玻璃效果的三种方法

在前几天写过一个使用glide-transformations的方法实现高斯模糊的方法,今天偶然间有发现一个大神写的另一个方法,感觉挺不错的,分享一下: 效果图: 原文链接:点击访问这使用也很简单,导入依赖,使用模糊方法就行,就这两步搞定依赖: compile 'net.qiujuer.genius:blur:2.0.0-beta4' 实现方法有三种,第一个是Java实现的,第二个和第三个是调用C语言实现的 ,具体的区别也就是代码执行的耗时操作时间,从图片中可以看出Java使用时间远大于c运
android popwindow实现左侧弹出菜单层及PopupWindow主要方法介绍

PopupWindow可以实现浮层效果,主要方法有:可以自定义view,通过LayoutInflator方法:可以出现和退出时显示动画:可以指定显示位置等. 为了将PopupWindow的多个功能展现并力求用简单的代码实现,编写了一个点击按钮左侧弹出菜单的功能,实现出现和退出时显示动画效果并点击其他区域时弹出层自动消失,效果图如下: 源码: 1.PopwindowOnLeftActivity.java 复制代码代码如下: package com.pop.main; import android
Android中实现毛玻璃效果的3种方法

最近在做一款叫叽叽的App(男银懂的),其中有一个功能需要对图片处理实现毛玻璃的特效进过一番预研,找到了3中实现方案,其中各有优缺点: 1.如果系统的api在16以上,可以使用系统提供的方法直接处理图片复制代码代码如下: if (VERSION.SDK_INT > 16) { Bitmap bitmap = sentBitmap.copy(sentBitmap.getConfig(), true); final RenderScript rs = RenderScr
Android关于Glide的使用(高斯模糊、加载监听、圆角图片)

高斯模糊.加载监听.圆角图片这些相信大家都很熟悉,那如何实现这些效果,请大家参考本文进行学习. 1.引用 compile 'com.github.bumptech.glide:glide:3.7.0' 2.加载图片 2.1 基本加载 Glide.with(context) .load(url) .into(imageView); 2.2 设置加载中和加载失败的情况 Glide.with(context) .load(url) .placeholder(R.drawable.loa
Android模糊处理简单实现毛玻璃效果

自从iOS系统引入了Blur效果,也就是所谓的毛玻璃.模糊化效果.磨砂效果,各大系统就开始竞相模仿,这是怎样的一个效果呢,我们先来看一下,如下面的图片: 实现效果大家都知道了,如何在Android中实现呢,说白了就是对图片进行模糊化处理,小编先给大家讲一下Android高级模糊技术的原理,如下: 首先我创建了一个空的bitmap,把背景的一部分复制进去,之后我会对这个bitmap进行模糊处理并设置为TextView的背景. 通过这个bitmap保存Canvas的状态: 在父布局文件中把Canva
Android图片特效:黑白特效、圆角效果、高斯模糊

1.黑白效果复制代码代码如下: /** * 将彩色图转换为黑白图 * * @param 位图 * @return 返回转换好的位图 */ public static Bitmap convertToBlackWhite(Bitmap bmp) { int width = bmp.getWidth(); // 获取位图的宽 int height = bmp.getHeight(); // 获取位图的高 int[] pi
Android实现动态高斯模糊效果

高斯模糊是什么? 高斯模糊(英语:Gaussian Blur),也叫高斯平滑,是在Adobe Photoshop.GIMP以及Paint.NET等图像处理软件中广泛使用的处理效果,通常用它来减少图像噪声以及降低细节层次.这种模糊技术生成的图像,其视觉效果就像是经过一个半透明屏幕在观察图像,这与镜头焦外成像效果散景以及普通照明阴影中的效果都明显不同. 什么?看不明白?没关系,我也看不明白,维基百科复制回来的嘛.我们直接放一些图片来了解以下这个高斯模糊是怎么样的.因为高斯模糊在iOS中最常见,这里抓
Android开发之毛玻璃效果实例代码

这是在网上找的,不过忘了在哪里找的,经过很多比较测试,发现这个方法不会 oom,目前来看我一直没有遇过,今天才找到这个以前建立的工程,记录下来: 先给大家展示下效果图: public class FastBlur { public static Bitmap doBlur(Bitmap sentBitmap, int radius, boolean canReuseInBitmap) { // This is a compromise between Gaussian Blur and Box
Android 中Popwindow弹出菜单的两种方法实例

Android 中Popwindow弹出菜单的两种方法实例 1.popWindow就是对话框的一种方式! 此文讲解的android中对话框的一种使用方式,它叫popWindow. 2.popWindow的特性 Android的对话框有两种:PopupWindow和AlertDialog.它们的不同点在于: AlertDialog的位置固定,而PopupWindow的位置可以随意. AlertDialog是非阻塞线程的,而PopupWindow是阻塞线程的. PopupWindow的位置按照有无偏

Android实现毛玻璃效果的对话框

相关推荐

随机推荐