raghav-coder
4/10/2018 - 2:48 PM
UI Basics - Data Binding Library
// utilities -> FakeDataUtils.java
package com.example.android.boardingpass.utilities;
import com.example.android.boardingpass.BoardingPassInfo;
import com.example.android.boardingpass.R;
import java.sql.Timestamp;
import java.util.concurrent.TimeUnit;
/**
* This class is used to generate fake data that will be displayed in the boarding pass layout
*/
public class FakeDataUtils {
/**
* Generates fake boarding pass data to be displayed.
* @return fake boarding pass data
*/
public static BoardingPassInfo generateFakeBoardingPassInfo() {
BoardingPassInfo bpi = new BoardingPassInfo();
bpi.passengerName = "MR. RANDOM PERSON";
bpi.flightCode = "UD 777";
bpi.originCode = "JFK";
bpi.destCode = "DCA";
long now = System.currentTimeMillis();
// Anything from 0 minutes up to (but not including) 30 minutes
long randomMinutesUntilBoarding = (long) (Math.random() * 30);
// Standard 40 minute boarding time
long totalBoardingMinutes = 40;
// Anything from 1 hours up to (but not including) 6 hours
long randomFlightLengthHours = (long) (Math.random() * 5 + 1);
long boardingMillis = now + minutesToMillis(randomMinutesUntilBoarding);
long departure = boardingMillis + minutesToMillis(totalBoardingMinutes);
long arrival = departure + hoursToMillis(randomFlightLengthHours);
bpi.boardingTime = new Timestamp(boardingMillis);
bpi.departureTime = new Timestamp(departure);
bpi.arrivalTime = new Timestamp(arrival);
bpi.departureTerminal = "3A";
bpi.departureGate = "33C";
bpi.seatNumber = "1A";
bpi.barCodeImageResource = R.drawable.art_plane;
return bpi;
}
private static long minutesToMillis(long minutes) {
return TimeUnit.MINUTES.toMillis(minutes);
}
private static long hoursToMillis(long hours) {
return TimeUnit.HOURS.toMillis(hours);
}
}package com.example.android.boardingpass;
import android.databinding.DataBindingUtil;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import com.example.android.boardingpass.databinding.ActivityMainBinding;
import com.example.android.boardingpass.utilities.FakeDataUtils;
import java.text.SimpleDateFormat;
import java.util.Locale;
import java.util.concurrent.TimeUnit;
public class MainActivity extends AppCompatActivity {
// @@ Create a data binding instance called mBinding of type ActivityMainBinding
ActivityMainBinding mBinding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// COMPLETED (4) Set the Content View using DataBindingUtil to the activity_main layout
/*
* DataBindUtil.setContentView replaces our normal call of setContent view.
* DataBindingUtil also created our ActivityMainBinding that we will eventually use to
* display all of our data.
*/
mBinding = DataBindingUtil.setContentView(this, R.layout.activity_main);
// COMPLETED (5) Load a BoardingPassInfo object with fake data using FakeDataUtils
BoardingPassInfo fakeBoardingInfo = FakeDataUtils.generateFakeBoardingPassInfo();
// COMPLETED (9) Call displayBoardingPassInfo and pass the fake BoardingInfo instance
displayBoardingPassInfo(fakeBoardingInfo);
}
private void displayBoardingPassInfo(BoardingPassInfo info) {
// @@ Use mBinding to set the Text in all the textViews using the data in info
mBinding.textViewPassengerName.setText(info.passengerName);
mBinding.textViewOriginAirport.setText(info.originCode);
mBinding.textViewFlightCode.setText(info.flightCode);
mBinding.textViewDestinationAirport.setText(info.destCode);
// COMPLETED (7) Use a SimpleDateFormat formatter to set the formatted value in time text views
SimpleDateFormat formatter = new SimpleDateFormat(getString(R.string.timeFormat), Locale.getDefault());
String boardingTime = formatter.format(info.boardingTime);
String departureTime = formatter.format(info.departureTime);
String arrivalTime = formatter.format(info.arrivalTime);
mBinding.textViewBoardingTime.setText(boardingTime);
mBinding.textViewDepartureTime.setText(departureTime);
mBinding.textViewArrivalTime.setText(arrivalTime);
// COMPLETED (8) Use TimeUnit methods to format the total minutes until boarding
long totalMinutesUntilBoarding = info.getMinutesUntilBoarding();
long hoursUntilBoarding = TimeUnit.MINUTES.toHours(totalMinutesUntilBoarding);
long minutesLessHoursUntilBoarding =
totalMinutesUntilBoarding - TimeUnit.HOURS.toMinutes(hoursUntilBoarding);
String hoursAndMinutesUntilBoarding = getString(R.string.countDownFormat,
hoursUntilBoarding,
minutesLessHoursUntilBoarding);
mBinding.textViewBoardingInCountdown.setText(hoursAndMinutesUntilBoarding);
mBinding.textViewTerminal.setText(info.departureTerminal);
mBinding.textViewGate.setText(info.departureGate);
mBinding.textViewSeat.setText(info.seatNumber);
}
}
package com.example.android.boardingpass;
import java.sql.Timestamp;
import java.util.concurrent.TimeUnit;
/**
* BoardingPassInfo is a simple POJO that contains information about, you guessed it, a boarding
* pass! Normally, it is best practice in Java to declare member variables as private and provide
* getters, but we are leaving these fields public for ease of use.
*/
public class BoardingPassInfo {
public String passengerName;
public String flightCode;
public String originCode;
public String destCode;
public Timestamp boardingTime;
public Timestamp departureTime;
public Timestamp arrivalTime;
public String departureTerminal;
public String departureGate;
public String seatNumber;
public int barCodeImageResource;
public long getMinutesUntilBoarding() {
long millisUntilBoarding = boardingTime.getTime() - System.currentTimeMillis();
return TimeUnit.MILLISECONDS.toMinutes(millisUntilBoarding);
}
}apply plugin: 'com.android.application'
android {
compileSdkVersion 25
buildToolsVersion "25.0.2"
defaultConfig {
applicationId "com.example.android.boardingpass"
minSdkVersion 10
targetSdkVersion 25
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
}
}
// @@ Enable Data Binding in your application
dataBinding.enabled = true;
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:25.1.0'
compile 'com.android.support.constraint:constraint-layout:1.0.0-beta4'
}<?xml version="1.0" encoding="utf-8"?>
<!--
//COMPLETED (2) Use <layout> as the root tag for activity_main to generate the ActivityMainBinding
-->
<!-- @@ -->
<layout xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android">
<ScrollView
android:id="@+id/scroll"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.constraint.ConstraintLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:text="@string/passenger_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textViewPassengerLabel"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:letterSpacing="0.5"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginLeft="16dp"
tools:layout_constraintTop_creator="1"
tools:layout_constraintLeft_creator="1" />
<TextView
tools:text="@string/passenger_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textViewPassengerName"
android:textAppearance="@style/TextAppearance.AppCompat.Display1"
android:textColor="@color/colorPrimary"
app:layout_constraintTop_toBottomOf="@+id/textViewPassengerLabel"
android:layout_marginStart="16dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginLeft="16dp"
tools:layout_constraintTop_creator="1" />
<ImageView
android:id="@+id/leftRectangle"
android:layout_width="60dp"
android:layout_height="80dp"
android:background="@drawable/shape_rectangle_stroke"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@id/textViewPassengerName"
android:layout_marginLeft="32dp"
android:layout_marginTop="16dp"
android:layout_marginStart="32dp" />
<ImageView
android:id="@+id/divider"
android:background="@color/colorPrimaryLight"
android:layout_height="1dp"
android:layout_width="0dp"
app:layout_constraintLeft_toRightOf="@+id/leftRectangle"
app:layout_constraintRight_toLeftOf="@+id/rightRectangle"
app:layout_constraintTop_toBottomOf="@+id/rightRectangle"
app:layout_constraintBottom_toTopOf="@+id/rightRectangle"
app:layout_constraintHorizontal_bias="0.0"/>
<ImageView
android:id="@+id/rightRectangle"
android:layout_width="60dp"
android:layout_height="80dp"
android:background="@drawable/shape_rectangle_stroke"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/textViewPassengerName"
android:layout_marginRight="32dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="32dp" />
<TextView
tools:text="@string/origin_code"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textViewOriginAirport"
android:textAppearance="@style/TextAppearance.AppCompat.Headline"
app:layout_constraintBottom_toBottomOf="@+id/divider"
app:layout_constraintRight_toRightOf="@+id/leftRectangle"
app:layout_constraintTop_toBottomOf="@+id/divider"
app:layout_constraintLeft_toLeftOf="@+id/leftRectangle" />
<TextView
tools:text="@string/destination_code"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textViewDestinationAirport"
android:textAppearance="@style/TextAppearance.AppCompat.Headline"
app:layout_constraintBottom_toBottomOf="@+id/divider"
app:layout_constraintRight_toRightOf="@+id/rightRectangle"
app:layout_constraintTop_toBottomOf="@+id/divider"
app:layout_constraintLeft_toLeftOf="@+id/rightRectangle" />
<ImageView
android:id="@+id/imagePlane"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="@drawable/art_plane"
app:layout_constraintBottom_toTopOf="@+id/divider"
app:layout_constraintLeft_toRightOf="@+id/leftRectangle"
app:layout_constraintRight_toLeftOf="@+id/rightRectangle"
android:layout_marginBottom="16dp"
/>
<TextView
android:id="@+id/textViewFlightCode"
tools:text="@string/flight_code"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Display1"
android:textColor="@color/colorPrimary"
app:layout_constraintTop_toTopOf="@+id/divider"
app:layout_constraintLeft_toRightOf="@+id/leftRectangle"
app:layout_constraintRight_toLeftOf="@+id/rightRectangle"
android:layout_marginTop="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp" />
<TextView
android:id="@+id/textViewBoardingTimeLabel"
android:text="@string/boarding_time_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:letterSpacing="0.3"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/leftRectangle"
android:layout_marginTop="16dp"
android:layout_marginStart="16dp"
android:layout_marginLeft="16dp" />
<TextView
android:id="@+id/textViewBoardingTime"
tools:text="@string/boarding_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Display1"
android:textColor="@android:color/black"
app:layout_constraintLeft_toLeftOf="@+id/textViewBoardingTimeLabel"
app:layout_constraintTop_toBottomOf="@+id/textViewBoardingTimeLabel" />
<TextView
android:id="@+id/textViewDepartureTimeLabel"
android:text="@string/departure_time_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:letterSpacing="0.3"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/textViewBoardingTime"
app:layout_constraintLeft_toLeftOf="@+id/textViewBoardingTime" />
<TextView
android:id="@+id/textViewDepartureTime"
tools:text="@string/departure_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Headline"
android:textColor="@color/colorGood"
app:layout_constraintLeft_toLeftOf="@+id/textViewDepartureTimeLabel"
app:layout_constraintTop_toBottomOf="@+id/textViewDepartureTimeLabel" />
<TextView
android:id="@+id/textViewBoardingInTimeLabel"
android:text="@string/boarding_in_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:letterSpacing="0.3"
android:layout_marginEnd="40dp"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/leftRectangle"
android:layout_marginTop="16dp"
android:layout_marginRight="40dp" />
<TextView
android:id="@+id/textViewBoardingInCountdown"
tools:text="@string/boarding_in_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Display1"
android:textColor="@color/colorBad"
app:layout_constraintLeft_toLeftOf="@+id/textViewBoardingInTimeLabel"
app:layout_constraintTop_toBottomOf="@+id/textViewBoardingInTimeLabel" />
<TextView
android:id="@+id/textViewArrivalTimeLabel"
android:text="@string/arrival_time_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:letterSpacing="0.3"
app:layout_constraintTop_toBottomOf="@+id/textViewBoardingInCountdown"
app:layout_constraintLeft_toLeftOf="@+id/textViewBoardingInCountdown"
android:layout_marginTop="8dp"/>
<TextView
android:id="@+id/textViewArrivalTime"
tools:text="@string/arrival_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Headline"
android:textColor="@color/colorGood"
app:layout_constraintLeft_toLeftOf="@+id/textViewArrivalTimeLabel"
app:layout_constraintTop_toBottomOf="@+id/textViewArrivalTimeLabel" />
<ImageView
android:id="@+id/tableHeaderImage"
android:background="@color/colorPrimaryLight"
android:layout_height="24dp"
android:layout_width="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginTop="32dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:layout_constraintTop_toBottomOf="@+id/textViewDepartureTime"
app:layout_constraintHorizontal_bias="0.33" />
<ImageView
android:id="@+id/tableImage"
android:background="@color/colorPrimary"
android:layout_height="0dp"
android:layout_width="0dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tableHeaderImage"
app:layout_constraintBottom_toBottomOf="@+id/textViewTerminal"/>
<TextView
android:id="@+id/textViewTerminalLabel"
android:text="@string/terminal_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:textColor="@android:color/black"
app:layout_constraintBottom_toBottomOf="@+id/tableHeaderImage"
app:layout_constraintLeft_toLeftOf="@+id/textViewTerminal"
app:layout_constraintRight_toRightOf="@+id/textViewTerminal"
app:layout_constraintTop_toTopOf="@+id/tableHeaderImage" />
<TextView
android:id="@+id/textViewGateLabel"
android:text="@string/gate_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:textColor="@android:color/black"
app:layout_constraintBottom_toBottomOf="@+id/tableHeaderImage"
app:layout_constraintLeft_toLeftOf="@+id/textViewGate"
app:layout_constraintRight_toRightOf="@+id/textViewGate"
app:layout_constraintTop_toTopOf="@+id/tableHeaderImage"
/>
<TextView
android:id="@+id/textViewSeatLabel"
android:text="@string/seat_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="@style/TextAppearance.AppCompat.Caption"
android:textColor="@android:color/black"
app:layout_constraintBottom_toBottomOf="@+id/tableHeaderImage"
app:layout_constraintRight_toRightOf="@+id/textViewSeat"
app:layout_constraintLeft_toLeftOf="@+id/textViewSeat"
app:layout_constraintTop_toTopOf="@+id/tableHeaderImage"
/>
<TextView
tools:text="@string/terminal"
android:layout_width="120dp"
android:layout_height="wrap_content"
android:id="@+id/textViewTerminal"
app:layout_constraintTop_toTopOf="@+id/tableImage"
app:layout_constraintLeft_toLeftOf="@+id/tableImage"
app:layout_constraintRight_toRightOf="@+id/tableImage"
android:textAppearance="@style/TextAppearance.AppCompat.Display2"
android:textColor="@android:color/white"
app:layout_constraintHorizontal_bias="0.0"
android:textAlignment="center" />
<TextView
android:id="@+id/textViewGate"
tools:text="@string/gate"
android:layout_width="120dp"
android:layout_height="0dp"
app:layout_constraintLeft_toLeftOf="@+id/tableImage"
app:layout_constraintRight_toRightOf="@+id/tableImage"
android:textAppearance="@style/TextAppearance.AppCompat.Display2"
android:textColor="@android:color/white"
android:textAlignment="center"
app:layout_constraintTop_toBottomOf="@+id/tableHeaderImage"
app:layout_constraintBottom_toBottomOf="@+id/tableImage"/>
<TextView
android:id="@+id/textViewSeat"
tools:text="@string/seat"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="@+id/tableImage"
app:layout_constraintLeft_toLeftOf="@+id/tableImage"
app:layout_constraintRight_toRightOf="@+id/tableImage"
android:textAppearance="@style/TextAppearance.AppCompat.Display2"
android:textColor="@android:color/white"
app:layout_constraintHorizontal_bias="1.0"
android:textAlignment="center"
android:layout_width="120dp" />
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
app:srcCompat="@mipmap/barcode"
android:id="@+id/barcode"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tableImage"
android:layout_marginTop="16dp"
/>
</android.support.constraint.ConstraintLayout>
</ScrollView>
</layout>## Sets to follow for using Data Binding in our project
- 1 Enable Data Binding in build.gradle file
- 2 Add Layout as the root tag to the UI
- 3 Create a binding instance
- 4 Set the content view using DataBindingUtil
- 5 Bind each attribute in the views to the corresponding data