SlideShare a Scribd company logo
1 of 33
Download to read offline
Butter Android Views
        김용욱
●   Overdraws
●   Hardware acceleration
●   Layers
●   ValueAnimators
●   ObjectAnimators with DisplayList properties
●   SurfaceView vs TextureView
About me
김용욱 (dalinaum)
http://goo.gl/EPCr0
안드로이드 GDE
Show GPU overdraws
UI 상의 불필요한 요소를 쉽
게 찾을 수 있습니다. (4.2+)

두개의 옵션을 활성화하십
시요.
Worst case
1x

                         2x
                              3x


●   blue: 1x (2회)
●   green: 2x
●   light red: 3x   4x

●   dark red: 4x

우리의 소원은 2x
왜 배경이 1x일까요?          1x

                      2x


● window 배경 1회             3x


● view 배경 1회
● 1 + 1 = 귀요미?
                 4x


꼭 윈도우 배경 제거
합시다.
android:                 1x

windowBackground         2x

@null                         3x




getWindow().
setBackgroundDraw   4x

able(null);

transparent를 하지
맙시다.
overdraw GPU 최적화?

Deferred rendering을 하면 여러번 안 그립니다.

대표적인 구현: SGX

Nvidia 테그라는 무조건 횟수만큼 그립니다.
하드웨어 가속
하드웨어 가속

android:hardwareAccelerated="true"

허니컴 이후 부터 사용 가능.

이후 암시적으로 활성화되지만 명시적인게 좋다
고 생각함.

일부 하드웨어가 암시적인 활성화를 무시하기
때문.
디스플레이 리스트
Layer
하드웨어 레이어:
● 캐쉬를 FBO에 저장.
  (FrameBufferObject)
● 한정된 영역.
● view.setLayerType
  (View.LAYER.
  HARDWARE, null)

소프트웨어 레이어:
● 비트맵 보관
● view.setLayerType
  (View.LAYER.
  SOFTWARE, null)
다양한 속성에 대한 에니메이션
                          linear




non-linear




ValueAnimator: View 이외에도 대부분의 속성에
대해 적용가능한 에니메이터 객체. (HC 11)
ValueAnimator va = ValueAnimator.ofInt(0, height);
  va.setDuration(700);
  va.addUpdateListener(new ValueAnimator.AnimatorUpdateListener()
{
      public void onAnimationUpdate(ValueAnimator animation) {
        Integer value = (Integer) animation.getAnimatedValue();
        v.getLayoutParams().height = value.intValue();
        v.requestLayout();
      }
  });
에니메이션을 빠르게 하는 방법은 없나
요? (JB)
에니메이션을 빠르게 하는 방법은 없나
    요? (JB)
객체의 프로퍼티
에 대한 디스플레
이 리스트가 확
장.
(DLProps)

●   alpha
●   translationX/Y
●   scaleX/Y
●   rotationX/YViewPropertyAnimator(HC 12), ObjectAnimator (HC 11)
ObjectAnimator

ObjectAnimator.ofFloat(myObject,
"alpha", 0f).start();

객체의 named property에 대한 에니메
이션.
ViewPropertyAnimator

myView.animate().alpha(0);

animatingButton.animate().
setDuration(2000);

(ObjectAnimator의 쉬운 방법)
SurfaceView's adventures in
Wonderland




API에서는 보이지만 회전, 확대, 알파 모든 것이
안됩니다.
SurfaceView (+GLSurfaceView)는 View 영역은
아래에 Surface가 보일 수 있도록 투명하게 합니
다.
(홀 펀칭)
대안: TextureView

뷰의 모든 기능을 사용가능.

GLSurfaceView등의 확장이 없기 때문에 스스로
만들어 써야 함.

3D 그래픽을 하는 것만 조금 까다로움. (기본 코
드가 없음.)

젤리빈 이상만 가능.
OpenGL
TextureView Demo
https://github.com/dalinaum/TextureViewDemo
https://play.google.com/store/apps/details?
id=kr.gdg.android.textureview
감사합니다.

More Related Content

What's hot

Introduction to DirectX 12 Programming , Ver 1.5
Introduction to DirectX 12 Programming , Ver 1.5Introduction to DirectX 12 Programming , Ver 1.5
Introduction to DirectX 12 Programming , Ver 1.5YEONG-CHEON YOU
 
[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법
[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법
[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법강 민우
 
빠른 렌더링을 위한 오브젝트 제외 기술
빠른 렌더링을 위한 오브젝트 제외 기술빠른 렌더링을 위한 오브젝트 제외 기술
빠른 렌더링을 위한 오브젝트 제외 기술YEONG-CHEON YOU
 
Html5 canvas animation
Html5 canvas animationHtml5 canvas animation
Html5 canvas animationSangHun Lee
 
멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)Bongseok Cho
 

What's hot (6)

Introduction to DirectX 12 Programming , Ver 1.5
Introduction to DirectX 12 Programming , Ver 1.5Introduction to DirectX 12 Programming , Ver 1.5
Introduction to DirectX 12 Programming , Ver 1.5
 
[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법
[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법
[IGC2018] 유영천 개발자 - Voxel기반 네트워크 게임 최적화기법
 
빠른 렌더링을 위한 오브젝트 제외 기술
빠른 렌더링을 위한 오브젝트 제외 기술빠른 렌더링을 위한 오브젝트 제외 기술
빠른 렌더링을 위한 오브젝트 제외 기술
 
Open gl
Open glOpen gl
Open gl
 
Html5 canvas animation
Html5 canvas animationHtml5 canvas animation
Html5 canvas animation
 
멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)멀티스레드 렌더링 (Multithreaded rendering)
멀티스레드 렌더링 (Multithreaded rendering)
 

Viewers also liked

Viewers also liked (20)

[1D6]RE-view of Android L developer PRE-view
[1D6]RE-view of Android L developer PRE-view[1D6]RE-view of Android L developer PRE-view
[1D6]RE-view of Android L developer PRE-view
 
A brief guide to android gradle
A brief guide to android gradleA brief guide to android gradle
A brief guide to android gradle
 
Anatomy of an android
Anatomy of an androidAnatomy of an android
Anatomy of an android
 
The Git - (#1/2)
The Git - (#1/2)The Git - (#1/2)
The Git - (#1/2)
 
Realm Java
Realm JavaRealm Java
Realm Java
 
Tensorflow 101
Tensorflow 101Tensorflow 101
Tensorflow 101
 
Actionbar and fragment
Actionbar and fragmentActionbar and fragment
Actionbar and fragment
 
C++ 미정의 행동(undefined behavior)
C++ 미정의 행동(undefined behavior)C++ 미정의 행동(undefined behavior)
C++ 미정의 행동(undefined behavior)
 
[0602 박민근] Direct2D
[0602 박민근] Direct2D[0602 박민근] Direct2D
[0602 박민근] Direct2D
 
3D Graphics 101
3D Graphics 1013D Graphics 101
3D Graphics 101
 
좋은 뷰, 나쁜 뷰, 이상한 뷰
좋은 뷰, 나쁜 뷰, 이상한 뷰좋은 뷰, 나쁜 뷰, 이상한 뷰
좋은 뷰, 나쁜 뷰, 이상한 뷰
 
C++ stl
C++ stlC++ stl
C++ stl
 
Modern android
Modern androidModern android
Modern android
 
Realm과 RxJava
Realm과 RxJavaRealm과 RxJava
Realm과 RxJava
 
A brief introduction to Realm with Kotlin
A brief introduction to Realm with KotlinA brief introduction to Realm with Kotlin
A brief introduction to Realm with Kotlin
 
EventBus for Android
EventBus for AndroidEventBus for Android
EventBus for Android
 
Guava’s Event Bus
Guava’s Event BusGuava’s Event Bus
Guava’s Event Bus
 
PublishSubject
PublishSubjectPublishSubject
PublishSubject
 
Realm: 초고속 데이터베이스
Realm: 초고속 데이터베이스Realm: 초고속 데이터베이스
Realm: 초고속 데이터베이스
 
오픈 소스로 취업하기: 나는 어떻게 오픈 소스를 하다 렘 개발자가 되었나?
오픈 소스로 취업하기: 나는 어떻게 오픈 소스를 하다 렘 개발자가 되었나?오픈 소스로 취업하기: 나는 어떻게 오픈 소스를 하다 렘 개발자가 되었나?
오픈 소스로 취업하기: 나는 어떻게 오픈 소스를 하다 렘 개발자가 되었나?
 

Similar to Butter android views

[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기
[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기
[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기현철 조
 
2015.12.10 defferd renderring_
2015.12.10 defferd renderring_2015.12.10 defferd renderring_
2015.12.10 defferd renderring_재현 최
 
Tips and experience_of_dx12_engine_development._ver_1.2
Tips and experience_of_dx12_engine_development._ver_1.2Tips and experience_of_dx12_engine_development._ver_1.2
Tips and experience_of_dx12_engine_development._ver_1.2YEONG-CHEON YOU
 
[0326 박민근] deferred shading
[0326 박민근] deferred shading[0326 박민근] deferred shading
[0326 박민근] deferred shadingMinGeun Park
 
[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shading[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shadingMinGeun Park
 
NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기
NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기
NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기Jaeseung Ha
 
Modern gpu optimize blog
Modern gpu optimize blogModern gpu optimize blog
Modern gpu optimize blogozlael ozlael
 
NDC11_김성익_슈퍼클래스
NDC11_김성익_슈퍼클래스NDC11_김성익_슈퍼클래스
NDC11_김성익_슈퍼클래스Sungik Kim
 
온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기Seungjae Lee
 
Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유
Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유
Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유Sang Seok Lim
 
120513 unity3 d_start_skyseer
120513 unity3 d_start_skyseer120513 unity3 d_start_skyseer
120513 unity3 d_start_skyseerChan-hyun Park
 
[225]yarn 기반의 deep learning application cluster 구축 김제민
[225]yarn 기반의 deep learning application cluster 구축 김제민[225]yarn 기반의 deep learning application cluster 구축 김제민
[225]yarn 기반의 deep learning application cluster 구축 김제민NAVER D2
 
소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안
소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안
소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안Jeongsang Baek
 
[KGC2014] DX9에서DX11로의이행경험공유
[KGC2014] DX9에서DX11로의이행경험공유[KGC2014] DX9에서DX11로의이행경험공유
[KGC2014] DX9에서DX11로의이행경험공유Hwan Min
 
Bs webgl소모임001 uniform버전
Bs webgl소모임001 uniform버전Bs webgl소모임001 uniform버전
Bs webgl소모임001 uniform버전Seonki Paik
 
박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기
박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기
박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기Kiheon Park
 
Advanced nGrinder
Advanced nGrinderAdvanced nGrinder
Advanced nGrinderJunHo Yoon
 
20131217 html5
20131217 html520131217 html5
20131217 html5DK Lee
 
게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal
게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal
게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for UnrealKyu-sung Choi
 

Similar to Butter android views (20)

[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기
[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기
[NDC17] Unreal.js - 자바스크립트로 쉽고 빠른 UE4 개발하기
 
2015.12.10 defferd renderring_
2015.12.10 defferd renderring_2015.12.10 defferd renderring_
2015.12.10 defferd renderring_
 
Tips and experience_of_dx12_engine_development._ver_1.2
Tips and experience_of_dx12_engine_development._ver_1.2Tips and experience_of_dx12_engine_development._ver_1.2
Tips and experience_of_dx12_engine_development._ver_1.2
 
[0326 박민근] deferred shading
[0326 박민근] deferred shading[0326 박민근] deferred shading
[0326 박민근] deferred shading
 
[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shading[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shading
 
NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기
NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기
NDC 2017 하재승 NEXON ZERO (넥슨 제로) 점검없이 실시간으로 코드 수정 및 게임 정보 수집하기
 
Modern gpu optimize blog
Modern gpu optimize blogModern gpu optimize blog
Modern gpu optimize blog
 
Modern gpu optimize
Modern gpu optimizeModern gpu optimize
Modern gpu optimize
 
NDC11_김성익_슈퍼클래스
NDC11_김성익_슈퍼클래스NDC11_김성익_슈퍼클래스
NDC11_김성익_슈퍼클래스
 
온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기온라인 게임 처음부터 끝까지 동적언어로 만들기
온라인 게임 처음부터 끝까지 동적언어로 만들기
 
Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유
Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유
Angularjs, ionic, cordova 기반 syrup store app 개발 사례 공유
 
120513 unity3 d_start_skyseer
120513 unity3 d_start_skyseer120513 unity3 d_start_skyseer
120513 unity3 d_start_skyseer
 
[225]yarn 기반의 deep learning application cluster 구축 김제민
[225]yarn 기반의 deep learning application cluster 구축 김제민[225]yarn 기반의 deep learning application cluster 구축 김제민
[225]yarn 기반의 deep learning application cluster 구축 김제민
 
소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안
소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안
소셜게임 서버 개발 관점에서 본 Node.js의 장단점과 대안
 
[KGC2014] DX9에서DX11로의이행경험공유
[KGC2014] DX9에서DX11로의이행경험공유[KGC2014] DX9에서DX11로의이행경험공유
[KGC2014] DX9에서DX11로의이행경험공유
 
Bs webgl소모임001 uniform버전
Bs webgl소모임001 uniform버전Bs webgl소모임001 uniform버전
Bs webgl소모임001 uniform버전
 
박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기
박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기
박기헌 NDC12 초보 클라이언트 프로그래머의 병렬 프로그래밍 도전기
 
Advanced nGrinder
Advanced nGrinderAdvanced nGrinder
Advanced nGrinder
 
20131217 html5
20131217 html520131217 html5
20131217 html5
 
게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal
게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal
게임엔진과 공간정보 3D 콘텐츠 융합 : Cesium for Unreal
 

More from Leonardo YongUk Kim

Kotlin 2.0을 통해 알아보는 코틀린의 미래
Kotlin 2.0을 통해 알아보는 코틀린의 미래Kotlin 2.0을 통해 알아보는 코틀린의 미래
Kotlin 2.0을 통해 알아보는 코틀린의 미래Leonardo YongUk Kim
 
안드로이드 빌드: 설탕없는 세계
안드로이드 빌드: 설탕없는 세계안드로이드 빌드: 설탕없는 세계
안드로이드 빌드: 설탕없는 세계Leonardo YongUk Kim
 
Realm은 어떻게 효율적인 데이터베이스를 만들었나?
Realm은 어떻게 효율적인 데이터베이스를 만들었나?Realm은 어떻게 효율적인 데이터베이스를 만들었나?
Realm은 어떻게 효율적인 데이터베이스를 만들었나?Leonardo YongUk Kim
 
MVC부터 MVVM, 단방향 데이터 흐름까지
MVC부터 MVVM, 단방향 데이터 흐름까지MVC부터 MVVM, 단방향 데이터 흐름까지
MVC부터 MVVM, 단방향 데이터 흐름까지Leonardo YongUk Kim
 
Veni, Vide, Built: Android Gradle Plugin
Veni, Vide, Built: Android Gradle PluginVeni, Vide, Built: Android Gradle Plugin
Veni, Vide, Built: Android Gradle PluginLeonardo YongUk Kim
 
GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)
GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)
GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)Leonardo YongUk Kim
 

More from Leonardo YongUk Kim (13)

Compose Multiplatform 101
Compose Multiplatform 101Compose Multiplatform 101
Compose Multiplatform 101
 
Kotlin 2.0을 통해 알아보는 코틀린의 미래
Kotlin 2.0을 통해 알아보는 코틀린의 미래Kotlin 2.0을 통해 알아보는 코틀린의 미래
Kotlin 2.0을 통해 알아보는 코틀린의 미래
 
안드로이드 빌드: 설탕없는 세계
안드로이드 빌드: 설탕없는 세계안드로이드 빌드: 설탕없는 세계
안드로이드 빌드: 설탕없는 세계
 
Realm은 어떻게 효율적인 데이터베이스를 만들었나?
Realm은 어떻게 효율적인 데이터베이스를 만들었나?Realm은 어떻게 효율적인 데이터베이스를 만들었나?
Realm은 어떻게 효율적인 데이터베이스를 만들었나?
 
MVC부터 MVVM, 단방향 데이터 흐름까지
MVC부터 MVVM, 단방향 데이터 흐름까지MVC부터 MVVM, 단방향 데이터 흐름까지
MVC부터 MVVM, 단방향 데이터 흐름까지
 
Anatomy of Realm
Anatomy of RealmAnatomy of Realm
Anatomy of Realm
 
역시 Redux
역시 Redux역시 Redux
역시 Redux
 
React Everywhere
React EverywhereReact Everywhere
React Everywhere
 
React Redux React Native
React Redux React NativeReact Redux React Native
React Redux React Native
 
Veni, Vide, Built: Android Gradle Plugin
Veni, Vide, Built: Android Gradle PluginVeni, Vide, Built: Android Gradle Plugin
Veni, Vide, Built: Android Gradle Plugin
 
The git
The gitThe git
The git
 
GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)
GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)
GIt 마을로 이주하기 (Git -> Svn, svn-all-fast-export)
 
red black tree
red black treered black tree
red black tree
 

Butter android views