I am making a numeric keyboard. keyboard appearance
I have a problem with the decoration of the return button. If I use ImageButton, then I get an indent from the top, as in the picture:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- other buttons -->
<com.google.android.material.button.MaterialButton
android:id="@+id/btnPoint"
style="@style/KeypadButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="0dp"
android:padding="0dp"
android:text="."
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/btnNumber0"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/btnNumber1" />
<com.google.android.material.button.MaterialButton
android:id="@+id/btnNumber0"
style="@style/KeypadButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="0dp"
android:padding="0dp"
android:text="0"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/btnBackspace"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/btnPoint"
app:layout_constraintTop_toBottomOf="@+id/btnNumber2" />
<com.google.android.material.button.MaterialButton
android:id="@+id/btnBackspace"
style="@style/KeypadButton"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="0dp"
android:padding="0dp"
android:scaleType="center"
android:text=""
app:iconGravity="end"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/btnNumber0"
app:layout_constraintTop_toBottomOf="@+id/btnNumber3" />
</androidx.constraintlayout.widget.ConstraintLayout>
This is the style of the buttons
<!-- Keyboard -->
<style name="KeypadButton" parent="Widget.MaterialComponents.TextView">
<item name="android:textSize">@dimen/font_large_30</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">@color/swatch_7</item>
<item name="backgroundTint">@color/key_number</item>
<item name="android:background">@drawable/ripple_bg</item>
<item name="android:textAlignment">center</item>
<item name="android:gravity">center</item>
<item name="elevation">0dp</item>
</style>
If I inherit the ImageButton style, then I get padding around the button, which cannot be removed.
Please tell me how to properly design the backspace button.
Try replace
<style name="KeypadButton" parent="Widget.MaterialComponents.TextView">
to
<style name="KeypadButton" parent="Widget.MaterialComponents.Button">