Book Reader Implementation Notes with Android ViewPager 2016

by FUJI Goro

Slide 1

Slide 1 text

ಡॻը໘࣮૷ͷࣄ݅฽ ~ Android ViewPagerฤ ~ 2016/4/15 ిࢠॻ੶ษڧձ FUJI Goro (gfx)

Slide 2

Slide 2 text

ࣗݾ঺հ

Slide 3

Slide 3 text

ࢀর࣮૷ • ͜ͷࢿྉͷࢀর࣮૷͸ҎԼʹ͋Γ·͢ • https://github.com/gfx/TinyPdfReader • ίΞϩδοΫ͸200ߦ͘Β͍ • DeploygateͰAPKΛ഑৴͍ͯ͠·͢ • https://dply.me/xntdx6

Slide 4

Slide 4 text

ViewPagerجૅ஌ࣝ • AOSPͷҰ෦ (support library) • εϫΠϓͰࠨӈʹҠಈ͢ΔViewGroup • λϒҰൠɺಡॻը໘ͳͲʹ࢖͏ • ϖʔδͷਐΉํ޲͸LTR(left-to-right)

Slide 5

Slide 5 text

ϑΝΠϧ#1 ϖʔδૹΓ͕΋ͬ͞Γ͢Δ

Slide 6

Slide 6 text

ϖʔδૹΓ͕஗͍ • ʮBookʯʢࠓճ͸PDFʣ͔Β1ϖʔδऔΓग़ ͯ͠bitmapΛੜ੒͢Δͷʹ100 ~ 300sec͔͔ Δ • ͢΂ͯUIεϨουͰॲཧ͢ΔͱɺϖʔδૹΓ Ͱʮࢦ͕Ҿ͔͔ͬΔʯײ͕͢͡Δ

Slide 7

Slide 7 text

ViewPagerͷ࣮૷ • ViewPager͸ɺʮݱࡏͷϖʔδʯͱʮલޙͷ ϖʔδʯͷ3ϖʔδ෼ͷviewΛߏங͢Δ • ʮ࣍ͷϖʔδʯʹҠಈ͢Δલʹͦͷ࣍ͷϖʔ δͷviewΛߏங͢ΔͷͰɺͦ͜Ͱ਺ඦϛϦ͔ ͔ΔͱʮϖʔδૹΓ͕٧·ΔʯΑ͏ʹײ͡Δ

Slide 8

Slide 8 text

#1 ͷղܾ • ViewPagerʹҰ୴ۭͷviewΛ౉͠ɺbitmapੜ ੒͸όοΫάϥ΢ϯυεϨουͰߦ͏ • bitmap͕ੜ੒Ͱ͖ͨΒviewʹ౉ͯ͠ඳը͢ Δɺ͜ͷͱ͖alpha஋ʢಁ໌౓ʣͰΞχϝʔ γϣϯͯ͠ʮ;Θͬͱʯදࣔ͞ΕΔΑ͏ʹ͢ Δͱࢹ֮తʹ༏ͯ͘͠Α͍

Slide 9

Slide 9 text

PdfPagerAdapter: 1ท෼ͷॲཧ ϓϨʔεϗϧμ7JFXΛͭ͘Δ ඇಉظͰCJUNBQΛϩʔυ͢Δ ݟ։͖࣌͸ϖʔδ෼ϩʔυ

Slide 10

Slide 10 text

RenderBitmapTask: bitmapੜ੒ ݟ։͖ରԠͷͨΊͪΐͬͱෳࡶ جຊ͸1EG3FOEFSFSSFOEFS ΛݺͿ͚ͩ

Slide 11

Slide 11 text

RenderBitmapTask ϑϨʔϜ͔ͭͬͯ;Θͬͱग़ݱͤ͞Δ

Slide 12

Slide 12 text

Ͳ͜·Ͱ࠷దԽ͢΂͖͔ • 3ϖʔδ෼ (දࣔϖʔδ+લޙϖʔδʣͷʮ४උʯ͕1ϑ ϨʔϜ(16ms)ҎԼͳΒे෼ߴ଎ • 1ϑϨʔϜҎԼͰͷ࠷దԽ͸અిޮՌ͘Β͍ • bitmapੜ੒͸30msͱ300msͰUXʹͦΕ΄Ͳҧ͍͸ͳ͍ • 500msΛ௒͑ΔΑ͏ͳΒ࠷దԽ͢΂͖͚ͩͲɺͦΕҎ Լʹ͢Δ౒ྗ͸͋·Γҙຯ͕ͳ͍

Slide 13

Slide 13 text

File #2 طಡ؅ཧ͍ͨ͠

Slide 14

Slide 14 text

طಡ؅ཧ • ΞϓϦ಺ͷॻ੶͝ͱʹɺͲ͜·ͰಡΜ͔ͩه࿥ ͍ͨ͠ • ViewPager#getCurrentItem() ͰҐஔΛऔಘ • 1ը໘1ϖʔδͷ࣌͸؆୯ɺ໰୊͸1ը໘2ϖʔ δʢݟ։͖ʣͷͱ͖ • ʮॻ੶σʔλͰͷҐஔʯʹม׵͢Δඞཁ͕͋Δ

Slide 15

Slide 15 text

ʮҐஔʯʹؔ͢Δ໋໊نଇ • ໋໊نଇΛͭ͘Βͳ͍ͱࢮ͵ • ViewPagerͷݱࡏ஋: position • ॻ੶σʔλͰͷҐஔ: pageIndex • Ϧϑϩʔͷ͜ͱ͸ߟ͑ͳ͍΋ͷͱ͢Δ

Slide 16

Slide 16 text

QPSUSBJUͷͱ͖͸ͦͷ·· JT1PSUSBJU ͡Όͳ͍ͱ͍͚ͳ͍ͷ͸ 7JFX1BHFSͷόάͱࢥΘΕΔ MBOETDBQF ݟ։͖ ͷͱ͖͸ ഒͯ͠දࢴ෼ͷΛҾ͘ ਖ਼֬ʹٯͷม׵Λߦ͏ 7JFX1BHFSͷҐஔ͔Βॻ੶Ґஔʹม׵ ॻ੶Ґஔ͔Β7JFX1BHFSͷҐஔʹม׵

Slide 17

Slide 17 text

File #3 ViewPager͕ࢥ͍௨Γʹಈ͍ ͯ͘Εͳ͍ΜͰ͢…

Slide 18

Slide 18 text

VPΛӈ͔ΒࠨʹҠಈͤ͞Δ • ViewPager͸left-to-rightͳͷͰɺright-to-left ͷॻ੶Λදࣔ͢Δͱ͖ʹͦͷ··࢖͏ͱࢮ͵ • …ͷͰRVPͱ͍͏ϥΠϒϥϦΛ࡞ͬͨ • https://github.com/gfx/ReversibleViewPager • rvp.setReversed(true) ͢Δ͚ͩʂ

Slide 19

Slide 19 text

ViewPagerͰϐϯνΠϯɾΞ΢τ͢ ΔͱIllegalArgumentException • ViewPagerͷόάͬΆ͍ • https://code.google.com/p/android/issues/detail?id=64553 • ViewPager Λܧঝͯ͠ super.onInterceptTouchEvent() ͷྫ֎ΛѲΓ௵ ͤʂ • RVP͸͜ͷରԠ͕ೖ͍ͬͯΔ

Slide 20

Slide 20 text

VP#onSavedInstanceState() • ը໘ճస࣌ʹঢ়ଶΛอଘ͢Δ࣌ʹݺ͹ΕΔ • conﬁguration͔ΒͱΕΔorientation͕ʮݱࡏͷ σόΠεͷํ޲ʯͰ͸ͳ͘ʮ͜Ε͔Β޲͔͏ํ޲ʯ ʹͳΔ • ͦ͜Ͱલड़ͷ !isPortrait() ʹͳͬͨ • ͜Ε͸ਖ਼͍͠ͷ͔…ಈ͍ͯΔ͚Ͳ…

Slide 21

Slide 21 text

VP#onCreateView()ͱঢ়ଶ෮ؼ • onSavedInstanceState()Ͱอଘͨ͠ঢ়ଶΛ෮ؼͤ͞Δ • ͔͠͠ɺonCreateView()Ͱ vp.setCurrentItem() ͯ͠΋ແ ࢹ͞ΕΔʂʂʂ • onCreateView()ͷ͋ͱʹFragment͕view (VPؚΉ) ͷঢ় ଶΛ෮ؼ͢Δ͔ΒɺΒ͍͠ • onCreateView()Ͱঢ়ଶΛಡΈͩ͠ɺonResume()Ͱ vp.setCurrentItem()͢Δ͜ͱʹͨ͠

Slide 22

Slide 22 text

RVPͷ՝୊ • RVPΛ׬ᘳʹ࣮૷͢Δͷ͕೉͍͠ • v1.0.2࣌఺Ͱ΋ PagerTitleStrip ͱͷڠௐ͕͏ ·͍͔͘ͳ͍όά͕͋Δ • RTL͸AOSPଆͰରԠͯ͘͠ΕΔͱخ͍͠ • ໘౗ͳ͜ͱ͸GoogleͷΤϯδχΞʹ೚͍ͤͨ