Android布局属性android:clipToPadding的UI设计妙用

标签: android
13532人阅读 评论(1) 收藏 举报
分类:


Android布局属性android:clipToPadding的UI设计妙用


一个简单的UI效果场景。顶部一个半透明Toolbar,然后下面是一个ListView,要求ListView在初始状态下(即未触发任何滑动事件情况下)的item全部在Toolbar下面显示,当用户的手指由下往上滑动翻动时候,ListView的item滚动到Toobar下面。
这样的抽象描述比较晦涩难懂,现在给出两张图加以说明,

图1 (初始、静止状态):



图2(滑动状态):


图1就是全部的View在初始静止状态下的情况,图2即为ListView滑入到Toolbar下方后的效果,实现如此效果,其中一个策略就是使用Android的布局属性:android:clipToPadding
默认android:clipToPadding的值为true。当把android:clipToPadding的属性设置为false时候即可实现图1,图2的效果。

现给出全部用以说明android:clipToPadding作用的代码。
测试用的主Activity MainActivity.java :

package zhangphil.listview;

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class MainActivity extends Activity {

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

		Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
		mToolbar.setLogo(R.drawable.ic_launcher);
		mToolbar.setTitle("zhangphil");

		ListView lv = (ListView) findViewById(R.id.listView);

		String[] data = new String[50];
		for (int i = 0; i < data.length; i++) {
			data[i] = "数据" + i;
		}

		ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_list_item_1, data);
		lv.setAdapter(adapter);
	}
}


MainActivity.java需要的布局文件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" >

    <android.support.v7.widget.Toolbar
        xmlns:app="http://schemas.android.com/apk/res/com.example.toolbar"
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#29b6f6"
        android:minHeight="50dip" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="我的标题栏" />
    </android.support.v7.widget.Toolbar>

    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false"
        android:paddingTop="50dip" />

</RelativeLayout>


注意android:clipToPadding。

4
4

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:1414948次
    • 积分:18607
    • 等级:
    • 排名:第551名
    • 原创:509篇
    • 转载:13篇
    • 译文:2篇
    • 评论:270条
    关于我
    邮箱: zhangphil@live.com
    博客专栏
    最新评论