Android Tutorial
Software Setup and Configuration
Android Studio
File Structure
Components
Core Topics
Layout
View
Button
Intent and Intent Filters
Toast
RecyclerView
Fragments
Adapters
Other UI Component
Image Loading Libraries
Date and Time
Material Design
Bars
Working with Google Maps
Chart
Animation
Database
Advance Android
Jetpack
Architecture
App Publish
App Monetization
Creating customized buttons with different shapes and colors in Android involves defining custom XML drawable resources for the button's background. Here's a step-by-step guide to achieving this:
Custom Button Background:
Create a new XML drawable resource for your button. Go to the res/drawable
directory in your project, right-click, then select New
> Drawable resource file
. Name it something like custom_button.xml
.
In this custom_button.xml
, you can define various shapes and states for your button:
<!-- A rounded rectangle button --> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Pressed state --> <item android:state_pressed="true"> <shape android:shape="rectangle"> <solid android:color="#ff5722" /> <corners android:radius="8dp" /> </shape> </item> <!-- Default state --> <item> <shape android:shape="rectangle"> <solid android:color="#ff9800" /> <corners android:radius="8dp" /> </shape> </item> </selector>
The above drawable will create a button with rounded corners. The button will be of color #ff9800
by default, but will change to color #ff5722
when pressed.
Using Custom Background:
Apply this background to your button in your layout XML:
<Button android:id="@+id/myCustomButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Custom Button" android:background="@drawable/custom_button"/>
Here, the android:background
attribute is set to the custom drawable we created earlier.
Customizing Button Text:
You can also customize the text appearance of the button by using attributes like android:textColor
, android:textSize
, and android:textStyle
:
<Button ... android:textColor="#ffffff" android:textSize="18sp" android:textStyle="bold"/>
Custom Shapes:
In the drawable XML (custom_button.xml
), the shape
tag has an attribute called android:shape
. This attribute can take values such as rectangle
, oval
, line
, and ring
. This allows you to create buttons of different shapes.
Adding Border:
If you want a border around your button, you can add the stroke
tag inside the shape
tag:
<shape android:shape="rectangle"> ... <stroke android:width="2dp" android:color="#ffffff" /> </shape>
Button Shadows:
For shadows, the elevation
attribute (for API 21 and above) can be used directly on the Button
view in the layout XML:
<Button ... android:elevation="4dp"/>
Note: If you're using CardView
, it has built-in elevation and shadow controls.
By following the steps above, you can create customized buttons of various shapes, colors, and styles for your Android application.
Create custom-shaped buttons in Android Studio:
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/custom_button_shape" android:text="Custom Button"/>
Designing customized buttons with different colors in Android:
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/custom_button_color" android:text="Colored Button"/>
How to make rounded buttons in Android with custom colors:
<Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/rounded_button_background" android:text="Rounded Button"/>