Android clipChildren属性

假装你是大灰狼

已于 2023-03-24 16:11:48 修改

阅读量1.6k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Android 控件文章标签： android clipChildren

于 2019-03-14 10:31:00 首次发布

本文链接：https://blog.csdn.net/chennai1101/article/details/88547297

Android 笔记同时被 2 个专栏收录

196 篇文章

订阅专栏

Android 控件

41 篇文章

订阅专栏

本文详细介绍了 Android 中 clipChildren 属性的作用，如何通过设置该属性使子控件超出父布局，并结合 ViewPager 实现画廊效果。通过调整 ViewPager 和其父布局的 clipChildren 属性，以及使用 setOffscreenPageLimit 和 setPageMargin 方法，可以优化画廊的视觉体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. clipChildren属性

clipChildren属性允许子控件超出父布局。例如我们定义父布局高度为30dp，而子控件有50dp，只显示30dp的高度。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:orientation="horizontal">
    <LinearLayout
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:layout_marginTop="40dp"
        android:gravity="center_horizontal"
        android:background="@color/red"
        android:orientation="horizontal">
        <ImageView
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:src="@drawable/icon_wx"/>
    </LinearLayout>
    <LinearLayout
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:layout_marginTop="40dp"
        android:gravity="center_horizontal"
        android:background="@color/blue"
        android:orientation="horizontal">
        <ImageView
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:src="@drawable/icon_wx"
            android:layout_gravity="bottom"/>
    </LinearLayout>
</LinearLayout>

效果如下
在这里插入图片描述
设置父布局的clipChildren属性，默认是true

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="100dp"        
    android:clipChildren="false"
    android:orientation="horizontal">

    ... ...

</LinearLayout>

效果如下
在这里插入图片描述

2. ViewPager实现画廊效果

ViewPager可以实现多个界面的左右滑动。详见Android ViewPager控件。

可以利用clipChildren属性实现画廊效果。在ViewPager和它的父布局都要设置clipChildren属性。

<RelativeLayout
    android:id="@+id/view_clip_pager"
    android:layout_width="match_parent"
    android:layout_height="140dp"
    android:clipChildren="false">
    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager_clip_pager"
        android:layout_width="210dp"
        android:layout_height="100dp"
        android:clipChildren="false"
        android:layout_centerInParent="true"/>
</RelativeLayout>

利用setPageMargin(int marginPixels)设置间隔，setOffscreenPageLimit(int limit)设置缓存页面。

添加手势事件，捕捉ViewPager左右两边的手势事件。

findViewById(R.id.view_clip_pager).setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        vp.dispatchTouchEvent(event);
        return true;
    }
});