Toolbar widget overlaps scroll view

Question

I've just implemented a scroll view along with the Android toolbar widget but during deployment, the toolbar appears to overlap the scrollview for some reason.

fragment_about.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scrollbarThumbVertical="@drawable/light_scrollbar">
        <LinearLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:orientation="vertical"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content">

            <TextView
                android:id="@+id/textView1"
                android:text="@string/app_name"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal"
                style="@android:style/TextAppearance.Large"/>
        </LinearLayout>
    </ScrollView>
</RelativeLayout>

activity_about.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/fragmentabout" >

    <android.support.v7.widget.Toolbar
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/actionBar"
        android:elevation="4dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:contentInsetEnd="0dp"
        app:contentInsetStart="16dp" >
    </android.support.v7.widget.Toolbar>

    <LinearLayout
        android:id="@+id/container"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</FrameLayout>

AboutActivity.java

public class AboutActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_about);

        Toolbar toolbar = (Toolbar) findViewById(R.id.actionBar);
        if (toolbar != null) {
            setSupportActionBar(toolbar);
            toolbar.setBackgroundColor(Color.parseColor("#212121"));
            getSupportActionBar().setDisplayHomeAsUpEnabled(true);
            getSupportActionBar().setDisplayShowHomeEnabled(false);
        }

        getSupportFragmentManager().beginTransaction()
                .replace(R.id.container, new FragmentAbout())
                .commit();
    }
}

Answer 1

It's because in your activity_about.xml, you used FrameLayout. FrameLayout take no responsibility for the child views. Use LinearLayout rather than FrameLayout.

activity_about.xml

<?xml version="1.0" encoding="utf-8"?>
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/fragmentabout" >

  <android.support.v7.widget.Toolbar
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/actionBar"
     android:elevation="4dp"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     app:contentInsetEnd="0dp"
     app:contentInsetStart="16dp" >
  </android.support.v7.widget.Toolbar>

  <LinearLayout
     android:id="@+id/container"
     android:orientation="horizontal"
     android:layout_width="match_parent"
     android:layout_height="match_parent"/>

</LinearLayout>