Can't get clipChildren=false attribute to work

Question

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

the relative layout has android:layout_height="44dp". it is itself cliped by its parent — njzk2, Apr 12 '13 at 15:52
I set this layout directly with setContentView(R.layout.test);. There is no explicit parent. Doesn't the root Viewgroup fill the whole screen? And why is the width of the LinearLayout modified? — jul, Apr 12 '13 at 16:02
@njzk2: in order to do more test, I tried a different layout, and it still does not work (see my edit) — jul, Apr 12 '13 at 16:52
you have to put the android:clipChildren="false" in the parent LinearLayout — njzk2, Apr 13 '13 at 08:50
@jul and others here is the explanation: https://stackoverflow.com/a/53654808/294884 — Fattie, Apr 14 '21 at 12:21

score 96 · Answer 1 · answered Oct 23 '14 at 13:08

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 1x1 px image instead of a color, things would be different.

score 29 · Accepted Answer · edited Dec 12 '17 at 21:30

29

Also set

android:clipToPadding="false"

Beside:

android:clipChildren="false"

edited Dec 12 '17 at 21:30

aaaidan

7,093
8
66
102

answered Oct 24 '16 at 08:01

Morteza Rastgoo

6,772
7
40
61

1

This is **wrong**. The actual answer is : https://stackoverflow.com/a/53654808/294884 – Fattie Apr 14 '21 at 12:21

score 0 · Answer 3 · edited Jun 20 '20 at 09:12

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.

Can't get clipChildren=false attribute to work

3 Answers3

Explanation

Linked