Android 布局之DrawLayout

jopen 9年前發布 | 46K 次閱讀 Android開發移動開發 DrawLayout

原文 http://www.cnblogs.com/BobAdmin/p/5037038.html

在剛開始學android的時候肯定會知道，android的主要的布局就是LinearLayout、RelativeLayout、 FramLayout、AbsoluteLayout、以及TableLayout，這是誰都知道的。其他的一些UI就交給了眾多的三方庫。其實，隨著 android的發展壯大，開發者不用再辛苦的去找三方類庫了，android已經擁有了很強大的功能。比如我們不再用pullToRefresh而是用 SwipeRefreshLayout，不再用ViewPagerTabStrip而是用TabLayoutd等等。我們會發現越來越多的布局可以隨心所欲的加入到主布局中了。

因為項目的需要，添加了新功能，側滑菜單，以前我們自然會去網上找一大堆的資料，看一大堆demo，其實原生的android就已經有了這個功能。就是DrawLayout。

下面先看看效果圖：

Android 布局之DrawLayout

可以點擊左側的查詢產品按鈕將側滑欄彈出來，然后在右側進行相應的操作之后點擊確定將右側滑欄收回去。因為只是做的一個比較簡單的demo所以在主界面只放了一張圖。

下面上代碼：

activity_mainactivity.xml：這個文件是來盛放下面的側滑布局（content_main.xml）的

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">
    <include layout="@layout/content_main" />
</LinearLayout>

content_main.xml 這個xml文件是整個主布局以及側滑頁的布局：

<RelativeLayout xmlns:android="

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

    <!-- The main content view -->
    <LinearLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >

        <Button
            android:id="@+id/btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="查詢產品"
            android:layout_gravity="right"/>
       <ImageView
            android:layout_marginTop="15dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@drawable/back"/>
        <TextView
            android:layout_marginTop="55dp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="showSomethingHere"
            />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="somethingElse"
            android:layout_gravity="center_vertical"/>
    </LinearLayout>

    <!-- The navigation drawer -->
    <LinearLayout
        android:layout_width="800dp"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:background="#FDFDFD"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginTop="50dp"
            android:text="產品期限："
            android:textSize="25sp" />

        <include layout="@layout/layout_period"></include>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="30dp"
            android:layout_marginTop="50dp"
            android:text="金額："
            android:textSize="25sp" />

        <include layout="@layout/layout_amount"></include>
        <Button
            android:id="@+id/btn_check"
            style="@style/button_style"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:layout_marginBottom="10dp"
            android:layout_marginRight="20dp"
            android:layout_marginTop="25dp"
            android:paddingBottom="10dp"
            android:paddingLeft="100dp"
            android:paddingRight="100dp"
            android:paddingTop="10dp"
            android:text="確定" />
    </LinearLayout>
</android.support.v4.widget.DrawerLayout>


</RelativeLayout></pre>

另外兩個不怎么重要的布局就不貼上來了，還有一大堆的樣式。。。我們注意到，這個布局要用到 android.support.v4包。 

下面是主要的activity類： 

package hao.zerosoft.com.testdrawlayout;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.widget.DrawerLayout;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
public class MainActivity extends Activity implements View.OnClickListener {

private DrawerLayout mDrawerLayout = null;
private Button btnCheck;
@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    btnCheck=(Button)findViewById(R.id.btn_check);
    Button button = (Button) findViewById(R.id.btn);
    button.setOnClickListener(this);
    btnCheck.setOnClickListener(this);

}

@Override
public void onClick(View v) {
    switch (v.getId()){
        case R.id.btn：//主頁面的查詢產品按鈕
            mDrawerLayout.openDrawer(Gravity.RIGHT);
            break;
        case R.id.btn_check://確定按鈕，可以將側滑頁面的一些操作寫在這里。我們一般都是用消息回調的方式去執行
            mDrawerLayout.closeDrawer(Gravity.RIGHT);
            break;
        default:
            break;
    }
}

}</pre>

項目的源碼在我的文件夾里面可以去查看 ，由于圖片文件比較大，不能上傳，刪除了一些文件。http://i.cnblogs.com/Files.aspx

本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。

轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。

本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！

本文地址：http://www.baiduhome.net/lib/view/open1449809169566.html

Android開發移動開發 DrawLayout

Android 布局之DrawLayout

相關經驗

相關資訊

相關文檔

目錄