대학교 졸업 후, 첫 직장에 다닌지 이제 딱 1개월 되었습니다. :)
아직 어떤 프로젝트가 있는 지, 어떤 기술 스택을 쓰고 있는지 파악하고 있는 중입니다.
그러던 중, 제게 눈에 띄는 점이 하나 보였습니다.
프로젝트 파일에서 styles.xml 파일에 theme에 대한 정의가 쓰여있었습니다.
응? 보통 테마에 대한 정의는 theme.xml 파일에 정의되지 않나?
이런 의문이 생겨 제가 학생 시절 만든 프로젝트는 어떤 구조로 되어있는지 찾아보았습니다.
제 첫 번째 안드로이드 협업 프로젝트였던 거꾸로 가계부 에서는 styles.xml과 theme.xml이 둘 다 정의되어 있었습니다.
또 그 이후에 진행된 O!TAKU 프로젝트에서는 theme.xml 만 정의되어 있었습니다.
왜 프로젝트마다 차이가 나는지 궁금해져 이에 대해 알아보기 시작했습니다.
styles.xml은 theme.xml의 구버전이다
찾아보니 가장 먼저 나온 말은 구글이 styles.xml에서 theme.xml로 이름을 바꿨다는 말이었습니다.
theme.xml로 넘어오면서 dark 모드 일때, 사용되는 theme.xml 따로 제공하면서 자동으로 dark-theme 이 적용될 수 있도록 하는 기능을 제공하였습니다.
저는 여기서 그렇다면 어떠한 관점에서 파일 이름이 변경되었는지 궁금해졌습니다.
theme vs style vs attr
Coggle로 만들었는데 이미지로 추출하면서 한글이 조금 깨졌습니다ㅜㅜ 문맥으로 읽어주세요
style
스타일은 어떤 한 위젯의 속성들을 지정해주기 위해 사용됩니다.
따라서 style은 view 속성과 resource가 서로 맵핑되어있습니다.
속성들은 <style> 태그 안에 <item> 태그로 지정되며, 여기에서 속성은 우리가 xml 레이아웃을 그릴 때 사용하는 속성들과 같습니다.
ex) layout_width, text, textsize ...
**적용될 수 없는 속성들은 무시되거나 의도대로 그려지지 않을 수 있습니다.
theme
테마는 스타일과 달리 앱 전반에 영향을 주는 속성들에 대해 정의하고 있습니다.
따라서 theme은 theme 속성과 resource가 서로 맵핑되어있습니다.
theme 속성이라고 하면 잘 이해가 안 되는데, 예를 들어 colorPrimary 처럼 앱 전반에 영향을 미치는 것을 theme 속성으로 이해하면 쉽습니다.
style과 가장 대비되는 차이점은 cascading 된다는 점입니다.
css를 배울 때 정말 많이 들어본 cascading은 상위 트리에 명시가 되면 하위 트리에도 영향을 준다는 의미입니다.
(반면 style은 적용된 그 위젯에만 영향을 줍니다.)
위에 알 수 있는 것은 style과 theme은 적용되는 범위도 다르고, 이를 사용하는 의도 또한 다르다는 것입니다.
브랜드의 대표 색이 바뀌어 UI를 수정해야 한다면 theme의 색상들을 수정해야 하고, 버튼의 디자인을 전체적으로 수정하고 싶다면 style에서 속성을 수정해야 합니다.
또 적용하는 방법도 다릅니다. 서로 같은 테그를 사용하고 있지만 theme은 android:theme 속성을 이용하여 적용되고, style은 android:style 속성을 이용합니다.
이를 공부하며 구글이 theme.xml로 이름을 바꾼 이유는 이 style과 theme이 작성되는 파일을 나눠 그 차이를 더 명확히 하기 위함이라고 생각이 들었습니다.
또한 복잡하게 여겨졌던 다크 모드 지원을 더 쉽게 하기 위해 이름에 수정이 있었다고 보여집니다.
attr
마지막으로 정리해본 개념은 attr 개념입니다.
처음 보는 것이라 어떤 곳에 쓰이는 지 궁금했습니다.
attr는 <declare-styleable> 태그와 <attr> 태그를 사용하여 정의되고, 보통 custom view에 속성을 추가하고자 할 때 사용됩니다.
<attr name="inputButtonBackground" format="reference" />attr로 지정한 속성은 java, kotlin 파일로 가져와 수정될 수 있습니다. xml 파일에서 속성이 지정될 수도 있습니다.
attr도 마찬가지로 안드로이드 기본 속성에 영향을 받습니다. 이를 없애기 위해서는 theme에서 수정을 하는 등의 추가 작업이 필요합니다.
이번 개념 정리를 통해 xml의 각 태그가 이 어떤 의미를 가지며 작동되는지를 깊이 알 수 있었습니다.
효율적인 UI 작성을 위해 style, theme, attr를 적절히 사용하고자 노력해야 할 것 같습니다.
