Quick answer, you can probably get most of this done by using Material Button but if you can change your app theme or it doesn't work use AppCompatButton.
<androidx.appcompat.widget.AppCompatButton
style="@style/ButtonTextStyle.booking"
android:text="Book Home Visit"/>
in your values/styles.xml
:
<style name="ButtonTextStyle.booking">
<item name="android:layout_width">wrap_content</item>
<item name="android:minWidth">0dp</item> // padding doesn't work without minWidth and Height
<item name="android:layout_height">45dp</item> // can't really center the text vertically so either use wrap_content or use a height big enough for it to center properly
<item name="android:minHeight">0dp</item>
<item name="android:includeFontPadding">false</item> // remove font padding to center text vertically
<item name="android:lineSpacingExtra">0dp</item> // remove line spacing, probably doesn't need for single line item
<item name="android:paddingStart">18dp</item>
<item name="android:paddingEnd">18dp</item>
<item name="android:background">@drawable/bg_green_corner</item> // use this to change corner radius
<item name="android:textColor">@color/basic_white</item>
<item name="android:textSize">16sp</item>
<item name="android:textStyle">normal</item>
<item name="android:gravity">center</item>
<item name="android:lines">1</item>
<item name="android:textAllCaps">false</item>
</style>
and in your drawable/
create bg_green_corner.xml
:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="rectangle">
<corners android:radius="5dp"/>
<solid android:color="@color/fancy_blue"/>
</shape>
</item>
<!-- Put any image or anything here as the drawable -->
<item android:drawable="?attr/selectableItemBackground"/> // ripple effect
</layer-list>