Android dialog rounded corner display and resolution of black edges and corners (TIP)

Recently, I was developing a weather forecast app and saw a friendly reminder, as shown below:

How about it? It looks better than the original dialog. Well, there may be many practices. Let me introduce my practices,

First, I first thought of rewriting dialog. to customize a layout, reference shape. XML to achieve rounded corners.

 

Before that, I would like to explain: In the layout file we created, we will not encounter the following problem if we reference the shape as long as it is not the outermost layer. See the figure:

Looking at the four corners, we found that there were four black edges and corners. This certainly gave us unwanted results. How can I set them in the configuration file? I 've been depressed for a long time, I suddenly found that I had previously done dialog to show the effect of the image. After looking for an example, I did it. It seems that I am really not suitable for programming and trying to make money to do business. the answer seems to be incorrect. The solution is getwindow (). setbackgrounddrawable (New bitmapdrawable (); or getwindow (). setbackgrounddrawableresource (Android. r. color. transparent );
In this way, there will be no four black corners.

At this time, we solve the problem. You will find that when you set the background color of a layout in the middle in the configuration file, the rounded corner will be swallowed up, solution: we can set the padding color in the shape. For the middle part, we can set it in the layout file, because the center does not affect the rounded corner, so that the final effect is achieved. if someone wants to say, What should I do if I implement three colors and multiple colors? In fact, we can also separate shapes, right? It's just a bit of trouble, but it can certainly be implemented.

It seems that the effect is okay, but it is still being improved.

It's time to go to bed. Maybe I am talking about some nonsense, but I am stuck here three times and I don't know what I 've done. Write it down to deepen my memory.

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

The preceding section describes the implementation of custom dialog. The following is an example.

This is a view that I have developed in my current project, and the style has not been processed, so it is inevitable that it is a bit rough. (as for the reason: friends who have experience in developing small companies, you know .)

The implementation method can be fully implemented using the custom dialog above. however, the disadvantage of user-defined attributes is that you must integrate them into her parent view. because the environment variable context is used. maybe you can achieve good layering. there are also many interface operations involved here. similar to a mini activity. here we use another simple method:Change the style of the activity.

Customize a style in the style file.

  <style name="Theme.HalfScreen" parent="android:style/Theme.Dialog"></style>

Reference in activity:

 <activity            android:name=".MemberActivity"            android:screenOrientation="portrait"            android:theme="@style/Theme.HalfScreen" />

You can also reference the existing style without defining it. This is not the focus.

First, we need to define the view in XML: (here I copy the style. This looks more comfortable than a bunch of code .)

I don't know if you have noticed that she is surrounded by rounded corners. It is this rounded corner that adds a unique feature to the mini version of the activity. Below I will briefly describe the specific implementation:

First, you can customize a background XML file.

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

Very simple.

This is not complete, so we can only get the lower half is a rounded corner, and the upper half is not a rounded corner, because the upper part is an image. configuration files cannot be used here. We need to process the images in the Code squadron. purpose:The upper part of the image is rounded.

Code snippet:

/***** The image is rounded and the orientation is free. */public static final int all = 347120; public static final int Top = 547120; public static final int left = 647120; public static final int right = 747120; public static final int Bottom = 847120; public static bitmap fillet (INT type, Bitmap bitmap, int roundpx) {try {// Its principle is: first create a transparent bitmap canvas with the same size as the image // then draw an area of the desired shape on the canvas. // Post the source image. Final int width = bitmap. getwidth (); Final int Height = bitmap. getheight (); bitmap paintingboard = bitmap. createbitmap (width, height, config. argb_8888); canvas = new canvas (paintingboard); canvas. drawargb (color. transparent, color. transparent, color. transparent, color. transparent); Final paint = new paint (); paint. setantialias (true); paint. setcolor (color. black); If (Top = type) {cliptop (canvas, paint, roundpx, width, height);} else if (Left = type) {clipleft (canvas, paint, roundpx, width, height);} else if (Right = type) {clipright (canvas, paint, roundpx, width, height);} else if (Bottom = type) {clipbottom (canvas, paint, roundpx, width, height);} else {clipall (canvas, paint, roundpx, width, height);} paint. setxfermode (New porterduduxfermode (mode. src_in); // post graph final rect src = new rect (0, 0, width, height); Final rect DST = SRC; canvas. drawbitmap (bitmap, SRC, DST, paint); Return paintingboard;} catch (exception exp) {return bitmap;} Private Static void clipleft (final canvas, final paint, int offset, int width, int height) {final rect block = new rect (offset, 0, width, height); canvas. drawrect (Block, paint); Final rectf = new rectf (0, 0, offset * 2, height); canvas. drawroundrect (rectf, offset, offset, paint);} Private Static void clipright (final canvas, final paint, int offset, int width, int height) {final rect block = new rect (0, 0, width-offset, height); canvas. drawrect (Block, paint); Final rectf = new rectf (width-offset * 2, 0, width, height); canvas. drawroundrect (rectf, offset, offset, paint);} Private Static void cliptop (final canvas, final paint, int offset, int width, int height) {final rect block = new rect (0, offset, width, height); canvas. drawrect (Block, paint); Final rectf = new rectf (0, 0, width, offset * 2); canvas. drawroundrect (rectf, offset, offset, paint);} Private Static void clipbottom (final canvas, final paint, int offset, int width, int height) {final rect block = new rect (0, 0, width, height-offset); canvas. drawrect (Block, paint); Final rectf = new rectf (0, height-offset * 2, width, height); canvas. drawroundrect (rectf, offset, offset, paint);} Private Static void clipall (final canvas, final paint, int offset, int width, int height) {final rectf = new rectf (0, 0, width, height); canvas. drawroundrect (rectf, offset, offset, paint );}

First, declare that this code is copied by others. It is clearly written and I will use it directly.

Here you need to pay attention to a value roundpx. See the figure below (top rounded corner ).

Some friends may have understood that the white is our bottom rounded corner layout (Corner radians> bottom corner layout.). The solution is simple,You can make the image rounded corner radians smaller than the bottom rounded corner layout rounded corner, or to be more accurate, you can use PX as the unit to reference this size.