Create Layouts with the Wearable UI Library

#potatotips

Transcript

1. Create Layouts
   with
   the Wearable UI Library
   potatotips#21
   teshi04
   

   View Slide

2. About Me
   ɾদӜ༏ҥ ˏteshi04
   ɾuPhyca Inc.
   ɾAndroid app: Justaway, όʔίʔυॻ੶ݕࡧ
   ɾAndroid Wear app: Twitwear, ৺ഥ਺πΠʔτ, ෲےΧ΢ϯτ͘Μ
   !
   

   View Slide

3. Android Support Wearable
   Library 1.3.0
   

   View Slide

4. android.support.wearable
   .view.*
   http://developer.android.com/intl/ja/reference/android/
   support/wearable/view/package-summary.html
   

   View Slide

5. WearableListView
   • WearσόΠεʹ࠷దԽ͞Εͨ
   ListView (RecyclerView)
   • εΫϩʔϧΛࢭΊΔͱɺۙ͘ͷ
   ΞΠςϜʹࣗಈͰεφοϓ͢Δ
   

   View Slide

6. DelayedConfirmationView
   • ԁܗΧ΢ϯτμ΢ϯࣜ

   λΠϚʔView
   • DelayedConfirmationListener
   ͰɺλΠϚʔ͕Ұपͨ͠ͱ͖ͷ
   ॲཧͱɺλΠϚʔΛ్தͰλο
   ϓ͞Εͨͱ͖ͷॲཧΛొ࿥Ͱ
   ͖Δ
   

   View Slide

7. DismissOverlayView
   • ϩϯάλοϓͰActicityΛऴྃͰ
   ͖ΔΞϓϦͷ࣮૷ͷͨΊͷView
   • ϩϯάλοϓ͞Εͨͱ͖ʹ
   show()ΛݺͿͱɺදࣔ͞ΕΔɻ

   ☓Λλοϓ͢ΔͱActivity.finish()
   ͕ݺ͹ΕΔ
   • ͜ΕΛ࢖͍ͬͯΔΞϓϦ͸গͳ͍
   

   View Slide

8. CircledImageView
   • ԁܗͷImageView
   

   View Slide

9. CardFrame
   • ΧʔυελΠϧͳViewGroup
   

   View Slide

10. CardFragment
    • CardFrame͕ઃఆ͞ΕͯΔ
    Fragment
    

    View Slide

11. • ਨ௚ํ޲ͱਫฏํ޲ʹҠಈͰ
    ͖Δ
    GridViewPager
    • GridViewPagerͷΠϯδέʔ
    λʔ
    DotsPageIndicator
    

    View Slide

12. ProgressSpinner
    • Wear༻ʹσβΠϯ͞Εͨ
    ProgressBar
    • ΧϥϑϧͳϓϩάϨεόʔ͕

    ͘Δ͘ΔΞχϝʔγϣϯ͢Δ
    

    View Slide

13. CrossfadeDrawable
    • 2ͭͷDrawableΛϒϨϯυͰ͖Δ Drawable
    • Base DrawableͱɺFading Drawableɺ

    progress Λࢦఆ͢Δ
    

    View Slide

14. ConfirmationActivity
    • ΞΫγϣϯΛ׬ྃͨ͠ޙͷ݁Ռ
    දࣔʹ࢖͑ΔActivity
    • SUCCESS_ANIMATION

    FAILURE_ANIMATION

    OPEN_ON_PHONE_ANIMATI
    ON
    • ը૾ͷԼʹදࣔ͞ΕΔςΩετ
    ΋มߋՄೳ
    

    View Slide

15. ActionLabel
    • ಛघͳTextView
    • ઃఆͨ͠࠷େߦ਺
    ʢmaxLinesʣͱ Viewͷ෯ͷ੍
    ໿Λຬͨ͢ɺ࠷େͷจࣈαΠζ
    Λܭࢉͯ͠ɺͦͷܭࢉͨ͠จࣈ
    αΠζͰςΩετ͕දࣔ͞ΕΔ
    

    View Slide

16. CircularButton
    • FloatingActionButtonͷ
    Wearable ༻ View
    • FloatingActionButtonͱಉ༷ʹ
    λοϓͨ͠ͱ͖ʹϦοϓϧΞχ
    ϝʔγϣϯ͢Δ
    

    View Slide

17. ActionPage
    • CircularButtonͱActionLabel
    Λ಺แ͍ͯ͠ΔView
    • Android Wearͷ௨஌ΧʔυΛ
    ӈʹૹͬͨͱ͖ͷը໘Λ࠶ݱ
    Ͱ͖Δ
    

    View Slide

18. • ؙܕσόΠεͷͱ͖͚ͩɺ

    ࢦఆͨ͠ํ޲ʹɺܾΊΒΕͨ༨ന͕෇͘
    BoxInsetLayout
    • ؙܕͷσόΠεͱ֯ܕͷσόΠε
    Ͱදࣔ͢ΔlayoutΛม͑ΒΕΔ
    WatchViewStub
    • ؙܕͷσόΠεͷͱ͖͚ͩ༨
    നΛ෇͚Δ͜ͱ͕Ͱ͖Δ
    WearableFrameLayout
    

    View Slide

19. ͋Γ͕ͱ͏͍͟͝·ͨ͠
    

    View Slide