어떤 한 레이아웃을 따라 만들어보며 앱개발 공부를 하고 있는데 텍스트에 투명도가 설정이 되어 있었다.

투명도라할지라도 뒷배경에 텍스트색이 섞여있기에 눈에 보이는 색은 맞출수 있을 순 있겠다 싶어 비슷한 색으로 지정을 하려 했지만

생각해보니 뒷배경이 단색이 아닌 패턴이나 그라데이션이라면 얼렁뚱땅 비슷한 색으로 맞출 수 없겠다 싶었다.

그래서 구글링해보니 쉽게 방법을 찾을 수 있었다.

#색상기본지식

투명도 설정방법을 알아보기 전에 색상코드에 대해 간단한 기본지식을 알고 있으면 좋을 것 같다. (넘어가려면 클릭.)

[16진수]

색을 지정할때는 #RGB의 각 두자리의 16진수 조합으로 컬러고유의 값을 지정할 수 있다.

예를들어 #000000라고 한다면 R:00 G:00 B:00의 색조합인 것이다.

16진수라하면 0 1 2 3 4 5 6 7 8 9 A B C D E F 총16개로 이루어진 값으로 쉽게 말하면 10 11 12를 표현하기 위해 알파벳을 사용했다고 보면 된다.

[색상코드]

RGB의 각자리 숫자가 작을수록 각각의 색은 어두워지고, 클수록 밝아진다
#FFFFFF라면 흰색이, #000000이라면 검은색이 되는 것이다.

모든 RGB값이 같으면 무채색이 된다.
중간값인 #808080은 회색이 된다는 뜻이다.

그럼 3원색인 빨강,초록,파랑과 이를 혼합한 노랑,자홍,청록색의 색상코드는 무엇일까?
빨강은 RGB중 R의 값은 max, 이외의 값들은 가장작은값을 표현하면 된다. 이렇게 하면 빨강은 #FF0000, 초록은 #00FF00, 파랑은 #0000FF의 컬러코드를 가진다.

그럼 이젠 이들을 혼합해보자.
노랑은 빨강+초록의 조합이고, 자홍은 R+B, 청록은 G+B일 것이다.
그 결과 노랑:#FFFF00 / 자홍:#FF00FF / 청록:#00FFFF의 컬러코드를 가지고 있다.

이렇게 색상코드에 대해 알고 나면 색을 나타내는데 조금은 더 편리할거라 생각한다.
물론 현업에서는 디자이너에 의해 색상코드가 넘어올테지만...

#투명도 설정

아무튼 본격적으로 투명도를 적용하는 방법에 대해 알아보겠다.

사실 어려운것은 없다.

RGB값앞에 두자리 16진수를 포함하면 그게 투명도 설정의 끝이다.
검은색을 예로들면 검은색을 표현할때 #000000이라고 표현했다.
그럼 #00000000이면 투명도를 포함한 검은색표현을 한 것이다.

끝...이라면 너무 허무하니 투명도조절하는 방법도 알아보겠다.
사실 이 부분도 쉽게 유추할 수 있는 부분이다.
앞서 색상값을 조절하여 색을 변화시켰듯 투명도값을 변화하면 조절이 된다.
00~FF까지 조절이 가능하며 00에 가까워질수록 투명해지고 FF에 까워질수록 불투명해진다.
투명도 00이면 완전투명(투명도100%), FF는 완전불투명(투명도0%)이라는 소리다.