[Android/Kotlin] 버튼에 elevation 속성값을 지정했음에도 그림자가 안보일때

 

 

 

 

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="40dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/content_tv">

    <Button
        android:id="@+id/sign_btn"
        android:layout_width="180dp"
        android:layout_height="60dp"
        android:layout_marginStart="8dp"
        android:background="@drawable/button_radius_pink"
        android:text="Sign in"
        style="@style/Pink_button"
        android:textAllCaps="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/register_btn"
        app:layout_constraintStart_toStartOf="parent" />

    <Button
        android:id="@+id/register_btn"
        android:layout_width="180dp"
        android:layout_height="60dp"
        android:layout_marginEnd="8dp"
        android:background="@drawable/button_radius_gray"
        android:text="Register"
        android:textColor="#545151"
        android:textSize="20sp"
        android:textStyle="bold"
        android:elevation="8dp"
        android:textAllCaps="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/sign_btn" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

 
나는 이런식으로 버튼을 디자인했고, Register버튼에 그림자값을 적용해주고싶었다
그래서 elevation값을 적용했는데도 그림자 적용이 안됐다!!ㅜㅜㅜ
 
 
 
찾아보니깐 그림자가 생길공간이 없는 경우에 적용이 안된다고 한다
그림자 생길공간이 없었기 때문에 padding값을 8정도로줘서 공간을 만들어줬다

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="40dp"
    android:padding="8dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/content_tv">

    <Button
        android:id="@+id/sign_btn"
        android:layout_width="180dp"
        android:layout_height="60dp"
        android:layout_marginStart="8dp"
        android:background="@drawable/button_radius_pink"
        android:text="Sign in"
        style="@style/Pink_button"
        android:textAllCaps="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/register_btn"
        app:layout_constraintStart_toStartOf="parent" />

    <Button
        android:id="@+id/register_btn"
        android:layout_width="180dp"
        android:layout_height="60dp"
        android:layout_marginEnd="8dp"
        android:background="@drawable/button_radius_gray"
        android:text="Register"
        android:textColor="#545151"
        android:textSize="20sp"
        android:textStyle="bold"
        android:elevation="8dp"
        android:textAllCaps="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/sign_btn" />

</androidx.constraintlayout.widget.ConstraintLayout>

 
 
 
근데 이런식으로해도 아직도 안됐다...
부모 컴포넌트의 padding을 적용해줬기때문에 이에 의해서 그림자가 잘리는경우가 발생한다고한다
부모 컴포넌트에 android:clipToPadding="false" 이값을 적용해주면 잘 적용이되는것을 확인할 수 있다

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="40dp"
    android:padding="8dp"
    android:clipToPadding="false"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/content_tv">

    <Button
        android:id="@+id/sign_btn"
        android:layout_width="180dp"
        android:layout_height="60dp"
        android:layout_marginStart="8dp"
        android:background="@drawable/button_radius_pink"
        android:text="Sign in"
        style="@style/Pink_button"
        android:textAllCaps="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/register_btn"
        app:layout_constraintStart_toStartOf="parent" />

    <Button
        android:id="@+id/register_btn"
        android:layout_width="180dp"
        android:layout_height="60dp"
        android:layout_marginEnd="8dp"
        android:background="@drawable/button_radius_gray"
        android:text="Register"
        android:textColor="#545151"
        android:textSize="20sp"
        android:textStyle="bold"
        android:elevation="8dp"
        android:textAllCaps="false"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/sign_btn" />

</androidx.constraintlayout.widget.ConstraintLayout>

 

 
 
 

정리해보면 elevation을 적용했는데도 그림자가 적용이 안된다면??
1. 배경색이 있는지 확인!!
2. 그림자가 생길 공간이 있는지 확인!!
3. 부모 컴포넌트의 padding에 의해 그림자가 잘리진 않는지 확인!!

 
 
이렇게만 확인해주면 아마 거의 적용이 잘될것이다