Position view outside of ConstraintLayout

Question

I want to position views outside of a ConstraintLayout to animate them with a sliding animation. I've tried setting contraints like constraintBottom_toTopOf="parent" but the View stays inside the container.

Note that I want to achieve this with constraints to use built-in animations, not with in-code animations.

Any idea how I could do this ?

I'm using compile 'com.android.support.constraint:constraint-layout:1.1.0-beta1' with Android Studio 3.0 Beta 7

This is a simple xml file that should place the view outside of the container :

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="@color/colorAccent">

    <View
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="@color/colorPrimary"
        app:layout_constraintBottom_toTopOf="parent"/>


</android.support.constraint.ConstraintLayout>

But this is the result

Answer 1

This appears to be an issue with ConstraintLayout 1.1.0-beta1; It works as expected in ConstraintLayout 1.1.0-beta3.

Update to ConstraintLayout 1.1.0-beta3. I will also note that you need to constrain your view horizontally by doing something like the following.

<View
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:background="@color/colorPrimary"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintBottom_toTopOf="parent" />

On a side note, negative margins are not accepted in ConstraintLayout. See this Stack Overflow question regarding negative margins and ConstraintLayout.

Answer 2

In every view you can use negative margin, which will put the view outside of the parent view, and then set the clipping parameters.

android:clipChildren="false"
android:clipToPadding="false"

this will make the view not to clip.

Answer 3

I got another way to solve the problem:

1.Add a anchor(anchor_left) layout_constraintStart_toStartOf="parent".

2.Add YourView layout_constraintEnd_toStartOf="@+id/anchor_left"

That's it!

code:

<android.support.constraint.ConstraintLayout>
    <View
        android:id="@+id/anchor_left"
        app:layout_constraintStart_toStartOf="parent"/>

    <YourView
        android:id="@+id/ll_left"
        app:layout_constraintEnd_toStartOf="@+id/anchor_left"/>
</android.support.constraint.ConstraintLayout>