Post on 22-Jul-2015
TWORZENIE 3D GRAFIKI WANDROID
W OPARCIU O OPENGL ESby Artem Shubovych
TREŚĆ1. co to jest shadery2. co można zrobić przy użyciu shaderów3. jak działa stos renderingu4. użycie shaderów w Android5. sterowanie wyświetlieniem
DLACZEGO UŻYĆ OPENGL?tworzenie gieranimacjasystemy CADgraficzne przedstawienie informacji(dla fanatyków) zwiększenie prędkości zwykłej aplikacji
DLACZEGO UŻYĆ OPENGL?tworzenie gieranimacja
OPENGL PIPELINE1. przetwarzanie koordynat2. obliczenie oświetlenia3. aplikacja materialów
wykrywanie koloru każdego wierzhołku
4. aplikacja tekstur5. dopasowanie efektów
mgła, alpha test, depth test, pattern test, blending...
6. wyświetlenie na ekranie
EWOLUCJA PROGRAMISTY OPENGL
FIXED PIPELINEg l B e g i n ( G L _ P O L Y G O N ) ; g l C o l o r 3 f ( 0 , 1 , 0 ) ; g l V e r t e x 3 f ( - 1 , - 1 , 0 ) ; g l V e r t e x 3 f ( - 1 , 1 , 0 ) ; g l V e r t e x 3 f ( 1 , 1 , 0 ) ; g l V e r t e x 3 f ( 1 , - 1 , 0 ) ;g l E n d ( ) ;
DISPLAY LISTSG L u i n t i n d e x = g l G e n L i s t s ( 1 ) ;
g l N e w L i s t ( i n d e x , G L _ C O M P I L E ) ; g l B e g i n ( G L _ P O L Y G O N ) ; g l C o l o r 3 f ( 0 , 1 , 0 ) ; g l V e r t e x 3 f ( - 1 , - 1 , 0 ) ; g l V e r t e x 3 f ( - 1 , 1 , 0 ) ; g l V e r t e x 3 f ( 1 , 1 , 0 ) ; g l V e r t e x 3 f ( 1 , - 1 , 0 ) ; g l E n d ( ) ;g l E n d L i s t ( ) ;
/ / . . .
g l C a l l L i s t ( i n d e x ) ;
DRAWABLE ARRAYSG L f l o a t v e r t i c e s [ ] = { - 1 , - 1 , 0 , - 1 , 1 , 0 , 1 , 1 , 0 , 1 , - 1 , 0 } ;
g l E n a b l e C l i e n t S t a t e ( G L _ V E R T E X _ A R R A Y ) ;g l V e r t e x P o i n t e r ( 3 , G L _ F L O A T , 0 , v e r t i c e s ) ;g l D r a w A r r a y s ( G L _ P O L Y G O N S , 0 , 4 ) ;g l D i s a b l e C l i e n t S t a t e ( G L _ V E R T E X _ A R R A Y ) ;
VERTEX BUFFER OBJECTSG L f l o a t v e r t i c e s [ ] = { - 1 , - 1 , 0 , - 1 , 1 , 0 , 1 , 1 , 0 , 1 , - 1 , 0 } ;G L u i n t v b o I d ;
g l G e n B u f f e r s A R B ( 1 , & v b o I d ) ;g l B i n d B u f f e r A R B ( G L _ A R R A Y _ B U F F E R _ A R B , v b o I d ) ;g l B u f f e r D a t a A R B ( G L _ A R R A Y _ B U F F E R _ A R B , s i z e o f ( v e r t i c e s ) , v e r t i c e s , G L _ S T A T I C _ D R A W _ A R B ) ;
/ / . . .
g l B i n d B u f f e r A R B ( G L _ A R R A Y _ B U F F E R _ A R B , v b o I d ) ;g l E n a b l e C l i e n t S t a t e ( G L _ V E R T E X _ A R R A Y ) ;g l V e r t e x P o i n t e r ( 3 , G L _ F L O A T , 0 , 0 ) ;g l D r a w A r r a y s ( G L _ P O L Y G O N S , 0 , 1 2 ) ;g l D i s a b l e C l i e n t S t a t e ( G L _ V E R T E X _ A R R A Y ) ;g l B i n d B u f f e r A R B ( G L _ A R R A Y _ B U F F E R _ A R B , 0 ) ;
SHADER - CO TO JEST?krótki program komputerowy, (...), który w
grafice trójwymiarowej opisuje właściwościpikseli oraz wierzchołków.
TYPY SHADERÓWvertex shaderfragment shadershader program
UŻYCIE SHADERÓWW OPENGL
1. kompilacja wierzchołkowego shaderu2. kompilacja fragment'owego shaderu3. linkowanie programu4. przekazywanie wskazówników
o dane do programu5. przekazywanie danych do programu
KOMPILACJA SHADERÓWWIERZCHOŁKOWY SHADER
/ / k o m p i l u j e m y w i e r z c h o ł k o w y s h a d e rG L i n t c o m p i l e _ o k = G L _ F A L S E , l i n k _ o k = G L _ F A L S E , p r o g r a m ;G L u i n t v s = g l C r e a t e S h a d e r ( G L _ V E R T E X _ S H A D E R ) ;c o n s t c h a r * v s _ s o u r c e = " . . . " ;g l S h a d e r S o u r c e ( v s , 1 , & v s _ s o u r c e , N U L L ) ;g l C o m p i l e S h a d e r ( v s ) ;g l G e t S h a d e r i v ( v s , G L _ C O M P I L E _ S T A T U S , & c o m p i l e _ o k ) ;
KOMPILACJA SHADERÓWFRAGMENTOWY SHADER
/ / k o m p i l u j e m y f r a g m e n t o w y s h a d e rG L u i n t f s = g l C r e a t e S h a d e r ( G L _ F R A G M E N T _ S H A D E R ) ;c o n s t c h a r * f s _ s o u r c e = " . . . " ;g l S h a d e r S o u r c e ( f s , 1 , & f s _ s o u r c e , N U L L ) ;g l C o m p i l e S h a d e r ( f s ) ;g l G e t S h a d e r i v ( f s , G L _ C O M P I L E _ S T A T U S , & c o m p i l e _ o k ) ;
LINKING PROGRAMU/ / l i n k u j e m y p r o g r a mp r o g r a m = g l C r e a t e P r o g r a m ( ) ;g l A t t a c h S h a d e r ( p r o g r a m , v s ) ;g l A t t a c h S h a d e r ( p r o g r a m , f s ) ;g l L i n k P r o g r a m ( p r o g r a m ) ;g l G e t P r o g r a m i v ( p r o g r a m , G L _ L I N K _ S T A T U S , & l i n k _ o k ) ;
PRZEKAZYWANIE DANYCH DO PROGRAMU/ / z a c h o w u j e m y w s k a z ó w n i k o z m i e n n e j s h a d e r u w k l i e n t s k i m p r o g r a m uG L i n t a t t r i b u t e _ c o o r d 2 d ;c o n s t c h a r * a t t r i b u t e _ n a m e = " c o o r d 2 d " ;a t t r i b u t e _ c o o r d 2 d = g l G e t A t t r i b L o c a t i o n ( p r o g r a m , a t t r i b u t e _ n a m e ) ;
RENDERING Z UŻYCIEM SHADERU/ / p r e k a z u j e m y d a n e p r z e z w s k a z ó w n i k d o p r o g r a m u/ / j u ż n a e t a p u r e n d e r i n g u
g l U s e P r o g r a m ( p r o g r a m ) ;g l E n a b l e V e r t e x A t t r i b A r r a y ( a t t r i b u t e _ c o o r d 2 d ) ;g l V e r t e x A t t r i b P o i n t e r ( a t t r i b u t e _ c o o r d 2 d , / / c o p r z e k a z u j e m y d o p r o g r a m u 2 , / / i l e e l e m e n t ó w d l a k a ż d e j w i e r z c h ó w k i G L _ F L O A T , / / t y p k a ż d e g o e l e m e n t u G L _ F A L S E , / / u ż y c i e o f f s e t ó w 0 , / / o f f s e t v e r t i c e s / / w s k a z ó w n i k d o d a n y c h) ;
g l D r a w A r r a y s ( G L _ P O L Y G O N S , 0 , 4 ) ;g l D i s a b l e V e r t e x A t t r i b A r r a y ( a t t r i b u t e _ c o o r d 2 d ) ;
PRZEKAZYWANIE DANYCH DO SHADERU1. zachowywanie wskazównika do
atrybutu shaderu2. włączenie odpowiednego atrybutu3. wskazywanie adresu danych4. wyłączenie atrybutu
WEJŚCIE WIERZHOŁKOWEGO SHADERUmaterial(diffuse, specular, shininess...)
silnikowe(kamera, model, oświetlenie, tajmery...)
rendererowe(zdefiniowane przez użytkownika)
WYJŚCIE WIERZHOŁKOWEGO SHADERUpozycjarozmiar wierzhółkidługość do przycinania
WEJŚCIE FRAGMENTOWEGO SHADERUpozycjanormalenumer prymitywudługość do przycinaniainne
WYJŚCIE FRAGMENTOWEGO SHADERUidentyfikator materialupozycjanormalediffuse colorspecular colorgłębokośćinne
IDENTITY SHADERSVERTEX SHADER
u n i f o r m m a t 4 u _ M V P M a t r i x ;a t t r i b u t e v e c 4 a _ P o s i t i o n ;v o i d m a i n ( ){ g l _ P o s i t i o n = u _ M V P M a t r i x * a _ P o s i t i o n ;}
FRAGMENT SHADER
v a r y i n g v e c 4 v _ C o l o r ;v o i d m a i n ( ){ g l _ F r a g C o l o r [ 0 ] = 0 . 0 ; g l _ F r a g C o l o r [ 1 ] = 0 . 0 ; g l _ F r a g C o l o r [ 2 ] = 1 . 0 ;}
PIĘKNOŚĆ GRY KOMPUTEROWEJefekty nieba, wody, pogody, ognia, mgły, dymu...rzeźba terenumodele high poly
CO MOŻNA UTWORZYĆ DZIĘKI SHADERAM
OPENGL W ANDROIDTO TYLKO OPENGL ES
słabszy sprzęt → mniej możliwości
słabszy sprzęt → mniej efektów
słabszy sprzęt → mniej modele
słabszy sprzęt → mniej animacji
CZYM SIĘ RÓŻNIĄ OPENGL ORAZ OPENGL ES?
OPENGLobsługuje wielepodejść renderingu(fixed pipeline, displaylists, VBO, drawablearrays...)dowolne type danych
OPENGL EStylko VBOwyłącznie dane typówfixed-pointusunięty prymitywyrenderingowe
OPTYMIZACJI GIER W ANDROIDefekty nieba, wody, pogody, ognia, mgły, dymu...rzeźba terenumodele high poly
CO MOŻNA ZROBIĆ W OPENGL ES?
ZALETY OPENGL ESmożna zrobić grę trójwymiarowę dla mobilnych urządzeńszybke przepisanie kodu do OpenGLWebGL - jeszcze więcej przenośności!
WADY OPENGL ESzłożonośćmałe API
ZŁOŻONOŚĆ OPENGL ESwyświetlienie animacji MD2→500+ wierszów kodu!
BIBLIOTEKIJPCTLWJGLjMonkey
JAK ZACZĄĆ PRACOWAĆ Z OPENGL ES?
1. TWORZYMY POWIERZHNIĘ
2. USTALIMY RENDERER
3. DEFINUJEMY LOGIKĘ KIEROWANIA
PRZESUWANIE KAMERYmViewMatrix ← Matrix.setLookAtM(...)MVPMatrix ← mProjectionMatrix × mViewMatrixgl_Position = u_MVPMatrix * a_Position
u n i f o r m m a t 4 u _ M V P M a t r i x ;a t t r i b u t e v e c 4 a _ P o s i t i o n ;v o i d m a i n ( ){ g l _ P o s i t i o n = u _ M V P M a t r i x * a _ P o s i t i o n ;}
PRZESUWANIE MODELEsetIdentity(...)mMVPMatrix ← mViewMatrix × mModelMatrixmMVPMatrix ← mProjectionMatrix × mMVPMatrixgl_Position = u_MVPMatrix * a_Position
PRZYKŁAD - RUCH KAMERY
PRZYKŁAD - RUCH KAMERY
PRZYKŁAD - RUCH KAMERY
PRZYKŁAD - RUCH KAMERY
CZEGO TA PREZENTACJA NIE OGARNIA?użycie teksturanimacjaskomplikowane shadery
OSTREŻENIENIE PRÓBUJCIE TEGO W DOMU!
UŻYCIE BIBLIOTEK JEST PRZYCZYNĄ DŁUGOWIECZNOŚCI