Home » Android » android – Can't get clipChildren=false attribute to work

android – Can't get clipChildren=false attribute to work

Posted by: admin April 23, 2020 Leave a comment

Questions:

I have a yellow RelativeLayout containing a taller red LinearLayout.

In order to make the whole LinearLayout visible, I set android:clipChildren="false", but this does not work as expected:

<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="44dp"
    android:background="#FFFF00"
    android:clipChildren="false" >

    <LinearLayout
        android:layout_width="50dp"
        android:layout_height="100dp"
        android:background="#FF0000"
        android:orientation="vertical" >

    </LinearLayout>

</RelativeLayout>
  • with android:clipChildren="true":

enter image description here

with the red LinearLayout clipped as expected

  • with android:clipChildren="false":

enter image description here

where the LinearLayout height is clipped, and the width set in the layout is not respected.

What’s wrong?

EDIT

If I wrap the container in a LinearLayout with both dimensions matching its parent, I get the same result (I checked that the LinearLayout container’s container fill the whole screen).

<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">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="44dp"
        android:background="#FFFF00"
        android:clipChildren="false" >

        <LinearLayout
            android:layout_width="50dp"
            android:layout_height="100dp"
            android:background="#FF0000"
            android:orientation="vertical" >
        </LinearLayout>
    </RelativeLayout>

</LinearLayout>

EDIT 2

If I put the android:clipChildren="false" attribute in the parent LinearLayout, I get the following:

enter image description here

How to&Answers:

Also set

android:clipToPadding="false"

Beside:

android:clipChildren="false"

Answer:

android:clipChildren="false" allows each child to draw outside of its own bounds, within the parent. It doesn’t allow children to draw outside of the parent itself. For that you would need to set android:clipChildren="false" on the grandparent (as well).

I think what you’re seeing with the colors is just because colors have no inherent bounds. If there is nothing clipping them, colors go forever. My theory is that if you used, say, a stretched 1×1 px image instead of a color, things would be different.

Answer:

A trick which can solve your problem is to add some placeholder view

<View
  android:layout_width="wrap_content"
  android:layout_height="1dp"
  android:background="?android:attr/listDivider"
  android:layout_alignParentBottom="true"/>

in the relative layout and boom!

Explanation

For me the boundary of relative layout seems to be different than the height.
The boundary seems to be where the content ends or where the parent ends. Adding some view to the bottom sets the boudary at the bottom so everything works fine.