您的位置:首页 > 移动开发 > Android开发

android学习日记(八):抽屉效果

2016-01-08 20:15 651 查看

一.抽屉效果-SlidingDrawer

效果图就不上传了,也就是从底部或者右边拉出来一个窗体
先张贴下布局文件:
<LinearLayout 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:orientation="vertical"
    tools:context="com.example.slidingdrawer.MainActivity" >
    <!--用FrameLayout来实现布局的覆盖 如果没有FrameLayout那么主布局需要为SlidingDrawer放置一块区域-->
    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        >
	
      <LinearLayout
        android:id="@+id/linearlayout"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:background="#000000">
        
    </LinearLayout>
    
    <SlidingDrawer
        android:id="@+id/slidingdrawer"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:handle="@+id/handle"
        android:content="@+id/content"
        android:orientation="horizontal">
        <ImageButton
            android:layout_width="44dp"
            android:layout_height="44dp"
            android:id="@id/handle"
            android:src="@android:drawable/btn_default"/>
        <LinearLayout
            android:id="@id/content"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="#ffffff">
            <TextView
                android:id="@+id/tv"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="这是slidingdrawer"
                android:gravity="center_vertical|center_horizontal"
                android:textSize="28sp"/>
        </LinearLayout> 
    </SlidingDrawer>
</FrameLayout>
</LinearLayout>


android:handle="@+id/handle"表示手柄,一般为一个ImageView

android:content="@+id/content"表示隐藏的内容

下面张贴MainActivity的代码:
public class MainActivity extends Activity {
    private SlidingDrawer slidingDrawer;
    private TextView tv;
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
	    slidingDrawer=(SlidingDrawer) findViewById(R.id.slidingdrawer);
	    tv=(TextView) findViewById(R.id.tv);
	    //抽屉打开时调用的事件
	    slidingDrawer.setOnDrawerOpenListener(new OnDrawerOpenListener() {
			public void onDrawerOpened() {
				Toast.makeText(getApplicationContext(), "抽屉打开", 0).show();
			}
		}) ;
	    //抽屉关闭时候调用的事件
	    slidingDrawer.setOnDrawerCloseListener(new OnDrawerCloseListener() {			
			public void onDrawerClosed() {
				Toast.makeText(getApplicationContext(), "抽屉关闭", 0).show();
			}
		});
	    //滚动的时候调用的方法
	    slidingDrawer.setOnDrawerScrollListener(new OnDrawerScrollListener() {
			public void onScrollStarted() {
				tv.setText("开始滚动");
			}
			
			@Override
			public void onScrollEnded() {
				tv.setText("结束滚动");
			}
		});
	}
}


二.抽屉效果-DrawerLayout

效果图如下:



很简单,没什么好说的,直接张贴代码:
布局文件:
<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="#88ffffff"
    tools:context="com.example.drawlayoutdemo.MainActivity" >

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <!-- DrawerLayout的第一个子元素为抽屉还没有打开时显示的布局,设置了一个ImageButton -->

        <FrameLayout
            android:id="@+id/framelayout"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >

            <ImageButton
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:src="@android:drawable/btn_radio" />
        </FrameLayout>

        <!--
           DrawerLayout的第二个元素为抽屉内容,为抽屉打开的界面,android:layout_gravity="left"
           表示为左边拉出,反之则为右边拉出
        -->

        <ListView
            android:id="@+id/listview"
            android:layout_width="240dp"
            android:layout_height="fill_parent"
            android:layout_gravity="left"
            android:background="#ffffff"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp" />
    </android.support.v4.widget.DrawerLayout>

</RelativeLayout>


MainActivity的代码:
package com.example.drawlayoutdemo;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.widget.DrawerLayout;
import android.support.v4.widget.DrawerLayout.DrawerListener;
import android.util.Log;
import android.view.Gravity;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ImageButton;
import android.widget.ListView;
import android.widget.Toast;

public class MainActivity extends Activity {
    protected static final String TAG = "MainActivity";
	private ImageButton button;
    private DrawerLayout drawer_layout;
    private ListView listview;
    private String[] str;
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
	    initView();
	    listview.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1,str));
        //当点击按钮的时候打开DrawerLayout
	    button.setOnClickListener(new OnClickListener() {
			public void onClick(View v) {
				//打开DrawerLayout
				drawer_layout.openDrawer(Gravity.LEFT);
			}
		});
        listview.setOnItemClickListener(new OnItemClickListener() {
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
			    Toast.makeText(getApplicationContext(), str[position], 0).show();
			}   
        });
        
        /**
         * 设置DrawerLayout的监听事件
         */
        drawer_layout.setDrawerListener(new DrawerListener() {
            /**
             * 抽屉滑动状态改变的时候调用
             * 状态值是STATE_IDLE(闲置--0), STATE_DRAGGING(拖拽的--1), 
             * STATE_SETTLING(固定--2)中之一。 
             */
			public void onDrawerStateChanged(int arg0) {
				switch(arg0){
				case 0:
					Log.i(TAG, "STATE_IDLE空闲");
					break;
				case 1:
					Log.i(TAG, "STATE_DRAGGING拖拽");
				    break;
				case 2:
					Log.i(TAG, "STATE_SETTLING固定");
					break;
				}
			}
			
			/**
			 * 抽屉滑动的时候调用的方法
			 * arg1表示滑动的幅度(0-1)
			 */
			public void onDrawerSlide(View arg0, float arg1) {
				Log.i(TAG, arg1+"");
			}
			/**
			 * 抽屉完全打开的时候调用的方法
			 */
			public void onDrawerOpened(View arg0) {
				Log.i(TAG, "抽屉完全被打开");
			}
			/**
			 * 抽屉完全关闭的时候调用的方法
			 */
			public void onDrawerClosed(View arg0) {
				Log.i(TAG, "抽屉完全被关闭");
			}
		});
	}
    
    private void initView(){
    	button=(ImageButton) findViewById(R.id.button);
		listview=(ListView) findViewById(R.id.listview);
		drawer_layout=(DrawerLayout) findViewById(R.id.drawer_layout);
		str=new String[]{"条目一","条目二","条目三"};
		
    }
	
}


代码很简单,需要记住的就两个方法一个是打开Drawerlayout drawer_layout.openDrawer(Gravity.LEFT);

另一个是设置监听事件 drawer_layout.setDrawerListener(new DrawerListener() {}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: