Reputation: 309
I'm trying to implement material navigation drawer using
android.support.v4.widget.DrawerLayout
android.support.v7.widget.Toolbar
android.support.design.widget.NavigationView
The problem is both NavigationView & Toolbar always be overlaid by FrameContent. A FrameContent just a fragment.
*NOTE: I had tried LinearLayout replace for RelativeLayout as container, but not work.
activity_layout.xml
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="@android:id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/toolbar"/>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"/>
</RelativeLayout>
<android.support.design.widget.NavigationView
android:id="@+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"/></android.support.v4.widget.DrawerLayout>
Fragment.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">
<TextView android:text="@string/hello_world" android:layout_width="wrap_content"
android:layout_height="wrap_content"/></FrameLayout>
ActivityMain.java
public class MainActivity extends AppCompatActivity{
protected Toolbar mToolbar;
protected NavigationView mNavigationView;
protected DrawerLayout mDrawerLayout;
protected FrameLayout container;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.material_activity_layout);
this.mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(this.mToolbar);
this.mNavigationView = (NavigationView) findViewById(R.id.navigation_view);
this.mNavigationView.inflateHeaderView(R.layout.nav_header);
this.mNavigationView.inflateMenu(R.menu.drawer);
this.mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer);
ActionBarDrawerToggle defaultActionBarDrawerToggle = new ActionBarDrawerToggle(
this,
this.mDrawerLayout,
this.mToolbar,
R.string.app_name,
R.string.app_name) {
@Override
public void onDrawerOpened(View drawerView) {
super.onDrawerOpened(drawerView);
}
@Override
public void onDrawerClosed(View drawerView) {
super.onDrawerClosed(drawerView);
}
};
this.mDrawerLayout.setDrawerListener(defaultActionBarDrawerToggle);
defaultActionBarDrawerToggle.syncState();
this.mToolbar.setTitle("Test Toolbar");
this.mToolbar.setBackgroundColor(Color.BLUE);
getFragmentManager().beginTransaction().add(android.R.id.content, new InFragment(), "fragment").commit();
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
return true;
}
public static class InFragment extends Fragment {
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment, container, false);
}
}
}
Here the result
Upvotes: 3
Views: 720
Reputation: 146
You should not override @android:id/content because it cause some odd behaviour so just introduce a new id like @+id/fragmentcontainer and use it.
When you are adding an fragment with android.R.id.content and there is already some content it will be placed above the other content.
Also change the order that toolbar is before the rest of the content like the framelayout etc.
Hope it helps
Edit: I did adapt my old answer since it was not 100% correct.
Upvotes: 1
Reputation: 6834
You can use LinearLayout
with android:orientation="vertical"
instead RelativeLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_alignParentTop="true"/>
<FrameLayout
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
</LinearLayout>
Upvotes: -1