Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Android data binding

463 views

Published on

Let's explore how we can use the data binding library to reduce the boilerplate code for the Android views. We'll examine how you can start creating declarative layouts to bind the application logic to your views.

Published in: Software
  • Hi there!. I have just started to learn Android app development. I am an English language teacher. I need to re-write some programs so that they may be installed on mobile phones of my students. Can you help?
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Android data binding

  1. 1. Android Data Binding 2
  2. 2. About Me 11 binding.setPresenter( new Presenter( “Ajit Singh”, “Developer”, “github.com/ajitsing”, “www.singhajit.com” ) );
  3. 3. Agenda 11 • What is Data Binding • Why Data Binding? • Live Coding / Demo • Take Aways
  4. 4. 10 What data binding do? How would it help me?
  5. 5. Whats the problem with below code 11 Task task = tasks.get(position);
 
 TextView taskTitle = (TextView) taskView.findViewById(R.id.task_title);
 TextView taskDescription = (TextView) taskView.findViewById(R.id.task_description);
 TextView creationDate = (TextView) taskView.findViewById(R.id.creation_date); TextView reminderTime = (TextView) taskView.findViewById(R.id.reminder_timer);
 
 taskTitle.setText(task.getTitle());
 taskDescription.setText(task.getDescription());
 creationDate.setText(task.getCreationDate()); reminderTime.setText(task.getReminderTime());
  6. 6. Again.. 11 Button addTaskButton = (Button) findViewById(R.id.add_task);
 
 addTaskButton.setOnClickListener(new View.OnClickListener() {
 @Override
 public void onClick(View view) {
 presenter.onAddTask();
 }
 });
 }
  7. 7. 10 How to eliminate this boiler plate code??
  8. 8. Eliminate Boiler Plate Code 11 Task task = tasks.get(position);
 
 binding.taskTitle.setText(task.getTitle());
 binding.taskDescription.setText(task.getDescription());
 binding.creationDate.setText(task.getCreationDate()); binding.reminderTime.setText(task.getReminderTime());
  9. 9. 10 Is it a viewHolder??
  10. 10. Eliminate Boiler Plate Code 11 <Button
 android:id="@+id/add_task"
 android:onClick="@{presenter.onAddTask}"
 …… /> binding.setTask(task);
  11. 11. Data Binding 11 • Developed by Google • Built in inside gradle plugin • No external dependency needed
  12. 12. Enable Data Binding 11 android { …… dataBinding { enabled = true } }
  13. 13. Data Binding Layout Files 11 <layout>
 <data class="UserBinding">
 <import type=“com.ajit.singh.demo.util.AppUtil"/>
 <variable
 name="viewModel"
 type="com.ajit.singh.demo.viewmodel.UserViewModel"/>
 </data> <TextView
 android:text=“@{viewModel.name}"
 android:layout_width="wrap_content"
 android:layout_height=“wrap_content"/> </layout>

  14. 14. User Event Handling 11 <Button
 android:id="@+id/add_task"
 android:onClick="@{(view) -> handler.onAddTask(viewModel)}"
 android:layout_width=“wrap_content"
 android:layout_height="wrap_content"/>
  15. 15. Binding Expressions 11 • android:text="@{String.valueOf(index + 1)}” • android:text="@{user.displayName ?? user.lastName}” • android:text="@{user.displayName != null ? user.displayName : user.lastName}" • android:padding="@{large? @dimen/largePadding : @dimen/smallPadding}” • android:visibility="@{user.isAdult ? View.VISIBLE : View.GONE}"
  16. 16. Keywords Not Supported In Binding 11 • new • this • super
  17. 17. Inflating Layout 11 UserBinding binding = DataBindingUtil.setContentView(this, R.layout.user_layout); OR DataBindingUtil.inflate(inflator, R.layout.user_layout, parent, false); binding.setUser(new User(“Ajit Singh”)); TextView userName = (TextView) findViewById(R.id.user_name); userName.setText(“Ajit Singh”);
  18. 18. ViewModel 11 public class User extends BaseObservable { @Bindable
 public String getName() {
 return name;
 } public void setName(String name) {
 this.name = name;
 notifyPropertyChanged(BR.name);
 } }
  19. 19. 10 Demo / Hands On
  20. 20. Demo App Architecture 11 Activity Presenter/ Controller DataBase Layout DataBase execute some logic Update UI ReadWrite
  21. 21. Demo 11 One way binding with static data
  22. 22. What we did? 11 • Wrap Parent ViewGroup in <layout> tag • Move all namespaces to <layout> tag • Define meta data of binding in <data> tag • Inflate layout using DataBindingUtil • set the variables defined in <data> tag in binding
  23. 23. Demo 11 Two way binding
  24. 24. What we did? 11 • Created a viewModel to hold view state • Extend viewModel with BaseObservable • Create setters for the fields • Notify when data changes in viewModel • @={viewModel.title}
  25. 25. Demo 11 Event Handling
  26. 26. Custom Binding 11 @BindingAdapter("setAdapter")
 public static void setAdapter(AdapterView view, BaseAdapter adapter) {
 view.setAdapter(adapter);
 } <ListView
 android:id="@+id/tasks_list"
 app:setAdapter="@{TasksAdapter.newInstance(viewModel.tasks)}"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"/>
  27. 27. Take Aways… 11 • Use one way binding to update data on UI • Two way binding to update view model from UI • Don’t extend viewModel with BaseObservable
 for static data • Use custom binding to avoid duplication and make code readable in layout • Do not write too much logic in layout files
  28. 28. THANK YOU For questions or suggestions: Ajit Singh ajitsing@thoughtworks.com

×