Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Databinding in Android

Databinding in Android

Introduction to Android's new databinding Gradle plugin

Bryan Herbst

July 25, 2015
Tweet

More Decks by Bryan Herbst

Other Decks in Programming

Transcript

  1. Databinding in Android BRYAN HERBST

  2. Job Interview Q: How does an Android Activity fit in

    to the MVC pattern? A: Ehh…
  3. MV[C|P|VM] A Model that represents your raw data. Aka POJOs.

    A View that dictates how your data is displayed to the user Something to get the data and display the view
  4. View <div class="entry"> <h1>{{title}}</h1> <div class="body"> {{body}} </div> </div>

  5. Controller var template = Handlebars.compile(viewTemplate); var data = {title: “Hello

    World", body: “Templating rocks!"}; var html = template(data);
  6. Let there be data binding Now we can have better

    separation of concerns Activities and Fragments now have more limited scope and a clearer purpose: ◦ Load data ◦ Bind data to the View ◦ Respond to events
  7. Setup buildscript { dependencies { classpath 'com.android.databinding:dataBinder:1.0-rc0' } } apply

    plugin: 'com.android.databinding'
  8. The View- step one <?xml version="1.0" encoding="utf-8"?> <layout xmlns:android="http://schemas.android.com/apk/res/android"> <LinearLayout

    android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> </LinearLayout> </layout> Wrap your layout in a <layout> tag
  9. The View- step two <layout xmlns:android="http://schemas.android.com/apk/res/android"> <data> <variable name="animal" type="com.example.AnimalModel"

    /> </data> <!-- Your layout --> </layout> Add a <data> tag with <variable>s for your models
  10. The View- step three <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@{animal.species}"/> Bind to

    model with @{model.property}
  11. The binding class Plugin generates binding class my_fancy_layout.xml becomes MyFancyLayoutBinding

  12. The controller side @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);

    ActivityAnimalBinding binding = DataBindingUtil.setContentView(this, R.layout.activity_animal); binding.setAnimal(new Elephant()); }
  13. Demo time!

  14. Can the views be smarter? What else can we bind?

  15. Visibility- step one <data> <import type="android.view.View"/> <variable name="note" type="com.bherbst.bindingnotes.NoteViewModel" />

    </data> Import types into layouts just like Java
  16. Visibility- step two android:visibility="@{note.content == null ? View.GONE : View.VISIBLE}"

  17. Introducing the ViewModel Because that date format is terrible.

  18. NoteViewModel public class NoteViewModel { private static final DateFormat TIMESTAMP_FORMAT

    = DateFormat.getDateInstance(); private Note mNote; public String getFormattedTimestamp() { return TIMESTAMP_FORMAT.format(mNote.getCreatedTime()); } } <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@{note.formattedTimestamp}"/>
  19. Demo time!

  20. Data binding: Two way street <LinearLayout android:orientation="vertical“ android:layout_width="match_parent" android:layout_height="match_parent" app:onClickListener="@{note.clickListener}">

    Using app namespace, bind to anything with a setter
  21. Automatic updates What happens when our data changes?

  22. Observables No, not RxJava

  23. Observables in the ViewModel public ObservableInt numClicks; public View.OnClickListener clickListener

    = new View.OnClickListener() { @Override public void onClick(View view) { numClicks.set(numClicks.get() + 1); } };
  24. Observables in the layout <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@{String.valueOf(note.numClicks)}"/> Text now

    automatically updates
  25. Demo time!

  26. Resources https://developer.android.com/tools/data-binding/guide.html Tons of information about: ◦ <include>s ◦ Operators

    in bindings ◦ Accessing arrays/lists/maps ◦ Using resources in bindings ◦ Value converters ◦ Binding custom view properties ◦ More ways to make data observable