1) As soon as we create a project, the layout is first modified

2) The widget (say TextView widget) from the pallet is dragged on to the emulator. This adds an XML element with some default settings

<TextView
        android:id="@+id/hello"
        android:layout_width="wrap_content"
        android:layout_height="44dp"
        android:text="@string/my_great_app"
        android:textColor="@color/colorAccent"
        android:textSize="24sp"
        android:textStyle="bold"
        app:fontFamily="serif" />

3) The default parent component is ConstraintLayout (Look at the component tree)

4) Set the constraints for the widgets. This can be done interactively by drawing connectors from the widget.

<TextView
        ...
        app:layout_constraintLeft_toLeftOf="parent"
        <!-- OR app:layout_constraintStart_toStartOf="parent" -->
        app:layout_constraintRight_toRightOf="parent"
        <!-- OR app:layout_constraintEnd_toEndOf="parent" -->
        app:layout_constraintTop_toBottomOf="@+id/button"
        app:layout_constraintBottom_toBottomOf="parent" />

NOTE : Do not add constraintBottom if we have other elements below it. Although it works when edited in the XML, this causes some issues when done interactively. Instead add ConstraintTop_toBottomOf this element from the blew element

Example of building responsive application

1) Create a button widget and edit onClick attribute and set its value to a function name (say clickFunction). This function should be defined in MainActivity.java

...
// Press Alt+Enter to automatically import these classes
import android.util.Log;
import android.view.View;

public class MainActivity extends AppCompatActivity {

    // On clicking button function
    public void clickFunction(View view){
        //This will display information in the console
        Log.i("Info","Button clicked!");

    }

    ...
}

NOTE :

1) For automatic imports, click Alt+enter after typing the required object type. eg. View, Log

2) To get parameter information of a method, click ctrl+Q

Grab elements by ID

1) Here we demonstrate how to grab contents of an element by id. The id is defined in the layout when creating the widget. This can be accessed in MainActivity.java by R.id.WidgetID

2) Remember to cast the element into required widget type.

Pop ups in android are called Toast

public void clickFunction(View view){

        //Getting info from user
        EditText myTextField = (EditText) findViewById(R.id.myText);

        Log.i("Name",myTextField.getText().toString());

        //Temporary Pop up
        Toast.makeText(MainActivity.this,
                "Hi " + myTextField.getText().toString(),
                Toast.LENGTH_LONG).show();
    }