'스크롤'에 해당되는 글 1건

  1. 리스트뷰 백그라운드의 최적화 (5)
리스트뷰 백그라운드의 최적화

리스트뷰는 안드로이드의 가장 많이 사용되는 위젯중의 하나입니다.
리스트뷰는 사용하기 쉽고 유연하며 매우 강력합니다.
가끔씩은 이해하기 어려울 때도 있죠.

리스트뷰의 가장 흔한 문제중의 하나는 리스트뷰의 백그라운드(배경)을 커스텀으로 제작할 때 발생합니다.
다른 안드로이드 위젯들처럼 리스트뷰의 백그라운드는 투명으로 아래의 그림에서 기본 배경색인 #FF191919, 
어두운 회색인 윈도우의 백그라운드를 리스트뷰를 통해 들여다 볼 수 있습니다. 추가적으로 리스트뷰는 
기본값으로 아래의 그림에서 볼 수 있듯이 가장자리에 Fading 효과를 주고 있습니다. 
아래의 그림에서 리스트뷰의 첫번째 아이템이 검은색으로 Fade 되는 것을 볼 수 있습니다.
이 기법이 사용됨으로서 리스트뷰의 내용물이 스크롤 되는 것을 보여줍니다.




위의 그림에서 보이는 Fade 효과는 Canvas.SaveLayerAlpha() 메서드와 Porter-duffDestination Out Blending mode.
메서드의 조합으로 실행됩니다.

하지만 안타깝게도 리스트뷰에 커스텀 백그라운드를 넣거나 윈도우의 백그라운드를 바꾸면 화면이 아래의 그림처럼
이상하게 변해버립니다. 아래의 두개의 스크린샷은 윈도우의 백그라운드를 바꾸면 어떤 일이 일어나는지 보여주고 있습니다.
왼쪽 스크린샷은 Default 값으로 설정했을 때 보여지는 화면이고 오른쪽 스크린샷은 리스트뷰를 스크롤했을때 보여지는 화면입니다.




이렇게 렌더링(화면이 출력되는 것)되는 이유는 안드로이드 프레임워크가 자동적으로 리스트뷰의 모든 인스턴스에 최적화를 실행하기 때문입니다.
앞에서 리스트뷰의 Fade 효과는 Porter-Duff blending mode를 사용해서 실행된다고 했는데 사실 이 메서드는 잘 동작하지만 실행하는데
리스트뷰가 Offscreen Bitmap(forescreen 말고 background의 비트맵 렌더링)의 일부분을 캡쳐해야하고 이 작업이 끝나면 추가적으로
Extra Blending(이 작업이 메모리로부터의 재호출을 필요로 합니다.)을 필요로 하기 때문에 비용이 높은 측면이 있습니다.

리스트뷰는 대개 단색을 배경으로 하기 때문에 이런 복잡한 과정을 거칠 이유가 없습니다.
이런 이유로 "Cache Color Hint"라는 최적화기법을 소개해 드립니다.
Cache color hint 기법은 윈도우의 배경색을 RGB컬러셋 기본값으로 정해놓은 것입니다.
안드로이드의 #191919색(어두운 회색)이 그런것입니다. RGB 컬러값이 정해지면 리스트뷰는(View 클래스의 파생)윈도우의 백그라운드를 단색으로 
설정할 것이라는 것을 알고 비용이 높은 saveLayerAlpha)()/Poretr-duff 메서드 대신에 단순한 그래디언트를 사용해 화면을 그립니다.
이 그래디언트는 완전 투명색부터 Cache color hint 값까지 지원합니다. 위의 그림에서 볼 수 있는 바와같이 리스트뷰의 마지막 리스트의
어두운 색의 그래디언트까지 지원합니다. 하지만 아직도 리스트뷰의 리스트가 스크롤이 될 때 왜 전체 리스트뷰가 검은색으로 변하는지 설명이 안됩니다.

이미 언급했듯이 리스트뷰는 다른 기본 위젯들과 마찬가지로 기본값으로 완전투명과 반투명속성을 가지고 있습니다.
이 말은 리스트뷰가 자식리스트(Children)를 다시 그릴때 자식리스트를 윈도우의 백그라운드의 색상과 혼합해야 한다는 뜻입니다.
다시 말하지만 다시 그리는 작업은 메모리로부터 재호출을 필요로 하므로 비용이 아주 높은 작업입니다.

스크롤 작업시에 그리기 성능을 끌어올리기 위해서 안드로이드 프레임워크는 Cache color hint 값을 재이용합니다.
이 값을 다시 이용함으로서 안드로이드는 각각의 자식(Child)에 hint값의 비트맵색상을 채워넣습니다. 리스트뷰는 이 비트맵이 투명하면서 혼합이 필요하지 않기 때문에
분할해서 채워넣습니다. 또한 기본값으로 백그라운드가 #191919 로 정해져 있기 때문에 리스트뷰를 스크롤 할 때 각각의 아이템의 백그라운드가 검은색으로 보이는 것입니다.

이 문제를 해결하려면 Cache color hint 최적화 옵션을 사용하지 않으면 됩니다.
백그라운드 배경색을 단색이 아닌 색을 넣고 싶다거나 hint 값을 적절한 단색값으로 넣고 싶을때 그렇게 합니다.
코드에서 할 수 있고 XML 속성으로도 설정할 수 있는데 코드로 설정하려면 setCacheColorHint(int) 메서드를 사용합니다.
XML 속성을 사용하려면 android:cacheColorHint 속성을 이용합니다. 최적화 옵션을 끄려면 투명색상인 #00000000 값을 이용하도록 합니다.
아래의 그림은 XML 레이아웃에서 android:cacheColorHint="#00000000" 속성을 이용한 화면입니다.




위 그림에서 볼 수 있듯이 윈도우의 백그라운드 색인 커스텀 나무 색상에 Fade 가 완벽하게 작동되는것을 볼 수 있습니다.
Cache color hint 기능의 특징은 이처럼 흥미로운데 왜냐하면 때때로 최적화 작업이 어떤 상황에서는 개발을 더 힘들게 할 수도 있기 때문입니다.
하지만 이번의 경우에는 기본적인 값의 수정이 복잡한 기능의 추가보다 더 낫다는 걸 보여줍니다.
저작자 표시 비영리 동일 조건 변경 허락
신고
크리에이티브 커먼즈 라이선스
Creative Commons License