Kamis, 29 Agustus 2013

Simple example of Navigation Drawer

Navigation drawer is a panel that transitions in from the left edge of the screen and displays the app’s main navigation options.

It is a simple example of Navigation Drawer:
Simple example of Navigation Drawer
Simple example of Navigation Drawer


Modify layout to add <android.support.v4.widget.DrawerLayout > as root.
<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" >

<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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="android-coding.blogspot.com" />
</RelativeLayout>

<ListView
android:id="@+id/drawer"
android:layout_width="200dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@android:color/background_dark"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp" />

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


Create /res/layout/drawer_list_item.xml to define row layout of the ListView in our drawer.
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textColor="@android:color/white"
android:textSize="24sp"/>


MainActivity.java
package com.example.androidnavigationdrawer;

import android.os.Bundle;
import android.app.Activity;
import android.support.v4.widget.DrawerLayout;
import android.view.Menu;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;

public class MainActivity extends Activity {

private String[] optsArray = {
"Option 1",
"Option 2",
"Option 3",
"Option 4"
};
private DrawerLayout drawer;
private ListView drawerList;
ArrayAdapter<String> optionArrayAdapter;

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

drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
drawerList = (ListView) findViewById(R.id.drawer);

optionArrayAdapter = new ArrayAdapter<String>(this,
R.layout.drawer_list_item,
optsArray);
drawerList.setAdapter(optionArrayAdapter);

drawerList.setOnItemClickListener(new OnItemClickListener(){

@Override
public void onItemClick(AdapterView<?> parent, View view,
int position, long id) {
Toast.makeText(MainActivity.this,
optsArray[position],
Toast.LENGTH_LONG).show();
}});
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}

}

/res/menu/main.xml, it's the auto generated menu resources by Eclipse. You can ignore it by removing onCreateOptionsMenu() in MainActivity.java if you don't need it.
<menu xmlns:android="http://schemas.android.com/apk/res/android" >

<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:showAsAction="never"
android:title="@string/action_settings"/>

</menu>


more: DrawerLayout with custom Layout/View

0 komentar:

Posting Komentar

Copyright © 2012 Codding News All Right Reserved