droidcon tlv 2015 - hey android, mirror mirror all day long
TRANSCRIPT
Rights Reserved © 2015
+Yossi Elkrief
@elkriefy
MaTriXy
Android Group leader Tikal Knowledge
Proud FatherAndroid developer since 2008GDG Beer Sheva co-founder & leaderAndroid Mentor @ Google CampusAndroid Lecturer & speakerLFC fan Androids collector
Rights Reserved © 2015
Prior to Mirror● AS - WYSIWYG layout editor● Static builds.● Preview layouts.● No Real live data.● Not actual device
Rights Reserved © 2015
Mirror ● Android studio plugin● Client on Devices.● Standalone - Mirror Server.● Better way to build UI.● Fast (Saves the needs for builds)
Rights Reserved © 2015
Mirror● Test dynamic, interactive UI elements.
● Display layouts on phone or tablet.
● Updating in real-time as you code.
● Hot Swap Code - Java/Kotlin.
Rights Reserved © 2015
Mirror - FoundationsTwo components: ● Server program that runs on build computer.● App that runs on each preview device.
Rights Reserved © 2015
Mirror - Server(Studio/StandAlone)
● Server watches project, detects changes.■ resource files.■ Sample data files.■ Java/Kotlin files.■ dex/apk files
Rights Reserved © 2015
Mirror - Server(Studio/StandAlone)
● Packages up the resources and sends them
to the attached devices.
● Mirror app renders the UI.
Rights Reserved © 2015
Mirror - Live-code
● Save your XML / Java / Kotlin / PNG files.
Check on devices in seconds.
● Rapidly experiment your layouts, custom
views and animations.
Rights Reserved © 2015
Mirror - Prototype
● Create full-fidelity prototypes and collect
early feedback before coding Java.
● Reuse the code in production when the
prototype is approved.
Rights Reserved © 2015
Mirror - Collaborate
● Trash design specs.
● Sit with your designer, make a change and
get instant feedback.
● Encourage them to create the layouts too!
Rights Reserved © 2015
Mirror - Hot-swapping
● Mirror compiles incrementally.● Only sends deltas to the devices.● Hot-swapping resources, assets,
and Java / Kotlin code on multiple devices● View states on the layout are preserved
across refreshes.
Rights Reserved © 2015
Mirror - Accurate, interactive previews
● Mirror’s app inflates layouts and renders
views the same way as your app does.
● Touch feedback, gestures and animations
are as accurate as they should be.
Rights Reserved © 2015
Mirror - REPL for Android UI development
● Experiment individual methods.● Feed and test custom view with different
datasets.● Build animations piecewise● Use code in production when ready
Rights Reserved © 2015
Mirror - Custom views, custom fonts
● Preview layouts with third-party libraries or your own custom views.
● Live-code custom views and custom adapters.
● Preview custom fonts, custom attributes.
Rights Reserved © 2015
Mirror - Learn/Teach Android coding
● Learn Android’s layout/resource system by building things that work on the real device.
● Experiment UI related APIs.● Learn by doing in a fast feedback loop.● Explain and Show Android UI fast and easy.
Rights Reserved © 2015
Mirror - Sample data
● Build UI in a realistic context before coding Java.
● Simple XML to set text, image, visibility and more
● Populate list/grid with different item layouts
● Use Android’s “tools” attribute to populate views
Rights Reserved © 2015
Mirror
● Supports tools attributes - attributes set in layouts will show up in on-device preview.
● simulate dynamic data in static previews, Use: sample data.
Rights Reserved © 2015
Mirror - Sample Data
● screen files - corresponds to a screen.
● Special elements in a screen file.
● Can be used to populate views with data.
Rights Reserved © 2015
Mirror - Sample Data
● Drawable files corresponds to a
drawable.
● Special elements in a drawable file.
● Can be used to populate views with
data.
Rights Reserved © 2015
Mirror - hot swap code
● Live-coding custom views, animations and interactions.
● Prototyping UI by populating views with mock data :
myCustomView.setData(someDataModel)
● Experimenting and learning UI related Android APIs by
executing code piecewise.