关闭

android dialog圆角显示及解决出现的黑色棱角

标签: dialog透明圆角
598人阅读 评论(0) 收藏 举报
分类:

原文地址:http://blog.csdn.net/jj120522/article/details/7871289

最近在开发一个天气预报的app,看到一个比较不错友情提示,如下:

                 

怎么样,看起来比原始的dialog好看吧.好了,做法也许有很多,我介绍下我的做法吧,

 首先,我第一个想到的就是重写dialog.自定义一个layout布局,引用shape.xml实现圆角。

 

 在此之前,我要说明一下:在我们新建的布局文件,只要不是最外层我们引用shape就不会遇到下面这个问题,看图:

         

          

    仔细看就是四个角,发现出现四个黑棱角,这个肯定使我们不想要的结果,我在配置文件中怎么设置都不行,郁闷了好久,突然发现之前做过dialog显示图片的效果,找了一下例子,原来真的做过,看来我真的不适合做程序啊,努力赚钱做生意去.说的好像跑偏了,说正题:解决方法就是:getWindow().setBackgroundDrawable(new BitmapDrawable()); 或者getWindow().setBackgroundDrawableResource(android.R.color.transparent);这样就不会出现四个黑棱角了.

   这个时候我们解决棱角了,又有一个问题,你会发现你在配置文件中,设置中间某个布局的背景颜色的时候,这个圆角会被吞噬,解决方法我们可以在shape中设置中间填充颜色,对于中间的部分我们可以在布局文件中设置,因为中间她影响不到圆角,哈哈这样就实现最终效果了.如果有人要说,那我实现三种颜色多种颜色怎么办,其实我们也可以分开shape,不是吗,就是麻烦点,不过肯定可以实现.

  

看起来效果还可以吧,不过现在还正在完善.

该睡觉了,就说到这了,也许我讲的都是些废话,不过我在这上面卡三次,做过了都不知道,写下来加深记忆。



/*************************************************************************************/

上面介绍的是自定义dialog来实现.下面我们在来看一个示例.

         

这是我现在项目中开发的一个视图,样式还没有进行处理,所以难免有些粗糙.(至于原因:有过小公司开发经验的朋友,你懂的.)

实现方法我们完全可以用上面自定义dialog完全可以做到.不过自定义有个缺点就是你必须整合到她的父视图中.因为用到环境变量Context. 或许你可以做到很好的分层.还有这里面也涉及了比较多的界面操作.就类似于一个mini的Activity.这里我们用另外一种简单的方法实现:改变Activity的Style.

在style文件中自定义一个样式.

[java] view plaincopy
  1. <style name="Theme.HalfScreen" parent="android:style/Theme.Dialog"></style>  

在Activity中引用:

[java] view plaincopy
  1. <activity  
  2.            android:name=".MemberActivity"  
  3.            android:screenOrientation="portrait"  
  4.            android:theme="@style/Theme.HalfScreen" />  
或者不定义你直接引用现有的样式也行.这里不是重点所在.

首先我们要在xml中定义视图:(这里我将样式copy出来.这样比密密麻麻一坨代码看起来舒服点.)


不知道大家注意到没.她的四周都是圆角.正是这个圆角给这个mini版的Activity增加了独有特色.下面我简单说明下具体实现:

首先布局的圆角大家可以自定一个背景xml文件

[java] view plaincopy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <shape xmlns:android="http://schemas.android.com/apk/res/android" >  
  3.   
  4.     <corners android:radius="10dp" />  
  5.   
  6.     <solid android:color="@color/white" />  
  7.   
  8. </shape>  
很简单这里不解释.

这样还没有完,这样我们只能得到下半部分是个圆角,而上半部分并非圆角,因为上部是一个图片.这里通过配置文件是做不到的,我们需要在代码中队图片进行处理.目的:图片上半部分为圆角.

代码片段:

[java] view plaincopy
  1. /*** 
  2.      * 图片切圆角,方向自由. 
  3.      */  
  4.     public static final int ALL = 347120;    
  5.     public static final int TOP = 547120;    
  6.     public static final int LEFT = 647120;    
  7.     public static final int RIGHT = 747120;    
  8.     public static final int BOTTOM = 847120;    
  9.   
  10.     public static Bitmap fillet(int type,Bitmap bitmap,int roundPx) {    
  11.         try {    
  12.             // 其原理就是:先建立一个与图片大小相同的透明的Bitmap画板    
  13.             // 然后在画板上画出一个想要的形状的区域。    
  14.             // 最后把源图片帖上。    
  15.             final int width = bitmap.getWidth();    
  16.             final int height = bitmap.getHeight();    
  17.   
  18.             Bitmap paintingBoard = Bitmap.createBitmap(width,height, Config.ARGB_8888);    
  19.             Canvas canvas = new Canvas(paintingBoard);    
  20.             canvas.drawARGB(Color.TRANSPARENT, Color.TRANSPARENT, Color.TRANSPARENT, Color.TRANSPARENT);    
  21.   
  22.             final Paint paint = new Paint();    
  23.             paint.setAntiAlias(true);    
  24.             paint.setColor(Color.BLACK);       
  25.   
  26.             if( TOP == type ){    
  27.                 clipTop(canvas,paint,roundPx,width,height);    
  28.             }else if( LEFT == type ){    
  29.                 clipLeft(canvas,paint,roundPx,width,height);    
  30.             }else if( RIGHT == type ){    
  31.                 clipRight(canvas,paint,roundPx,width,height);    
  32.             }else if( BOTTOM == type ){    
  33.                 clipBottom(canvas,paint,roundPx,width,height);    
  34.             }else{    
  35.                 clipAll(canvas,paint,roundPx,width,height);    
  36.             }    
  37.   
  38.             paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));     
  39.             //帖子图    
  40.             final Rect src = new Rect(00, width, height);    
  41.             final Rect dst = src;    
  42.             canvas.drawBitmap(bitmap, src, dst, paint);       
  43.             return paintingBoard;    
  44.         } catch (Exception exp) {            
  45.             return bitmap;    
  46.         }    
  47.     }    
  48.       
  49.      private static void clipLeft(final Canvas canvas,final Paint paint,int offset,int width,int height){    
  50.             final Rect block = new Rect(offset,0,width,height);    
  51.             canvas.drawRect(block, paint);    
  52.             final RectF rectF = new RectF(00, offset * 2 , height);    
  53.             canvas.drawRoundRect(rectF, offset, offset, paint);    
  54.         }    
  55.             
  56.         private static void clipRight(final Canvas canvas,final Paint paint,int offset,int width,int height){    
  57.             final Rect block = new Rect(00, width-offset, height);    
  58.             canvas.drawRect(block, paint);    
  59.             final RectF rectF = new RectF(width - offset * 20, width , height);    
  60.             canvas.drawRoundRect(rectF, offset, offset, paint);    
  61.         }    
  62.             
  63.         private static void clipTop(final Canvas canvas,final Paint paint,int offset,int width,int height){    
  64.             final Rect block = new Rect(0, offset, width, height);    
  65.             canvas.drawRect(block, paint);    
  66.             final RectF rectF = new RectF(00, width , offset * 2);    
  67.             canvas.drawRoundRect(rectF, offset, offset, paint);    
  68.         }    
  69.             
  70.         private static void clipBottom(final Canvas canvas,final Paint paint,int offset,int width,int height){    
  71.             final Rect block = new Rect(00, width, height - offset);    
  72.             canvas.drawRect(block, paint);    
  73.             final RectF rectF = new RectF(0, height - offset * 2 , width , height);    
  74.             canvas.drawRoundRect(rectF, offset, offset, paint);    
  75.         }    
  76.             
  77.         private static void clipAll(final Canvas canvas,final Paint paint,int offset,int width,int height){    
  78.             final RectF rectF = new RectF(00, width , height);    
  79.             canvas.drawRoundRect(rectF, offset, offset, paint);    
  80.         }    

先声明,这段代码是copy他人的.写的相当的清晰,我就直接拿来用了.

这里你要注意一个值roundPx.看下面这张图(上部圆角).


也许有的朋友们已经明白,那个白色是我们底部圆角布局.因为此时(图片圆角弧度>底部圆角布局.)所以就会 出现这种现象,解决方法很简单,你可以让图片圆角弧度小于底部圆角布局圆角即可,或者为了更为准确,你可以都用px作为单位,都引用这个这个大小.

0
0
查看评论

android dialog圆角显示及解决出现的黑色棱角

http://blog.csdn.net/jj120522/article/details/7871289 最近在开发一个天气预报的app,看到一个比较不错友情提示,如下:          &#...
  • thinkinwm
  • thinkinwm
  • 2013-09-04 17:46
  • 9081

android dialog圆角显示及解决出现的黑色棱角 .

最近在开发一个天气预报的app,看到一个比较不错友情提示,如下:                   怎么样,看起来比原始的dialo...
  • XiaoMu_Mu
  • XiaoMu_Mu
  • 2017-09-30 17:42
  • 130

自定义圆角矩形DIALOG出现四个棱角的背景色

最近在用DATA-BINDING来重构代码,发现之前的一个能用的自定义DIALOG现在出现了背景色,百思不得其解,应该是用了DATA BINDING后带来的问题如图: 最终解决方法是加上下面红色字体标注的一行即可 final AlertDialog dialog = new AlertDi...
  • bill_sha
  • bill_sha
  • 2016-05-10 11:23
  • 1582

android圆角矩形出现四个角黑点的解决方法

只要在布局对应的activity的oncreate方法的第一行加上 getWindow().setBackgroundDrawableResource(android.R.color.transparent); 即可解决该问题
  • u014600432
  • u014600432
  • 2014-11-27 14:59
  • 1301

Android 硬菜之圆角Dialog显示自定义布局(无棱角)

这几天很纳闷项目中要使用弹窗,但是 之前这个用过,但是没有做详细的笔记, 时间一久就忘了, 今天把这个问题有解决了. 开始使用的是alertdialog来显示自定义布局弹窗,但是有个问题, 就是当我给弹窗的布局设置shape圆角的时候整个弹窗会有自带的4个圆角,很不好, 货不多说,撸代码! 1.设置...
  • qq_33451004
  • qq_33451004
  • 2016-09-11 22:04
  • 519

android dialog的圆角不显示问题

//第一套代码 //控制代码 package com.myapp.mydialog; import com.myapp.myapptest.R; import android.app.Dialog; import android.content.Context; import android.o...
  • xiaoshixiu
  • xiaoshixiu
  • 2015-11-26 18:32
  • 524

android dialog圆角显示及解决出现的黑色棱角.(友情提示)

最近在开发一个天气预报的app,看到一个比较不错友情提示,如下:                   怎么样,看起来比原始的dialog好看吧.好了,做法也...
  • jj120522
  • jj120522
  • 2012-08-16 00:34
  • 8106

Android 以Dialog的方式显示Activity,并且处理背景四个角为圆角,去掉黑角

Android 以Dialog的方式显示Activity,并且处理背景四个角为圆角,去掉黑角
  • u010947098
  • u010947098
  • 2015-07-10 14:10
  • 2714

(转)Android dialog圆角显示及解决出现的黑色棱角.(友情提示)

原地址:http://blog.csdn.net/jj120522/article/details/7871289 最近在开发一个天气预报的app,看到一个比较不错友情提示,如下:           ...
  • duyiqun
  • duyiqun
  • 2017-03-06 15:33
  • 124

Android中自定义圆角的Dialog

效果图: 核心代码: MainActivity中 public class MainActivity extends Activity { private Button btn; @Override protected void onCreate(Bundle s...
  • zhaihaohao1
  • zhaihaohao1
  • 2016-06-16 16:47
  • 6807
    个人资料
    • 访问:217483次
    • 积分:2727
    • 等级:
    • 排名:第15694名
    • 原创:24篇
    • 转载:263篇
    • 译文:0篇
    • 评论:25条
    文章分类
    最新评论