devsss devsss devsss devsss - 26 days ago 9
Android Question

Slide Up/Down SurfaceView in ConstraintLayout

I use Constraint Layout as root with 3 subviews:


  • Textview

  • Button

  • SurfaceView (View.Visibility = Gone)



I want when I click on Button, SurfaceView appear (View.Visibility = Visible) from:


Y = - SurfaceView.height


to:


Y = 0


And when I click a second time on the button, SurfaceView disappear (View.Visibility = Gone) from:


Y = 0


to:


Y = - SurfaceView.height


<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">


<TextView
android:id="@+id/title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="Animation"
android:textSize="30sp"
android:gravity="center"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="8dp"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp" />

<Button
android:id="@+id/display_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dsiplay"
android:textSize="30sp"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/title"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginLeft="8dp"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp" />


<SurfaceView
android:id="@+id/animation_view"
android:layout_width="0dp"
android:layout_height="150dp"
android:visibility="gone"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp" />



</android.support.constraint.ConstraintLayout>


MainActivity:

public class MainActivity extends Activity {


boolean isVisible = false;

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);


findViewById(R.id.display_btn).setOnClickListener(new View.OnClickListener() {

@Override
public void onClick(View view) {

isVisible = !isVisible;

if(isVisible){

/*
* Start Animation slide to down
* */

findViewById(R.id.animation_view).animate()
.translationY(0)
.setListener(new AnimatorListenerAdapter() {

@Override
public void onAnimationStart(Animator animation) {

super.onAnimationStart(animation);


findViewById(R.id.animation_view).setY(-findViewById(R.id.animation_view).getHeight());

findViewById(R.id.animation_view).setVisibility(View.VISIBLE);

}

});

}
else {

/*
* Start Animation slide to up
* */


findViewById(R.id.animation_view).animate()
.translationY(-findViewById(R.id.animation_view).getHeight())
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationStart(Animator animation) {

super.onAnimationStart(animation);

}

@Override
public void onAnimationEnd(Animator animation) {

super.onAnimationEnd(animation);

findViewById(R.id.animation_view).setVisibility(View.GONE);

}

});

}

}

});



}
}


When I click for the first time it doesn't work (slide down).

Answer Source

Your SurfaceView doesn't have the correct initial conditions. These conditions correct themselves after going through an animation, so that is why subsequent animations work. Add the following to the SurfaceView XML:

android:translationY="-150dp"

You could also do this in code but you need to do it earlier than in the onClick() handler.