Home/ Questions/Q 7888399
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T05:49:20+00:00

I am using a translate animation to move an egg(ImageButton) outside of the carton(ImageView),

  • 0

I am using a translate animation to move an egg(ImageButton) outside of the carton(ImageView), but it is consistently clipping, so I looked all over stackoverflow to find a solution, but after trying to implement all the solutions, it is still clipped.

Can anyone shed some light onto why mine is still clipping, here is the XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:gravity="top" 
  android:clipChildren="false"
  android:clipToPadding="false" 
  android:layout_height="match_parent">
<ImageButton 
  android:id="@+id/imageButton1" 
  android:background="@drawable/transparentblackbackground" 
  android:layout_below="@+id/relativeLayout1" 
  android:layout_height="match_parent" 
  android:layout_width="match_parent"
  android:clipChildren="false" android:clipToPadding="false" >
</ImageButton>

<!-- Total Carton for Animation -->
<RelativeLayout
    android:orientation="vertical"
    android:layout_width="440dp"
    android:id="@+id/opencarton" 
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:clipChildren="false"
    android:clipToPadding="false" >



    <!-- The carton that holds the eggs -->
    <RelativeLayout 
        android:orientation="vertical"
        android:layout_width="260dp"
        android:id="@+id/opencarton" 
        android:layout_height="512dp"
        android:layout_centerInParent="true"
        android:clipChildren="false"
        android:clipToPadding="false">

        <ImageButton 
          android:id="@+id/blackbgnd" 
          android:background="@drawable/clearbackground"
          android:layout_height="600dp" 
          android:layout_width="400dp"
          android:clipChildren="false" 
          android:clipToPadding="false"
          android:gravity="center">
        </ImageButton>

        <!-- Top of Carton image -->
        <ImageView 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:id="@+id/topcomponent" 
            android:src="@drawable/topofcarton" 
            android:layout_alignParentTop="true" 
            android:layout_alignParentRight="true"
            android:clipChildren="false"
            android:clipToPadding="false">
        </ImageView>

        <!-- First Row Of eggs goes here in future -->    
        <ImageButton android:clipChildren="false" android:clipToPadding="false" android:layout_height="158dp" android:id="@+id/egg1" android:background="@drawable/goldegg" android:layout_width="79dp" android:layout_alignTop="@id/topcomponent" android:layout_alignParentLeft="true" android:layout_marginLeft="10dp" android:layout_marginTop="3dp"></ImageButton>
        <ImageButton android:clipChildren="false" android:clipToPadding="false" android:layout_height="158dp" android:id="@+id/egg2" android:background="@drawable/goldegg" android:layout_width="79dp" android:layout_alignTop="@id/topcomponent" android:layout_alignParentLeft="true" android:layout_marginLeft="90dp" android:layout_marginTop="3dp"></ImageButton>
        <ImageButton android:clipChildren="false" android:clipToPadding="false" android:layout_height="158dp" android:id="@+id/egg3" android:background="@drawable/goldegg" android:layout_width="79dp" android:layout_alignTop="@id/topcomponent" android:layout_alignParentLeft="true" android:layout_marginLeft="170dp" android:layout_marginTop="3dp"></ImageButton>

       ................ 

</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Ok, I wasted about one hour solving a similar problem.

    I suppose that you are animating the object “manually” using some transformations or so and calling postInvalidateDelayed() or similar to force a refresh.

    The problem is (was for me) that you need to call it on the top view, because otherwise the canvas gets clipped automatically to the item you are refreshing. So calling invalidate() (or similar) on the very top view should cause redraw with canvas that is not clipped too much.

    In your case, I noticed you have two “opencarton” ids defined, you should be probably refreshing the top one or the very top RelativeLayout.

    • 0