很多人看到一些应用都会看到一个很好看的策划菜单,然后自己想着怎么实现,网上有很多demo, 但是大都很复杂,很多朋友可能没什么耐心,比如我! 那怎么能用最简单的方法来实现而且一看就会呢,其实大多数人都知道 android support v4 这个包,使用最多的可能就是ViewPager了,但是其实这个包里面有很多很好用的控件,很多花哨的视图在这个包下的类都可以实现,今天我就简单的用drawerLayout 这个控件实现了侧滑菜单,PagerTabStrip实现了标题滚动,废话不多说,代码不多,直接上代码! 有需要的看不懂的朋友可以MM我!!
首先是几个布局,当然activity_main.xml
<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"
tools:context=".DrawerActivity" >
<android.support.v4.widget.DrawerLayout
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- 主界面视图 -->
<RelativeLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:background="@color/gray"
android:layout_height="match_parent" >
<include
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="@layout/main" />
</RelativeLayout>
<!-- 侧面的视图 -->
<RelativeLayout
android:id="@+id/left"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="left" >
<include
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="@layout/two" />
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>
</RelativeLayout>
main.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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/v_2_0_btn_bg_nomal"
android:gravity="center" >
<Button
android:id="@+id/btn1"
android:layout_width="match_parent"
android:layout_height="55dp"
android:layout_weight="1"
android:background="@drawable/btn_selecor"
android:gravity="center"
android:text="open" />
<TextView
android:layout_width="3dp"
android:layout_height="20dp"
android:background="@android:color/white" />
<Button
android:id="@+id/btn2"
android:layout_width="match_parent"
android:layout_height="55dp"
android:layout_weight="1"
android:background="@drawable/btn_selecor"
android:gravity="center"
android:text="btn2" />
</LinearLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<android.support.v4.view.ViewPager
android:id="@+id/main_body_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" >
<android.support.v4.view.PagerTabStrip
android:id="@+id/pagertitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:background="@drawable/v_2_0_c_select_bg" >
</android.support.v4.view.PagerTabStrip>
</android.support.v4.view.ViewPager>
<ImageView
android:layout_width="fill_parent"
android:layout_height="2dp"
android:layout_alignParentLeft="true"
android:src="@drawable/v_2_0_shadow_bottom" />
</RelativeLayout>
</LinearLayout>
侧面视图的xml<two>
<?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:background="@color/gray"
android:orientation="vertical" >
<RelativeLayout
android:id="@+id/menu_title_1"
android:layout_width="fill_parent"
android:layout_height="48dp"
android:background="@drawable/v_2_0_menu_title_bg_1" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical" >
<Button
android:id="@+id/menu_my_game_btn"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="@drawable/btn_selecor"
android:text="用户信息" />
<ImageView
android:layout_width="1dp"
android:layout_height="30dp"
android:src="@color/white" />
<Button
android:id="@+id/menu_my_down_manager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="@drawable/btn_selecor"
android:text="系统信息" />
</LinearLayout>
</RelativeLayout>
<ListView
android:id="@+id/listview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:cacheColorHint="#00000000"
android:divider="@color/black"
android:dividerHeight="1dp"
android:fadingEdge="none"
android:footerDividersEnabled="false"
android:headerDividersEnabled="false"
android:listSelector="#00000000" >
</ListView>
</LinearLayout>
listView的item视图
<?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:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="@+id/item_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="@+id/item_tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
/>
</LinearLayout>
接下来当然是Activity了:
package app.drawlayout;
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.BitmapFactory.Options;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.util.TypedValue;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.view.WindowManager.LayoutParams;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.TextView;
public class MainActivity extends Activity {
private DrawerLayout mDrawerLayout ;
RelativeLayout left;
private ViewPager mViewPager;
private PagerTabStrip mPagerTitleStrip;
private List<View> viewlist;
int pic[]={R.drawable.back_g3,R.drawable.d,R.drawable.girl,R.drawable.meinv};
private Button button;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
left=(RelativeLayout) findViewById(R.id.left);
ListView list=(ListView) findViewById(R.id.listview);
list.setAdapter(new Myadapter(this));
button = (Button) findViewById(R.id.btn1);
mViewPager=(ViewPager) findViewById(R.id.main_body_layout);
mPagerTitleStrip=(PagerTabStrip) findViewById(R.id.pagertitle);
mPagerTitleStrip.setTextColor(Color.WHITE);
mPagerTitleStrip.setTextSize(TypedValue.COMPLEX_UNIT_DIP, 20);
viewlist=new ArrayList<View>();
for (int i = 0; i <4; i++) {
viewlist.add(getView(pic[i]));
}
mViewPager.setAdapter(new MypagerAdapter());
button.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{
// 按钮按下,将抽屉打开
mDrawerLayout.openDrawer(left);
}
});
}
class Myadapter extends BaseAdapter{
Context context;
public Myadapter(Context context) {
super();
this.context = context;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return 20;
}
@Override
public Object getItem(int position) {
// TODO Auto-generated method stub
return null;
}
@Override
public long getItemId(int position) {
// TODO Auto-generated method stub
return 0;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
convertView=View.inflate(context, R.layout.item, null);
TextView tv=(TextView) convertView.findViewById(R.id.item_tv);
ImageView iv=(ImageView) convertView.findViewById(R.id.item_iv);
Options options=new Options();
options.inSampleSize=3;
Bitmap bmp=BitmapFactory.decodeResource(context.getResources(), R.drawable.meinv, options);
iv.setImageBitmap(bmp);
tv.setText("我是大美女");
return convertView;
}
}
class MypagerAdapter extends PagerAdapter{
@Override
public int getCount() {
// TODO Auto-generated method stub
return 4;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==arg1;
}
@Override
public CharSequence getPageTitle(int position) {
String title="";
switch (position) {
case 0:
title="我是1号";
break;
case 1:
title="我是2号";
break;
case 2:
title="我是3号";
break;
case 3:
title="我是4号";
break;
default:
break;
}
return title;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(viewlist.get(position));
return viewlist.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position,
Object object) {
container.removeView(viewlist.get(position));
}
}
public View getView(int position){
ImageView image=new ImageView(this);
LayoutParams params=new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
image.setLayoutParams(params);
image.setBackgroundDrawable(getResources().getDrawable(position));
return image;
}
}
看到没,就100多行的代码量就实现了侧滑和标题滚动,是不是很简单。
,
下面上几个简单的效果图