안드로이드 스튜디오 하이라이트 색상(EditText, CheckBox) 수정 방법

sobal 2025. 3. 5. 16:51

안드로이드 앱을 개발하다 보면 EditText나 CheckBox에서 하이라이트가 안드로이드 스튜디오 특유의 보라색으로 되는 경우를 많이 보게 될 것이다. 하지만 대부분의 사람들은 이런 초짜 느낌나는 색을 자신의 앱에서 사용하기 꺼려할 것이다. 그렇다고 막상 색을 바꾸려니 생각보다는 쉽지 않은 느낌을 받았던 사람이 아마 적지 않을 거다. 나도 이참에 제대로 기억하고 넘어갈 겸 아래와 같이 정리해보았다.

안드로이드에서 EditText, CheckBox 등 일부 위젯이 포커스를 받거나 활성화될 때 나타나는 하이라이트 색상(기본 Accent/ControlActivated 색상) 은 앱의 테마(Theme) 또는 스타일(Style) 설정에 의해 결정된다. 즉, 해당 색상을 바꾸려면 테마 내 색상 속성을 재정의(override)하면 된다.
예를 들어, MaterialComponents 테마(또는 AppCompat 테마)를 사용하는 경우, 아래와 같이 colorControlActivated, colorControlHighlight (그리고 필요에 따라 colorAccent 또는 colorSecondary 등) 속성을 원하는 색상(예: 남색 #001F6B)으로 변경할 수 있다.

1) 테마 파일(styles.xml 또는 themes.xml)에서 색상 속성 수정

values/styles.xml 혹은 values/themes.xml 파일 내에서 테마를 정의하고 색상 속성을 오버라이드하는 방법.
원하는 색(예: 남색,#001F6B)을 지정하면, EditText의 밑줄, CheckBox의 체크 및 포커스 색상 등이 변경된다.

여기서 navy는 내가 임의로 만든 이름이니 자신이 원하는 다른 이름으로 작성해도 상관없다. 처음 @color/navy 를 추가하면 아직 color 파일에 코드를 추가하지 않았기 때문에 당연히 인식하지 못하니 당황하지 말자.

<!-- values/styles.xml -->

<resources>
    <!-- 앱 전체 테마(예: Theme.LottoMachine)에서 색상 override -->
    <style name="Theme.LottoMachine" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
        <!-- 기존 설정들... -->

        <!-- EditText, CheckBox 등에서 활성화(포커스/체크) 시 나타나는 하이라이트 색상 -->
        <item name="colorControlActivated">@color/navy</item>
        
        <!-- 일부 위젯(SeekBar, Switch 등)에서 터치 피드백 및 하이라이트 색상 -->
        <item name="colorControlHighlight">@color/navy</item>

        <!-- AppCompat 테마에서는 주로 이 속성이 강조 색상으로 쓰인다 -->
        <item name="colorAccent">@color/navy</item>

        <!-- MaterialComponents 사용 시에는 필요에 따라 colorSecondary, colorOnSecondary 등도 확인 -->
        <!-- 예: <item name="colorSecondary">@color/navy</item> -->
    </style>
</resources>

주의사항:

MaterialComponents 테마를 사용할 경우, 기존에 사용되던 colorAccent 대신 colorSecondary, colorOnSecondary, colorControlActivated 등의 속성이 영향을 줄 수 있으므로, 앱 전반의 디자인 가이드에 맞게 추가 조정이 필요할 수 있다.

AppCompat 기반의 테마에서는 colorAccent 가 주로 강조/포커스 색상으로 사용된다.

2) colors.xml에서 navy 색상(본인이 원하는 색상) 정의

이제 @color/navy로 참조할 색상을 직접 지정하려면, values/colors.xml 파일에 아래처럼 선언한다. 다시 말하자면 navy는 내가 정한 이름이라 그냥이 자신이 원하는 이름을 작성하면 된다.

<resources>
    <!-- 예시: 남색 (Navy) 정의 -->
    <color name="navy">#001F6B</color>
</resources>

처음 프로젝트를 생성할 때는 이미지와 같이 기본 색들이 생성되어있을 것이다.

3) 테마 적용 (AndroidManifest.xml 등)

이미 AndroidManifest.xml에서 android:theme="@style/Theme.LottoMachine" 로 지정되어 있다면, 위의 수정사항이 자동으로 반영된다.

<application
    android:name=".YourApp"
    android:allowBackup="true"
    android:theme="@style/Theme.LottoMachine"  <!-- 수정된 테마 적용 -->
    ... >
    <!-- ... -->
</application>

또한, 특정 액티비티나 프래그먼트에만 다른 테마를 적용하고 싶다면, 해당 컴포넌트의 manifest 속성이나 코드에서 별도의 테마 오버라이드를 적용할 수 있다.

4) 적용 결과 확인

위 설정 후 빌드하면 다음과 같이 적용되는지 확인할 수 있다.

EditText: 포커스 시 밑줄 색상이 변경됨
CheckBox: 클릭 시 체크 및 테두리 색상이 변경됨
RadioButton, Switch, SeekBar 등: 터치 시 활성화 피드백 색상이 변경됨

추가 정보

MaterialComponents vs. AppCompat:
MaterialComponents 테마를 사용하는 경우, 단순히 colorAccent 대신 다양한 색상 속성(예: colorSecondary, colorOnSecondary, colorControlActivated 등)을 함께 고려해야 한다. 공식 Material 디자인 가이드에서 최신 권장사항을 참고하는 것도 좋다.
커스텀 위젯 스타일:
만약 특정 위젯에 대해 보다 세밀한 색상 조정이 필요하다면, 해당 위젯에 대한 커스텀 스타일을 정의하거나 레이아웃 XML 내에서 android:backgroundTint 또는 android:buttonTint 등의 속성을 직접 설정할 수도 있다.
다크 모드 대응:
다크 모드를 지원하는 앱이라면, 다크/라이트 테마별로 별도의 색상 리소스를 정의하여 사용자 환경에 맞게 자동 전환되도록 설정할 수도 있다.

요약

styles.xml(또는 themes.xml) 에서 앱 테마에 colorControlActivated, colorControlHighlight, (또는 colorAccent/ colorSecondary 등)을 원하는 남색(@color/navy)으로 override
colors.xml 에서 남색 코드(예: #001F6B)를 정의
수정한 테마를 AndroidManifest.xml (또는 액티비티 단위) 에 적용
앱 실행 후 EditText, CheckBox 등의 위젯에서 변경된 하이라이트 색상을 확인

이와 같이 설정하면, 사용자가 설정 화면 등에서 숫자를 입력하거나 CheckBox를 클릭할 때 기존 기본 색상 대신 남색 하이라이트가 적용된다.