SlidingPaneLayout是V4包中新添加的组件，可以实现两列面板的切换。说先来看看API文档的说明：

1
SlidingPaneLayout provides a horizontal, multi-pane layout for use at the top level of a UI. A left (or first) pane is treated as a content list or browser, subordinate to a primary detail view for displaying content.

SlidingPanelLayout为在UI最上层的使用提供了一个水平的，多个面板的布局。左边的面板可以看作是一个内容列表或者是浏览，右边的面板的任务是显示详细的内容。

SlidingPaneLayout类也是直接继承于ViewGroup类，所以这个类也是当作容器类使用，在使用时通常可以和Fragement组件一起使用。下面是一个xiaoDemo，左边是网站url，右边显示网站。

首先是各个布局文件：

主布局文件actvity_main.xml:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<android.support.v4.widget.SlidingPaneLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/slidingpanellayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >
 
    <fragment
        android:id="@+id/leftfragment"
        android:name="com.example.android_slidingpanellayout1.BookMarkerFragment"
        android:layout_width="100dp"
        android:layout_height="match_parent"
        android:layout_gravity="left" />
 
    <fragment
        android:id="@+id/rightfragment"
        android:name="com.example.android_slidingpanellayout1.ShowFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:layout_weight="1" />
 
</android.support.v4.widget.SlidingPaneLayout>

标签页使用的布局文件（bookmarker.xml）

1
2
3
4
5
6
7
8
9
10
11
12
<?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" >
 
    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
 
</LinearLayout>

内容页使用的布局文件（show.xml）

1
2
3
4
5
6
7
8
9
10
11
12
<?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" >
 
    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
 
</LinearLayout>

标签页中listview使用的布局文件（mytext.xml）:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?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" >
 
    <TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:gravity="center"
        android:textAlignment="center" />
 
</LinearLayout>

标签页的Fragment（BookMarkerFragement.java）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
package com.example.android_slidingpanellayout1;
 
import java.util.ArrayList;
import java.util.List;
 
import android.app.Activity;
import android.app.Fragment;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.ListView;
 
public class BookMarkerFragment extends Fragment {
 
    public interface BookmarkListener {
        public void onChangeBookmark(String bookmark);
    }
 
    public BookmarkListener myActionObject = null;
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.bookmarker, container, false);
        initListView(view);
        return view;
    }
 
    @Override
    public void onAttach(Activity activity) {
 
        if (!(activity instanceof BookmarkListener)) {
            throw new ClassCastException();
        }
        myActionObject = (BookmarkListener) activity;
        super.onAttach(activity);
    }
 
    @Override
    public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
        MenuItem item1 = menu.add(1, 1, 1, "分享");
        item1.setShowAsAction(MenuItem.SHOW_AS_ACTION_WITH_TEXT
                | MenuItem.SHOW_AS_ACTION_ALWAYS);
        ImageView imageView = new ImageView(
                BookMarkerFragment.this.getActivity());
        imageView.setBackgroundResource(R.drawable.share);
        imageView.setLayoutParams(new LayoutParams(50, 50));
        item1.setActionView(imageView);
 
    }
 
    // 初始化listview
    public void initListView(View view) {
        ListView lv = (ListView) view.findViewById(R.id.listview);
        List<String> list = new ArrayList<String>();
        list.add("网易");
        list.add("腾讯");
        list.add("新浪");
        list.add("搜狐");
        ArrayAdapter adapter = new ArrayAdapter(
                BookMarkerFragment.this.getActivity(), R.layout.mytextview,
                R.id.text, list);
        lv.setAdapter(adapter);
 
        lv.setOnItemClickListener(new OnItemClickListener() {
 
            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1,
                    int position, long arg3) {
                switch (position) {
                case 0:
                    myActionObject.onChangeBookmark("http://www.163.com");
                    break;
                case 1:
                    myActionObject.onChangeBookmark("http://www.qq.com");
                    break;
                case 2:
                    myActionObject.onChangeBookmark("http://www.sina.com");
                    break;
                case 3:
                    myActionObject.onChangeBookmark("http://www.sohu.com");
                    break;
 
                }
            }
 
        });
 
    }
}

内容页面（ShowFragment.java）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
package com.example.android_slidingpanellayout1;
 
import android.app.Activity;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.webkit.WebView;
 
public class ShowFragment extends Fragment {
 
    WebView webview=null;
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.show, container, false);
        webview=(WebView) view.findViewById(R.id.webview);
        return view;
    }
 
    @Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
    }
     
    public WebView getWebView()
    {
        return webview;
    }
}

主界面（MainActivity.java）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
package com.example.android_slidingpanellayout1;
 
/*
 * 
 * 实现一个书签的小例子
 * 
 * 
 */
import com.example.android_slidingpanellayout1.BookMarkerFragment.BookmarkListener;
 
import android.os.Bundle;
import android.app.ActionBar;
import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentTransaction;
import android.support.v4.widget.SlidingPaneLayout;
import android.support.v4.widget.SlidingPaneLayout.PanelSlideListener;
import android.view.Menu;
import android.view.View;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;
 
public class MainActivity extends Activity implements BookmarkListener {
 
    Fragment bookmarkerFragment;
    Fragment showFragment;
    SlidingPaneLayout spl = null;
    ActionBar actionBar = null;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        actionBar = this.getActionBar();
        actionBar.setDisplayShowTitleEnabled(false);
        actionBar.setDisplayHomeAsUpEnabled(true);
        spl = (SlidingPaneLayout) this.findViewById(R.id.slidingpanellayout);
        spl.setPanelSlideListener(new PanelSlideListener() {
            @Override
            public void onPanelClosed(View view) {
                MainActivity.this.getFragmentManager()
                        .findFragmentById(R.id.leftfragment)
                        .setHasOptionsMenu(false);
            }
 
            @Override
            public void onPanelOpened(View viw) {
                MainActivity.this.getFragmentManager()
                        .findFragmentById(R.id.leftfragment)
                        .setHasOptionsMenu(true);
            }
 
            @Override
            public void onPanelSlide(View arg0, float arg1) {
 
            }
        });
    }
 
    @Override
    public void onChangeBookmark(String bookmark) {
        ShowFragment sf = (ShowFragment) MainActivity.this.getFragmentManager()
                .findFragmentById(R.id.rightfragment);
        WebView webView = sf.getWebView();
        WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        WebViewClient client = new WebViewClient();
        webView.setWebViewClient(client);
        webView.loadUrl(bookmark);
 
    }
 
}

实现效果：

SlidingPaneLayout的基本使用的更多相关文章

  1. Android实现侧边栏SlidingPaneLayout

    //主布局 1 <?xml version="1.0" encoding="utf-8"?> <android.support.v4.widg ...

  2. 利用SlidingPaneLayout实现侧滑

    利用SlidingPaneLayout实验仿QQ侧滑效果 1.效果图            2.布局文件 <?xml version="1.0" encoding=" ...

  3. 淘宝(阿里百川)手机客户端开发日记第三篇 SlidingPaneLayout实现侧滑菜单

    需要的三个布局文件: activity_main.xml :主窗体布局 left.xml : 左侧栏目分类布局 right.xml : 右侧内容详情 需要的组件: android.support.v4 ...

  4. 侧菜单栏的实现SlidingPaneLayout

    SlidingPaneLayout分为两部分,上面的 左划出部分和没划出的时候 <?xml version="1.0" encoding="utf-8"? ...

  5. Android UI开发第三十四篇——SlidingPaneLayout

    SlidingPaneLayout也是系统支持的高级控件,是Android团对在2013 google IO大会期间更新的Support库(Version 13)中新加入的重要的功能.它支持左右滑动菜 ...

  6. 使用SlidingPaneLayout 实现仿微信的滑动返回

    上周,公司的项目改版要求加上一个右滑返回上一个界面,于是就在网上找了一些开源库打算实现.但是在使用的时候遇见了许多的问题.试了两天用过 https://github.com/ikew0ng/Swipe ...

  7. Android中禁止SlidingPaneLayout的侧滑功能

    Android中使用android.support.v4.widget.SlidingPaneLayout实现侧滑功能的时候,可能出现滑动屏幕时与SlidingPaneLayout的侧滑发生冲突,查看 ...

  8. Android-通过SlidingPaneLayout高仿微信6.2最新版手势滑动返回(一)

    近期更新了微信版本号到6.2.发现里面有个很好的体验,就是在第二个页面Activity能手势向右滑动返回,在手势滑动的过程中能看到第一个页面,这样的体验很赞,这里高仿了一下. 这里使用的是v4包里面的 ...

  9. AndroidProjects个人项目归纳

    AndroidProjects 个人总结归纳-目录大纲 Data Binding框架MVVM BaseView CollapseView 更新中... 项目地址:https://github.com/ ...

随机推荐

  1. MYSQL数据库错误代码提示汇总

    Mysql出错代码表 1005:创建表失败 1006:创建数据库失败 1007:数据库已存在,创建数据库失败 1008:数据库不存在,删除数据库失败 1009:不能删除数据库文件导致删除数据库失败 1 ...

  2. uboot命令分析+实现【转】

    转自:http://xouou.iteye.com/blog/2150061 先贴一个重要结构,位于uboot/include/command.h,这个结构代表每个uboot命令 struct cmd ...

  3. OSX 升级 vim

    善用 Homebrew 神器啊,少年!Homebrew - The missing package manager for OS X安装完成后打开终端输入: brew install vim --wi ...

  4. AOJ - 0009 Prime Number (素数筛法） && AOJ - 0005 (求最大公约数和最小公倍数)

    http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=34870 求n内的素数个数. /* ********************* ...

  5. Newtonsoft.Json序列化和反序列之javascriptConvert.SerializeObject，DeserializeObject，JsonWriter，JsonReader

    这里下载:http://www.newtonsoft.com/products/json/安装:   1.解压下载文件,得到Newtonsoft.Json.dll   2.在项目中添加引用.. jav ...

  6. 【Android】MTK Android 编译命令

    命令格式:./maketek [option] [project] [action] [modules] Option: -t ,-tee :输出log信息到当前终端 -o , -opt=-- : 编 ...

  7. 观察者模式最佳案例实现[JAVA][原创]

    /** * American Stock Exchange market(ASE) has a list of stocks.A stock object has two perspective in ...

  8. Selenium系列教程(2)

    Selenium RC(Selenium远程控制) Selenium RC是一个用Java编写的,允许用户使用无论哪种编程语言对基于Web的应用程序构建测试脚本的工具.Selenium RC克服了Se ...

  9. bzoj4026

    直接按照欧拉函数的计算方式来即可 φ=区间积*区间出现(质数-1)的积/区间出现过的质数的积 区间积是满足类似区间减法的操作的(利用逆元) 由于强制在线,上主席树就可以了(维护每个质数上次出现的位置p ...

  10. Intellij IDEA13 创建多模块Maven项目

    目标:构建一个类似于如下图所示的这种结构的Maven项目. 首先,需要选中“File”——>“New Project”如下图所示 选中“Maven”,设置项目名称与项目构建地址,点击“Next” ...