Navigation Drawer: Set as Always Opened on Tablets

Navigation Drawer: set as always opened on tablets

Based on the idea of larger devices could have different layout files, I have created the follow project.

https://github.com/jiahaoliuliu/ABSherlockSlides

HighLights:

Since the drawer of a large device is always visible, there is not need to have an drawer. Instead, a LinearLayout with two elements with the same name will be enough.

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ListView
android:id="@+id/listview_drawer"
android:layout_width="@dimen/drawer_size"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp"
android:background="@color/drawer_background"/>
<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="@dimen/drawer_content_padding"
/>
</LinearLayout>

Because we don't have the drawer in the layout file, when the app try to find the element in the layout, it will return null. So, there is not need to have an extra boolean to see which layout is using.

DrawerLayout mDrawerLayout = (DrawerLayout)findViewById(R.id.drawer_layout);

if (mDrawerLayout != null) {
// Set a custom shadow that overlays the main content when the drawer opens
mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, GravityCompat.START);
// Enable ActionBar app icon to behave as action to toggle nav drawer
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

// ActionBarDrawerToggle ties together the proper interactions
// between the sliding drawer and the action bar app icon
mDrawerToggle = new ActionBarDrawerToggle(
this,
mDrawerLayout,
R.drawable.ic_drawer,
R.string.drawer_open,
R.string.drawer_close) {

public void onDrawerClosed(View view) {
super.onDrawerClosed(view);
}

public void onDrawerOpened(View drawerView) {
// Set the title on the action when drawer open
getSupportActionBar().setTitle(mDrawerTitle);
super.onDrawerOpened(drawerView);
}
};

mDrawerLayout.setDrawerListener(mDrawerToggle);
}

Here is the example to use it as boolean.

@Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
if (mDrawerLayout != null) {
mDrawerToggle.syncState();
}
}

@Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
if (mDrawerLayout != null) {
// Pass any configuration change to the drawer toggles
mDrawerToggle.onConfigurationChanged(newConfig);
}
}

Android navigation drawer always open on tablet

I do not have the precise knowledge but a workaround could be to make a different xml file for large devices without the DrawerLayout so when it runs on a tablet it will return null and no other boolean will be neede in the code and this will make the coding part very simple :-) kudos !

Android Drawer open in Tablets but main content is disabled

This is because you are using LOCK_MODE_LOCKED_OPEN which makes drawer to be opened in locked state.

You should check orientation first and then you can do anything with drawer like :

boolean isLandscape = getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE;

if(isLandscape) {
// your tablet is in landscape mode
// so unlock drawer
drawer.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED);
} else {
// your tablet is in Portrait mode so lock drawer so user cannot open it
drawer.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
}

Further you should add listener for getting screen orientation changes. Because you will Lock and Unlock drawer frequently based on orientation changes. For that we can use OrientationEventListener class. Description is given at : https://developer.android.com/reference/android/view/OrientationEventListener.html :

OrientationEventListener mListener = new OrientationEventListener(this,SensorManager.SENSOR_DELAY_NORMAL) {

@Override
public void onOrientationChanged(int arg0) {

if(arg0 == OrientationEventListener.ORIENTATION_UNKNOWN) {
// orientation is unknown so do nothing
return;
}
if((345 < arg0 && arg0 < 359) || (arg0 >= 0 && arg0 < 45) || (arg0 < 180 && 135 < arg0) || ( arg0 < 215 && arg0 > 180)) {
// device is Portrait
drawer.setDrawerLockMode(DrawerLayout.LOCK_MODE_LOCKED_CLOSED);
} else {
// device is Landscape
drawer.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED);
}
}

});

Hope this will help you

Is there any way to set the navigation drawer as visible always

Got It!!.. Simplicity at its best. No libraries, No complicated codes. Use SimplePaneLayout.

Just set the android:layout_marginLeft to a suitable value. :) Awesome :)

<android.support.v4.widget.SlidingPaneLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/slidingpanelayout">

<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#CCC"
android:orientation="horizontal"
android:id="@+id/fragment_firstpane"/>

<LinearLayout android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000"
android:orientation="horizontal"
android:layout_marginLeft="40dp"
android:id="@+id/fragment_secondpane"/>

</android.support.v4.widget.SlidingPaneLayout>

Main Layout contents still visible when Drawer Layout opened

Change your layout to this:

<RelativeLayout 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:background="@color/icons"
android:focusableInTouchMode="true"
tools:context=".MainActivity">

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/rl">

<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:id="@+id/button"
android:drawableTop="@drawable/fan_blade1"
android:drawablePadding="-20dp"
android:textColor="#ffffff"
android:background="@drawable/btn_black"
android:layout_marginLeft="30dp"
android:layout_marginStart="30dp"
android:layout_below="@+id/button7"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />

<SeekBar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/button"
android:layout_marginTop="30dp"
android:layout_marginEnd="30dp"
android:layout_marginRight="30dp"
android:layout_alignLeft="@+id/button"
android:layout_alignStart="@+id/button"
android:id="@+id/seekBar"
android:thumb="@drawable/seek_thumb"
android:progressDrawable="@drawable/progressbr"/>

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/textView5"
android:text="speed"
android:layout_alignTop="@+id/button2"
android:layout_alignRight="@+id/imageView"
android:layout_alignEnd="@+id/imageView" />

<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:text="S1"
android:id="@+id/button2"
android:textColor="#ffffff"
android:background="@drawable/btn_black"
android:layout_below="@+id/seekBar"
android:layout_alignLeft="@+id/seekBar"
android:layout_alignStart="@+id/seekBar"
android:layout_marginTop="30dp" />

<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:text="S2"
android:id="@+id/button3"
android:textColor="#ffffff"
android:background="@drawable/btn_black"
android:layout_below="@+id/button2"
android:layout_alignLeft="@+id/button2"
android:layout_alignStart="@+id/button2"
android:layout_marginTop="30dp" />

<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:text="S3"
android:id="@+id/button4"
android:textColor="#ffffff"
android:background="@drawable/btn_black"
android:layout_below="@+id/button3"
android:layout_alignLeft="@+id/button3"
android:layout_alignStart="@+id/button3"
android:layout_marginTop="30dp" />

<Button
android:layout_width="60dp"
android:layout_height="wrap_content"
android:drawablePadding="-20dp"
android:id="@+id/button5"
android:textColor="#ffffff"
android:drawableTop="@drawable/shutdown_icon1"
android:background="@drawable/btn_black"
android:layout_below="@+id/button4"
android:layout_alignLeft="@+id/button4"
android:layout_alignStart="@+id/button4"
android:layout_marginTop="30dp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="out command"
android:id="@+id/textView3"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:layout_above="@+id/button3"
android:layout_toRightOf="@+id/button2"
android:layout_toEndOf="@+id/button2" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="in command"
android:id="@+id/textView4"
android:layout_above="@+id/button4"
android:layout_alignLeft="@+id/textView3"
android:layout_alignStart="@+id/textView3" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/imageView"
android:src="@drawable/wheel1"
android:contentDescription="test"
android:layout_marginTop="30dp"
android:layout_alignBottom="@+id/button"
android:layout_toLeftOf="@+id/button7"
android:layout_toStartOf="@+id/button7" />

<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:id="@+id/button7"
android:background="@drawable/red"
android:clickable="false"
android:layout_marginTop="7dp"
android:layout_marginRight="7dp"
android:layout_marginEnd="7dp"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />

</RelativeLayout>

<ListView
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#ffffff"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp" />

</android.support.v4.widget.DrawerLayout>

</RelativeLayout>

Your content needs to go inside the DrawerLayout, you are meant to be putting your content inside the FrameLayout via a Fragment but for a quick fix the above layout should work for you.



Related Topics



Leave a reply



Submit