Home > Android > Customize button in Android

Customize button in Android


hi!!
You can change the appearance of button in android like make the corners of button rounded etc…

button_shape.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape      xmlns:android="http://schemas.android.com/apk/res/android"
            android:shape="rectangle">
    
    <solid   android:color="#EAEAEA"/>
    
    <corners    android:bottomLeftRadius="8dip"
                android:topRightRadius="8dip"
                android:topLeftRadius="1dip"
                android:bottomRightRadius="1dip"
                />
</shape>

here you can change the radius of corners

you can use this button_shape in your button’s code as

android:background=”@drawable/button_shape”

here’s the code

main.xml

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent">

    <TextView   android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="Hello Android from NetBeans"/>

    <Button android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Nishant Nair"
            android:padding="5dip"
            android:layout_gravity="center"
            android:background="@drawable/button_shape"
            />

</LinearLayout>

you can add an image to your button by using drawable

android:drawableTop=”@drawable/pdf”

in your button’s xml code

this will look like this

Enjoy.. πŸ˜‰ !!!!!!!

Categories: Android Tags: ,
  1. November 29, 2010 at 1:32 pm

    Hi friend,

    Thnx for such tutorial.
    Nice one.

  2. Marek
    December 20, 2010 at 2:43 pm

    Hello Nishant,

    itΒ΄s a nice tutorial πŸ™‚

    I still have a question: Is it also possible to make such buttons without xml, only using java code?

  3. December 28, 2010 at 6:56 am

    Sugoi neeeh!!! :DDDD
    I’ll definitely try this!!
    Arigato! πŸ˜€
    πŸ˜€

  4. March 26, 2011 at 5:09 am

    I’m looking for someway to change the timepicker to heightpicker. I want the look of timepicker to select ft and inches. I think the timepicker UI is perfect for this but struggling to change it for my needs. Can you help?

    • March 26, 2011 at 6:05 am

      Hi!
      I have not tried timepicker yet, so i can’t comment on that.
      Sorry.

      Let me know if you need any other help, I will try timepicker later on.

  5. Farhan
    April 14, 2011 at 7:10 pm

    Hey buddy, thanx for sharing this… i was wondering if you could write something about adding a shadow to a button…

  6. Imran
    June 19, 2011 at 11:10 pm

    Hi,

    Instead of radius can we clip it horizontally on the topLeft and the bottomLeft to look like a Android back button?

    • Brad
      June 23, 2011 at 7:20 pm

      A back button like the one in your link is what I’m looking for too. So far I accomplished this by using a 9patch png image. but would prefer to use a regular custom button to accomplish this.

    • July 13, 2011 at 6:08 am

      @Nishant nair: Nice tutorial man. It helped me a lot.

      @Imran: Good tip. It is useful in creating back button in our view.

      Thanks.

  7. JRC
    July 13, 2011 at 8:21 am

    Hello Nishant,

    Great article…

    I want to develop Knob type circular button, can you have pointers how to do it in android?

    Thanks,
    JRC

  8. Babu
    September 8, 2011 at 1:59 pm

    Nice Tutorial …

  9. November 22, 2011 at 4:54 pm

    This approach is way simpler than working with the Canvas object in Java. Thank you for the easy tutorial!

  10. January 1, 2012 at 5:58 am

    Where would I place my button_shape.xml file?

  11. Vinay
    January 9, 2012 at 5:21 am

    Hello Nishant,
    How to make it Clickable……where should we mention the states for the Button…..

  12. LiTTle
    January 22, 2012 at 5:57 pm

    Bottom left and right is like the opposite! The left side at the bottom is called “Bottom Right”! Why is this?

    • March 14, 2013 at 6:54 pm

      That’s a good question. It seems like this was fixed in the newer android versions.

  13. Kevin
    February 5, 2012 at 3:21 pm

    Give me an error …
    “Premature end of file”
    Please help

    • February 5, 2012 at 5:04 pm

      I never got such error. Can you check it again, closing all tags.

  14. Hennie
    February 5, 2012 at 4:01 pm

    Hi Nisant. It builds and runs but gives the force close message. Do you know why this can be? What am I missing?

    Here’s what I did in Netbeans:
    1. Create drawable folder in res folder.
    2. Create button_shape.xml file in the drawable folder.
    3. Copy first given code snippet to button_shape.xml
    3. Replaced code in main.xml with second given code snippet.
    4. Run.

    Thanks a million.

    • February 5, 2012 at 5:10 pm

      Hey Hennie, did you checked your logcat ?.

  15. Karthik
    February 14, 2012 at 4:41 pm

    Awesome..Thanks buddy.

  16. suresh
    February 24, 2012 at 6:30 am

    Thank u very much.

  17. Ricardo Amendoeira
    June 6, 2012 at 5:23 pm

    Thanks a lot man!! IΒ΄ve been looking for this for quite a while πŸ˜›

  18. sharannya
    June 25, 2012 at 7:23 am

    Thanks a lot

  19. August 15, 2012 at 10:39 am

    Hi
    It is very nice and useful topic
    Thanks

  20. June 20, 2013 at 10:38 am

    sir mujhe android linear layout me button ko charo tarf se round krna hai
    how

  21. Alessandro
    November 14, 2013 at 1:34 pm

    Fast and direct!
    Thanks! You Rock!

  22. Johng598
    May 15, 2014 at 9:45 pm

    Good writeup, I am normal visitor of ones blog, maintain up the excellent operate, and It’s going to be a regular visitor for a lengthy time. bdbkegdkbeeb

  23. Johng335
    May 15, 2014 at 9:45 pm

    Hey I am so excited I found your website, I really found you afccdefegdkf

  1. No trackbacks yet.

Leave a reply to Brad Cancel reply