[Android/Kotlin] 버튼 Background 설정 시, 색상이 적용되지 않는 문제 해결 방법

728x90

❓ 문제 상황

EditText와 Button의 모양을 바꾸기 위해 res > drawble 폴더에 rounded_corner_rectangle.xml 파일을 생성해서 다음과 같은 코드를 작성했습니다.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
    android:thickness="0dp">
    <corners android:radius="8dp" />
    <padding
        android:bottom="5dp"
        android:left="35dp"
        android:right="35dp"
        android:top="5dp" />
    <size android:height="45dp"/>
</shape>

 

editText와 Button의 배경색은 다르게 지정할 것이므로 activity_main.xml 파일에서 EditText와 Button에 따로 지정해주었습니다. 위에서 만든 둥근 테두리를 적용하기 위해 android:background="@drawble/rounded_corner_rectangle" 을 사용하여 설정해주었습니다.

<EditText
    android:id="@+id/passwordEditText"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    android:background="@drawable/rounded_corner_rectangle"
    android:backgroundTint="@color/grey"
    android:hint="password"
    android:inputType="textPassword"
    android:singleLine="true"
    android:textSize="16sp"
    app:layout_constraintEnd_toEndOf="@id/loginImageView"
    app:layout_constraintStart_toStartOf="@id/loginImageView"
    app:layout_constraintTop_toBottomOf="@id/idEditText" />

<Button
    android:id="@+id/loginButton"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="30dp"
    android:background="@drawable/rounded_corner_rectangle"
    android:backgroundTint="@color/blue"
    android:text="LOGIN"
    android:textColor="@color/white"
    android:textStyle="bold"
    app:layout_constraintEnd_toEndOf="@id/loginImageView"
    app:layout_constraintStart_toStartOf="@id/loginImageView"
    app:layout_constraintTop_toBottomOf="@id/passwordEditText" />

EditText에서는 backgroundTint를 grey로 설정했을 때 정상적으로 변경이 되나, Button은 blue 색상이 적용되지 않는 문제가 발생했습니다.

 

 

💡 해결 방안

res > themes > themes.xml 파일로 갑니다. 여기서 Theme.MaterialComponents.DayNight라고 작성되어 있는 것을 보실 수 있습니다. 

<style name="Theme.2DoList" parent="Theme.MaterialComponents.DayNight.DarkActionBar">

 

MaterialComponents 부분을 AppCompat으로 변경하면 Button에 backgroundTint 색상이 제대로 적용되는 것을 확인할 수 있습니다.

<style name="Theme.2DoList" parent="Theme.AppCompat.DayNight.DarkActionBar">