Faster Android Development with Data Binding

Session at the Android Fortnightly Series by GDG Lagos.

A talk about how to use data binding in Android to improve development speed, performance and prevent redundant code.

Transcript

1. Faster Android development
   with Data Binding
   Android Fortnightly Series, July 2016
   

   View Slide

2. Segun Famisa
   Software Engineer at Konga,KongaPay
   @segunfamisa
   segunfamisa.com
   

   View Slide

3. What is data binding?
   

   View Slide

4. What is data binding?
   ● Simply put: binding data, to your layouts.
   ● Changes in data are propagated to the
   views, and vice versa.
   ● Does not necessarily use the `findViewById
   ()`
   

   View Slide

5. What is data binding?
   Regular Way of accessing views
   

   View Slide

6. What is data binding?
   So much boilerplate code
   Data binding helps bring an end to that.
   findViewById()
   

   View Slide

7. View Slide

8. Data binding in your Android
   app
   

   View Slide

9. Data binding in Android
   ButterKnife
   Holdr
   Data binding library
   

   View Slide

10. Data binding in Android
    ButterKnife
    Holdr
    Data binding library
    

    View Slide

11. Data binding in Android
    ButterKnife
    Holdr
    Data binding library
    Holdr has been deprecated
    

    View Slide

12. Data binding in Android
    ButterKnife
    Holdr
    Data binding library
    

    View Slide

13. Why use data binding?
    

    View Slide

14. Why use data binding?
    Avoid boilerplate code
    Efficiency
    No Performance issues
    findViewById()
    Data binding makes the view id’s
    not useful in code, so, no need to
    findViewById.
    Avoid those ugly looking
    findViewById calls.
    

    View Slide

15. Why use data binding?
    Avoid boilerplate code
    Efficiency
    No Performance issues
    findViewById is an expensive call.
    It traverses the UI hierarchy only
    once.
    Data binding improves efficiency of
    by preventing numerous findViewById
    calls
    

    View Slide

16. Why use data binding?
    Avoid boilerplate code
    Efficiency
    No Performance issues
    Data binding does not use
    reflection.
    Every processing happens at compile
    time.
    #PerfMatters
    

    View Slide

17. How to use data binding in
    Android
    

    View Slide

18. How to use data binding in Android?
    What do I need to use data binding?
    ● Android Studio 1.3+
    ● Gradle 1.5.0-alpha1 and above
    ● Download the library from the Support repository in the
    Android SDK manager.
    

    View Slide

19. How to use data binding in Android?
    Enable data binding in the android block of your app’s build.gradle
    file
    android {
    ...
    dataBinding.enabled = true
    }
    

    View Slide

20. Writing your first data
    binding code
    

    View Slide

21. Your first data binding code
    Make outer tag
    Use DataBindingUtil
    a. Activity
    b. Fragment
    

    View Slide

22. Your first data binding code
    Make outer tag
    Use DataBindingUtil
    a. Activity
    b. Fragment
    

    View Slide

23. Your first data binding code
    Make outer tag
    Use DataBindingUtil
    a. Activity
    b. Fragment
    

    View Slide

24. Your first data binding code
    Make outer tag
    Use DataBindingUtil
    a. Activity
    b. Fragment
    

    View Slide

25. Your first data binding code
    Make outer tag
    Use DataBindingUtil
    a. Activity
    b. Fragment
    

    View Slide

26. Yasss, we did it. Let’s take it further!
    

    View Slide

27. Using variables
    

    View Slide

28. Using variables
    1. Add tag
    2. Set variable
    

    View Slide

29. Using variables
    1. Add tag
    2. Set variable
    The user variable within data
    describes a property that may be
    used within this layout.
    

    View Slide

30. Using variables
    1. Add tag
    2. Set variable
    

    View Slide

31. Let’s take it further, let’s handle
    events!
    

    View Slide

32. Add handler class &
    method
    Add handler variable to
    tag
    Bind handler to view in
    code
    Handling events - Method references
    

    View Slide

33. Add handler class &
    method
    Add handler variable to
    tag
    Bind handler to view in
    code
    Handling events - Method references
    

    View Slide

34. Add handler class &
    method
    Add handler variable to
    tag
    Bind handler to view in
    code
    Handling events - Method references
    

    View Slide

35. Add handler class &
    method
    Add handler variable to
    tag
    Bind handler to view in
    code
    Handling events - Method references
    

    View Slide

36. Layout details
    

    View Slide

37. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    

    View Slide

38. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    ● Mathematical + - / * %
    ● String concatenation +
    ● Logical && ||
    ● Binary & | ^
    ● Unary + - ! ~
    ● Shift >> >>> <<
    ● Comparison == > < >= <=
    

    View Slide

39. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    ● instanceof
    ● Grouping ()
    ● Literals - character, String, numeric,
    null
    ● Cast
    ● Method calls
    ● Field access
    ● Array access []
    ● Ternary operator ?:
    

    View Slide

40. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    Expressions that aren’t supported:
    “new”
    “this”
    “super”
    

    View Slide

41. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    ● You can embed include tags within
    your layout.
    ● Each include must have an id for
    you to be able to access it from
    code.
    ● An tag cannot be the
    direct child of a tag
    

    View Slide

42. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    

    View Slide

43. Layout details
    Imports
    Expressions
    Includes
    Null coalescing
    The expression resolves
    to user.nickName if user.
    name is null and user.
    name otherwise
    

    View Slide

44. Under the hood
    How data binding works?
    

    View Slide

45. How data binding in Android works
    ● Begin compilation
    ● Process layout files
    ○ Removing every data
    binding-related stuff in
    the layout.
    ● Parse expressions
    ● During compile, resolve
    dependencies
    ● Find setters, and set
    attributes
    ● Write data binding`
    Begin Compilation
    Process layout files
    Parse Expressions
    Resolve dependencies
    Find setters
    Write binders
    Java Compilation
    

    View Slide

46. How data binding in Android works
    Begin Compilation
    Process layout files
    Parse Expressions
    Resolve dependencies
    Find setters
    Write binders
    Java Compilation
    

    View Slide

47. How data binding in Android works
    Begin Compilation
    Process layout files
    Parse Expressions
    Resolve dependencies
    Find setters
    Write binders
    Java Compilation
    Removes all data binding-related
    code in the layout
    

    View Slide

48. Attribute setters
    Custom setters.
    Using @BindingAdapter annotation, you can bind custom
    attributes to static methods. TL;DR you can create your own
    attributes.
    

    View Slide

49. Attribute setters
    Custom setters.
    Using @BindingAdapter annotation, you can bind custom
    attributes to static methods.
    

    View Slide

50. Attribute setters
    Custom setters.
    Using @BindingAdapter annotation, you can bind custom
    attributes to static methods.
    

    View Slide

51. Resources & References
    ● https://developer.android.com/topic/libraries/data-
    binding/index.html
    ● https://www.youtube.com/watch?v=NBbeQMOcnZ0
    ● https://www.youtube.com/watch?v=DAmMN7m3wLU
    ● https://realm.io/news/data-binding-android-boyar-mount/
    ● https://goo.gl/jwc921
    

    View Slide

52. We could go on and on and on..
    

    View Slide

53. Questions?
    @segunfamisa
    segunfamisa.com
    Thank you for listening.
    

    View Slide