Great UI's and Less code with the DataBinding Library

This presentation was made during the DevFest organized by the GDG Nairobi and it aims to provide a starting point on what is the Data Binding Library and how to get started.

Transcript

1. Great UI’s and Less Code With the Data Binding Library GDG Nairobi 2015
2. Android GDE . Founder @ Moovi . Blog Writer
3. Data Binding Library A simple way to reduce the amount of glue code between UI and your app logic code
4. Life before the Library
5. How does it work? NO Magic All the work on the API is done under the hood. Everything needed for the binding is done at compile time.
6. We get started by…. Downloading or updating the android support repo.(A lot of cool stuff inside )
7. We get started by…. Defining gradle and data binding lib dependencies classpath for the project
8. We get started by…. applying the plugin to the module we will be using the lib (app*)
9. Key Components of Data Binding Layout File + Data Object + Binding Class
10. The Layout File The root tag of our file is no longer a ViewGroup but instead a Layout tag. Our view hierarchy is now a child of the layout tag. A new data tag was added as the child of the layout tag. Things to notice
11. The Layout File Sample layout file
12. The Data Object A simple POJO or Bean public class Movie { private String movieTitle; private String releaseDate; private String posterUrl; private String backdropPath; private String director; private String runtime; public Movie(){} //other constructors //getters and setters }
13. The Binding Class Generated automatically at compile time we can use to bind our UI code with our app logic like this.
14. Well So far so Good...But Guess what There is more awesomeness on the way
15. Handling Events How to define custom behaviours when listening to events 1. Create a simple class with methods representing the different behaviours we might want when handling events. 2. Declare a new variable on the data tag of the layout file of the type of our handler 3. Declaratively define the expression to call the handler on one of the listeners of the view. 4. Define set the handler to the Binding Class on the java code
16. public class MyHandler { ActivityMainBinding binding; public void onClickButton(View view){ Toast.makeText(view.getContext(), "We did perfectly our event Binding", Toast.LENGTH_SHORT).show(); } } <data> <variable name="movie" type="com.app.blog. databindingexample.models.Movie"/> <variable name="handler" type="com.app.blog. databindingexample.handlers.MyHandler"> </data> <!-- Rest of the layout--> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Click Me" android:onClick="@{handler.onClickButton}"/> <!-- Rest of the layout--> Examples Handling Events
17. Clean and Easy Importing Variables 1. We can import any class into our layout file. 2. We have to specify the full package name of the class we want to import. 3. All classes from java.lang.* are automatically available without the need of importing.
18. Desired result Importing Variables
19. Example - All the work needed Importing Variables
20. Example - All the work needed Importing Variables
21. What changed - Importing variables Importing Variables
22. What changed - Using the variables on our expressions (Only 1 line of xml code needed) Importing Variables
23. What if we need to provide custom binding logic? (Loading an image) Binding Adapters
24. A Custom binding class Binding Adapters
25. The ViewHolder Binding Items on a List or Grid (+/- = on RecyclerView)
26. The Adapter Binding Items on a List or Grid (+/- = on RecyclerView)
27. Thankyou! We just scratched the surface but there is more cool stuff at... Data Binding Library Docs - http://goo.gl/AGwaae My Blog - http://goo.gl/pjoe0g Google Developers Africa - https://goo.gl/ISHOcY