ToolBunny LogoToolBunny
Back to Homepage
Android XML Button Generator

Design a custom button and get the XML for your Android app.

Button Properties
8dp
dp
16dp
8dp
Preview
My Button
Drawable XML (res/drawable/custom_button.xml)
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#3b82f6" />
    <corners android:radius="8dp" />
    <stroke
        android:width="2dp"
        android:color="#1e40af" />
    <padding
        android:left="16dp"
        android:top="8dp"
        android:right="16dp"
        android:bottom="8dp" />
</shape>
Layout XML
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="My Button"
    android:textColor="#FFFFFF"
    android:background="@drawable/custom_button" />
About This Tool

The Android XML Button Generator is a time-saving tool for mobile developers. It eliminates the need to write complex XML from scratch by providing an intuitive visual editor for creating custom button designs. Use the interactive controls to customize properties like background color, gradients, corner radius, borders, and padding. The tool provides a live preview of your button and instantly generates the necessary XML code for both the shape drawable and the Button widget, ready to be copied directly into your Android Studio project.

How to Use
  1. Use the controls on the left to customize your button's appearance.
  2. Adjust properties like "Button Text," "Text Color," "Background Color" (solid or gradient), "Corner Radius," and "Border."
  3. The live preview on the right will update in real-time to reflect your changes.
  4. Once you are satisfied with the design, copy the generated XML code from the two output boxes:
    • Drawable XML: Save this code as a new file in your project's `res/drawable/` folder (e.g., `custom_button.xml`).
    • Layout XML: Use this `<Button>` tag in your layout files and set its `android:background` attribute to reference the new drawable file you created (e.g., `android:background="@drawable/custom_button"`).