Sorry for my English... I will try to explain what I want to do.
I have a project. It can be downloaded at the link:
- https://drive.google.com/file/d/0Bxhi0uFKK3upcXJjNGtMVkg4TDQ/view?usp=sharing
As you can see the screenshot:
- http://pixs.ru/showimage/Screenshot_9509352_15647059.png
The button "Hide/Show B layout" hides and shows the green container - "B layout". I want add animation top down when the container "B layout" is showing. And the animation from the bottom up when the container is hidden. Also, I want the blue container "C", gradually fell together with the container "B". And rising smoothly, together with the container "B". Please help me to do it.
Below duplicate my code:
MainActivity
public class MainActivity extends Activity {
View Layout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Layout = findViewById(R.id.bLayout);
final View button2 = findViewById (R.id.button);
button2.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick (View v){
if ((Layout.getVisibility() == View.VISIBLE))
{
Layout.setVisibility(View.GONE);
}
else
{
// Animation animFadeIn = AnimationUtils.loadAnimation(getApplicationContext(), android.R.anim.slide_in_left);
// Layout.setAnimation(animFadeIn);
Layout.setVisibility(View.VISIBLE);
}
}
});
}
}
I found a solution to the problem. Full lesson and source code can be downloaded here: click here
Or use the code below:
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/header"
android:layout_width="match_parent"
android:layout_height="64dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="16dp"
android:background="#FCF"
android:orientation="horizontal" >
<TextView
android:id="@+id/color"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:background="@drawable/rectangle"
android:fontFamily="sans-serif-light"
android:gravity="center_vertical"
android:text=""
android:textAlignment="center"
android:textStyle="bold" />
<TextView
android:id="@+id/clickme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:fontFamily="sans-serif-light"
android:gravity="center_vertical"
android:text="click_here"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:id="@+id/expandable"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:background="#FFF"
android:orientation="vertical"
android:paddingLeft="4dp" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text2" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Слуга: text3" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text4" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text5" />
</LinearLayout>
MainActivity.java
public class MainActivity extends Activity {
LinearLayout mLinearLayout;
LinearLayout mLinearLayoutHeader;
ValueAnimator mAnimator;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
setTitle("title");
mLinearLayout = (LinearLayout) findViewById(R.id.expandable);
// mLinearLayout.setVisibility(View.GONE);
mLinearLayoutHeader = (LinearLayout) findViewById(R.id.header);
// Add onPreDrawListener
mLinearLayout.getViewTreeObserver().addOnPreDrawListener(
new ViewTreeObserver.OnPreDrawListener() {
@Override
public boolean onPreDraw() {
mLinearLayout.getViewTreeObserver()
.removeOnPreDrawListener(this);
mLinearLayout.setVisibility(View.GONE);
final int widthSpec = View.MeasureSpec.makeMeasureSpec(
0, View.MeasureSpec.UNSPECIFIED);
final int heightSpec = View.MeasureSpec
.makeMeasureSpec(0,
View.MeasureSpec.UNSPECIFIED);
mLinearLayout.measure(widthSpec, heightSpec);
mAnimator = slideAnimator(0,
mLinearLayout.getMeasuredHeight());
return true;
}
});
mLinearLayoutHeader.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (mLinearLayout.getVisibility() == View.GONE) {
expand();
} else {
collapse();
}
}
});
}
private void expand() {
// set Visible
mLinearLayout.setVisibility(View.VISIBLE);
mAnimator.start();
}
private void collapse() {
int finalHeight = mLinearLayout.getHeight();
ValueAnimator mAnimator = slideAnimator(finalHeight, 0);
mAnimator.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationEnd(Animator animator) {
// Height=0, but it set visibility to GONE
mLinearLayout.setVisibility(View.GONE);
}
@Override
public void onAnimationStart(Animator animator) {
}
@Override
public void onAnimationCancel(Animator animator) {
}
@Override
public void onAnimationRepeat(Animator animator) {
}
});
mAnimator.start();
}
private ValueAnimator slideAnimator(int start, int end) {
ValueAnimator animator = ValueAnimator.ofInt(start, end);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
// Update Height
int value = (Integer) valueAnimator.getAnimatedValue();
ViewGroup.LayoutParams layoutParams = mLinearLayout
.getLayoutParams();
layoutParams.height = value;
mLinearLayout.setLayoutParams(layoutParams);
}
});
return animator;
}
}
I faced a similar issue and this is the easiest solution I could find:
setVisibility(View.GONE) on the view you wish to hide.
And make sure in the xml layout the parent has following attribute:
android:animateLayoutChanges="true"
I think you can easily do this by using the AlphaAnimation class. Here is a similar question with an answer.
So I think what you're looking for is how to hook up translate animations to show/hide a view as opposed to just setting the visibility instantly.
Take a look at Show and hide a View with a slide up/down animation. Instead of just setting the visibility, first you run the translate animations, then add the hooks to show or hide the view after they're finished.
If you find that the bottom view is not moving, jump into your Android developer options and enable "Show layout bounds" then you can see the borders for views (animations don't move the actual view bounds). To get the bottom view to animate as well it will also need an translate animation.
