Android Demo --- how to extract the Button + rounded avatar of a rounded corner

Source: Internet
Author: User

Android Demo --- how to extract the Button + rounded avatar of a rounded corner

Friends who often play apps know that there are many buttons on the App that are rounded. The circle is full and tense, I don't know if the partner who designs the rounded corner button has the same idea as xiaobian '(* ← _ ← *)'. Listen to the partner who developed IOS by xiaobian, they directly have a button with rounded corners, but it is different for the Android Developers. There is no direct rounded button for us to use. A button is placed in xml, but not rounded, what should we do, nie? The method is always more difficult, and we have another opportunity to grow. Recently, in the small series project, we need to use the button of the rounded corner and the avatar of the rounded corner. After half a day, finally, it is rounded. Happy ing is shown as follows, but the displayed user center is an image instead of an imageview. In this blog post today, I will briefly introduce how to break the Button of the rounded corner and the avatar of the rounded corner. I will first introduce how to break the avatar of the rounded corner, as shown below:

In this blog post today, I made a small Android demo on how to create a rounded corner. I hope it can help some users who need it. First, create an Android project. In the drawable_xhdpi file, create an Android xml file named fillet, as shown in:

Next, we start to write the xml in fillet. The Code is as follows:

 

  
      
       
       
        
        
          
     
     
    
   
  
  

 

Step 3: Compile the activity_main.xml file in layout. The Code is as follows:

 

  
    
   
     
   
   
  
 

Step 4: Write the styles. xml content in the values file. The specific code is as follows:

 

     
  
      
  
       
  
   Settings
  
 

Step 5: Write the content in the FillButtonActivity. java class. The Code is as follows:

Package com. example. filletbutton; import android. app. activity; import android. OS. bundle; import android. view. view; import android. view. view. onClickListener; import android. widget. button; import android. widget. toast; public class FilletButtonActivity extends Activity {Button FilletButton; @ Override public void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); setContentView (R. layout. activity_main); FilletButton = (Button) findViewById (R. id. filletButton); // use the Anonymous class to register the Button event FilletButton. setOnClickListener (new OnClickListener () {public void onClick (View v) {Toast. makeText (FilletButtonActivity. this, you clicked the rounded corner button, Toast. LENGTH_LONG ). show ();}});}}

Finally, let's take a look at the running effect, as shown in:

 


After introducing how to click the Button of the rounded corner, let's take a look at how to tap the avatar of the rounded corner. First, let's compile the layout code in xml, the Code is as follows:

 

 
 
  
<Framelayout android: background = "@ drawable/us" android: layout_height = "135dp" android: layout_width = "match_parent"> <framelayout android: layout_height = "44dp" android: layout_width = "match_parent">
               
                
            
   
  </Framelayout>
           
           
       
   
  </Framelayout>
 
Next, let's write the code in the java class. The Code is as follows:

 

 

package com.h8.imageroundcorner;import android.app.Activity;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.PorterDuffXfermode;import android.graphics.Rect;import android.graphics.RectF;import android.graphics.Bitmap.Config;import android.graphics.PorterDuff.Mode;import android.os.Bundle;import android.widget.ImageView;public class TestActivity extends Activity {ImageView imageView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.test);imageView = (ImageView) findViewById(R.id.imageView2);Bitmap b = BitmapFactory.decodeResource(getResources(), R.drawable.my);imageView.setImageBitmap(toRoundCorner(b,100));}public static Bitmap toRoundCorner(Bitmap bitmap, int pixels) {Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Config.ARGB_8888);Canvas canvas = new Canvas(output);final int color = 0xff424242;final Paint paint = new Paint();final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());final RectF rectF = new RectF(rect);final float roundPx = pixels;paint.setAntiAlias(true);canvas.drawARGB(0, 0, 0, 0);paint.setColor(color);canvas.drawRoundRect(rectF, roundPx, roundPx, paint);paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));canvas.drawBitmap(bitmap, rect, rect, paint);return output;}}
Finally, let's take a look:

 


Note:This blog post briefly introduces how to create a Button with rounded corners in Android applications. And how to create a rounded avatar, or that sentence for small editors, is both a challenge and an opportunity, because the knowledge is the same. Furthermore, in the small series program life, it leaves the most precious memories. Although later mini series may not be engaged in the android industry, there are many kinds of things in the Code world, some are sweet, some are warm, some are easy to sing, and some are endless, in these stories, the only thing we have in common is that a year, a month, and a period of time, I love you very much! Love you-during this internship, Android has brought various surprises to xiaobian.

 

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.