I'm trying to reproduce this animation from an iOS app in Android. and I'm stuck
If anyone knows how to create them will be deeply grateful. Don't mind the logo in the center, just those rings pulsating. (is possible 3 at a time, short break, repeat)
Here's a possible solution, but it's quite ugly and I'm sure something nicer can be made
3 imageviews one on top of eachother
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
>
<ImageView
android:id="#+id/imageView_circle1"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
app:srcCompat="#drawable/circle"
/>
<ImageView
android:id="#+id/imageView_circle2"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
app:srcCompat="#drawable/circle"
/>
<ImageView
android:id="#+id/imageView_circle3"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
app:srcCompat="#drawable/circle"
/>
<ImageView
android:id="#+id/imageView_logo"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:scaleType="fitCenter"
app:srcCompat="#drawable/logo"
/>
</RelativeLayout>
a drawable circle.xml
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#DDDDDD"/>
</shape>
an animation zoom_and_fade.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:fillAfter="false">
<alpha
android:duration="3500"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
<scale
android:duration="3500"
android:fromXScale="0"
android:fromYScale="0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="50"
android:toYScale="50" />
</set>
on Activity:
imageView_circle1 = (ImageView) findViewById(R.id.imageView_circle1);
imageView_circle2 = (ImageView) findViewById(R.id.imageView_circle2);
imageView_circle3 = (ImageView) findViewById(R.id.imageView_circle3);
anim1 = AnimationUtils.loadAnimation(this, R.anim.zoom_and_fade);
anim2 = AnimationUtils.loadAnimation(this, R.anim.zoom_and_fade);
anim3 = AnimationUtils.loadAnimation(this, R.anim.zoom_and_fade);
anim2.setStartOffset(800);
anim3.setStartOffset(1600);
imageView_circle1.startAnimation(anim1);
imageView_circle2.startAnimation(anim2);
imageView_circle3.startAnimation(anim3);
anim2.setAnimationListener(new Animation.AnimationListener() {
#Override public void onAnimationStart(Animation animation) {
}
#Override public void onAnimationEnd(Animation animation) {
imageView_circle1.startAnimation(anim1);
imageView_circle2.startAnimation(anim2);
imageView_circle3.startAnimation(anim3);
}
#Override public void onAnimationRepeat(Animation animation) {
}
});
I don't think you can achieve same result with only XML.
This is really rough code (Literally 5 minutes) using canvas. But I think with some minor changes you can get really nice Animation.
Check out the video. https://www.youtube.com/watch?v=378Jjc4amD8.
I'll improve if you like it.
public class CircleAnimationView extends View {
private Paint[] paints = new Paint[3];
private int[] colors = new int[3];
private float[] circleRadius = new float[3];
public CircleAnimationView(Context context) {
super(context);
init();
}
public CircleAnimationView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
private void init() {
colors[0] = ContextCompat.getColor(getContext(), R.color.gray1);
colors[1] = ContextCompat.getColor(getContext(), R.color.gray2);
colors[2] = ContextCompat.getColor(getContext(), R.color.gray3);
for (int i = 0; i < paints.length; i++) {
paints[i] = new Paint();
paints[i].setAntiAlias(true);
paints[i].setStyle(Paint.Style.FILL);
paints[i].setColor(colors[i]);
}
}
public void startCircleAnimation() {
CircleRadiusAnimation animation = new CircleRadiusAnimation();
animation.setDuration(1500);
animation.setRepeatCount(Animation.INFINITE);
startAnimation(animation);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, circleRadius[0], paints[0]);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, circleRadius[1], paints[1]);
canvas.drawCircle(getWidth() / 2, getHeight() / 2, circleRadius[2], paints[2]);
}
private class CircleRadiusAnimation extends Animation {
public CircleRadiusAnimation() {
setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
reset();
}
});
}
public void reset() {
circleRadius[0] = 0;
circleRadius[1] = 0;
circleRadius[2] = 0;
CircleAnimationView.this.requestLayout();
CircleAnimationView.this.invalidate();
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation transformation) {
circleRadius[0] += 10;
if (interpolatedTime > 0.3) {
circleRadius[1] += 10;
Log.d("animate", "2nd circle");
}
if (interpolatedTime > 0.6) {
circleRadius[2] += 10;
Log.d("animate", "3nd circle");
}
CircleAnimationView.this.requestLayout();
CircleAnimationView.this.invalidate();
}
}
}}
Related
I'm trying to implement one of this animation where the border radius of the button should change on time. I'm confused with value animator concept.here is my code.
shape.xml file
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#color/colorPrimary"/>
<corners android:radius="5dp"/>
</shape>
button in my view
<Button
android:id="#+id/button"
style="#android:style/Widget.Material.Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="12dp"
android:background="#drawable/shape"
android:onClick="onclick"
android:text="#string/click_me"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintCircleRadius="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:targetApi="lollipop" />
public class ExampleActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_example);
findViewById(R.id.button).setOnClickListener(listener);
}
private final View.OnClickListener listener = new View.OnClickListener() {
#Override
public void onClick(View v) {
final float fromRadius = getResources().getDimension(R.dimen.start_corner_radius);
final float toRadius = v.getHeight() / 2;
final GradientDrawable gd = (GradientDrawable) v.getBackground();
final ValueAnimator animator = ValueAnimator.ofFloat(fromRadius, toRadius);
animator.setDuration(2000)
.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator animation) {
float value = (float) animation.getAnimatedValue();
gd.setCornerRadius(value);
}
});
animator.start();
}
};
}
I need to create animation where I will display 3 images. Each image should completely fade in and fade out (slow blink) and then next image should be shown. I have done it by creating 3 animations. Each animation starts the next animation in onAnimationEnd listener:
private void startAnimation() {
final Animation aniIn = AnimationUtils.loadAnimation(this,
R.anim.fade_in_out);
final Animation aniIn1 = AnimationUtils.loadAnimation(this,
R.anim.fade_in_out);
final Animation aniIn2 = AnimationUtils.loadAnimation(this,
R.anim.fade_in_out);
aniIn.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
ivRandom0.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationEnd(Animation animation) {
ivRandom0.setVisibility(View.INVISIBLE);
ivRandom1.startAnimation(aniIn1);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
aniIn1.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
ivRandom1.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationEnd(Animation animation) {
ivRandom1.setVisibility(View.INVISIBLE);
ivRandom2.startAnimation(aniIn2);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
aniIn2.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
ivRandom2.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationEnd(Animation animation) {
showFinal();
}
#Override
public void onAnimationRepeat(Animation animation) {
}
});
ivRandom0.startAnimation(aniIn);
}
For that animation I have this xml which sets alhpa from 0 to 1 and back to 0:
fade_in_out.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<alpha
android:duration="300"
android:fromAlpha="0"
android:interpolator="#android:anim/accelerate_decelerate_interpolator"
android:toAlpha="1"
android:repeatCount="1"
android:repeatMode="reverse"
/>
</set>
here is my layout:
<RelativeLayout
android:id="#+id/images_wrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="#+id/iv_image_random_0"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/img_generator0"
android:visibility="visible" />
<ImageView
android:id="#+id/iv_image_random_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/img_generator1"
android:visibility="invisible" />
<ImageView
android:id="#+id/iv_image_random_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/img_generator2"
android:visibility="invisible" />
</RelativeLayout>
Although this is working, I don't like the nested callbacks. It is also causing memory leak as it is holding reference to imageviews in calbacks.
Is there a better way how to create this kind of animation? Or at least avoid the memory leak? I was trying imageswitcher, but it is causing cross fading of images which I don't want.
Thank you!
you can use ObjectAnimator , it has methods to setDuration and start delays , which you can calculate according to your need.
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(imageView, "alpha",0, 1);
objectAnimator.setDuration(DEFAULT_ANIMATION_DURATION);
objectAnimator.setStartDelay(milliseconds);
objectAnimator.start();
you can create three different object animators to set accordinglt . for more refer this link
You can use viewswitcher to implement this behaviour. Please see the code below:
layout
<ViewSwitcher
android:id="#+id/switcher"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:inAnimation="#anim/fade_in"
android:outAnimation="#anim/fade_out" >
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="#drawable/sunset" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="#drawable/clouds" />
</ViewSwitcher>
code
((ViewSwitcher) findViewById(R.id.switcher)).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
ViewSwitcher switcher = (ViewSwitcher) v;
if (switcher.getDisplayedChild() == 0) {
switcher.showNext();
} else {
switcher.showPrevious();
}
}
});
Please refer this link
I'm trying to use TranslateAnimation to move a profile picture to the top when item is clicked.
I found the correct position (x, y) but the profile picture doesn't come out of his item area.
I tried to use bringToFront() method but it doesn't work.
My problem here
Code to animate my view
public void animateContactAdding(View view) {
View profileImage = view.findViewById(R.id.linear_layout_image_profile);
int positionViewContact[] = {0, 0};
profileImage.getLocationOnScreen(positionViewContact);
int positionHeader[] = {0, 0};
mRelativeLayoutContactHeader.getLocationOnScreen(positionHeader);
float distanceBtwViews = (positionViewContact[1] - positionHeader[1]) * -1;
TranslateAnimation anim = new TranslateAnimation(0, 0, 0, distanceBtwViews);
anim.setDuration(400);
anim.setAnimationListener(new TranslateAnimation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
});
profileImage.startAnimation(anim);
}
Item
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?android:attr/listPreferredItemHeight">
<LinearLayout
android:id="#+id/linear_layout_image_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/circle_image_placeholder"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="10dp" />
<ImageView
android:id="#+id/circle_image_profile"
android:layout_width="?android:attr/listPreferredItemHeight"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="10dp" />
</LinearLayout>
<TextView
android:id="#android:id/text2"
android:layout_width="match_parent"
android:layout_height="26dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_toEndOf="#+id/linear_layout_image_profile"
android:ellipsize="marquee"
android:lines="1"
android:visibility="gone" />
<TextView
android:id="#android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#android:id/text2"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:layout_alignWithParentIfMissing="true"
android:layout_toEndOf="#+id/linear_layout_image_profile"
android:ellipsize="marquee"
android:gravity="center_vertical"
android:lines="1"
android:textAppearance="#style/TextAppearance.RalewaySemiBold"
android:textSize="17sp" />
</RelativeLayout>
Probably you are animating a entire layout. Try to apply the animation only on ImageView and see what happens:
public void animateContactAdding(View view) {
int positionViewContact[] = {0, 0};
profileImage.getLocationOnScreen(positionViewContact);
int positionHeader[] = {0, 0};
mRelativeLayoutContactHeader.getLocationOnScreen(positionHeader);
float distanceBtwViews = (positionViewContact[1] - positionHeader[1]) * -1;
TranslateAnimation anim = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0.0F, Animation.RELATIVE_TO_SELF, 0.0F,
Animation.RELATIVE_TO_SELF, 2.0F, Animation.RELATIVE_TO_SELF, 0.0F
);
anim.setDuration(2000);
anim.setFillAfter(true);
anim.setAnimationListener(new TranslateAnimation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
}
});
view.startAnimation(anim);
}
I'm trying to go around different functionality integrated with Android Material Design but I can't to do this type of animation when a view fill another like that :
Do you know how to do it or a library/project an example that does this?
I tried to implement this below API 21
add gradle dependancy
dependencies {
compile 'com.github.ozodrukh:CircularReveal:1.0.6#aar'
}
My activity xml is
activity_reval_anim.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".RevalAnimActivity">
<ImageView
android:id="#+id/img_top"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="#color/color_primary"
android:src="#drawable/ala"/>
<io.codetail.widget.RevealLinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="#+id/img_top"
android:background="#color/color_primary">
<LinearLayout
android:visibility="invisible"
android:id="#+id/ll_reveal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/color_accent"
android:orientation="horizontal"
></LinearLayout>
</io.codetail.widget.RevealLinearLayout>
<ImageButton
android:id="#+id/img_floating_btn"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentRight="true"
android:layout_marginRight="40dp"
android:layout_marginTop="170dp"
android:background="#drawable/expand_btn"/>
</RelativeLayout>
My Activity java is
RevalAnimActivity.java
public class RevalAnimActivity extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_reval_anim);
final ImageButton mFloatingButton = (ImageButton) findViewById(R.id.img_floating_btn);
mFloatingButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
animateButton(mFloatingButton);
}
});
}
private void animateButton(final ImageButton mFloatingButton) {
mFloatingButton.animate().translationXBy(0.5f).translationY(150).translationXBy(-0.9f)
.translationX(-150). setDuration(300).setListener(new AnimatorListenerAdapter() {
#Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
animateReavel((int) mFloatingButton.getX(), 150,mFloatingButton);
}
});
}
private void animateReavel(int cx, int cy, final ImageButton mFloatingButton) {
final View myView = findViewById(R.id.ll_reveal);
// get the final radius for the clipping circle
float finalRadius = hypo(myView.getWidth(), myView.getHeight());
SupportAnimator animator =
ViewAnimationUtils.createCircularReveal(myView, cx, cy, 0, finalRadius);
animator.addListener(new SupportAnimator.AnimatorListener() {
#Override
public void onAnimationStart() {
mFloatingButton.setVisibility(View.INVISIBLE);
myView.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationEnd() {
Toast.makeText(getApplicationContext(), "Done", Toast.LENGTH_LONG)
.show();
}
#Override
public void onAnimationCancel() {
}
#Override
public void onAnimationRepeat() {
}
});
animator.setInterpolator(new AccelerateDecelerateInterpolator());
animator.setDuration(1000);
animator.start();
}
static float hypo(int a, int b) {
return (float) Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2));
}
}
The solution to do that is pathInterpolator and the name of this effect is Curved Motion.
Animations in material design rely on curves for time interpolation
and spatial movement patterns. With Android 5.0 (API level 21) and
above, you can define custom timing curves and curved motion patterns
for animations.
You can see how to implement it here :
http://developer.android.com/training/material/animations.html#CurvedMotion
And sample on GitHub HERE :
I am trying to do a TranslateAnimation but don't work properly the layout apear and disapear but didn't do any animation. How could I solve this?
The java code is this:
private void initComponents() {
ImageView postIV = (ImageView) findViewById(R.id.post_view_activity_image_iv);
CropBottonTransformation cropBottomTransformation = new CropBottonTransformation();
Picasso.with(context).load(bundle.getString(Constants.POST_IMAGE))
.centerCrop().fit().placeholder(R.drawable.home_placeholder)
.into(postIV);
TextView postTitleTV = (TextView) findViewById(R.id.post_view_activity_title_tv);
postTitleTV.setText(bundle.getString(Constants.POST_TITLE));
ObservableScrollView scroll = (ObservableScrollView) findViewById(R.id.post_view_activity_scroll);
scroll.setScrollViewListener(this);
hidenOptionsLL = (LinearLayout) findViewById(R.id.post_view_activity_slide_options);
hidenOptionsHeight = hidenOptionsLL.getHeight();
slideRL = (RelativeLayout) findViewById(R.id.post_view_activity_slide_rl);
}
...
#Override
public void onScrollChanged(ObservableScrollView scrollView, int x, int y,
int oldx, int oldy) {
if (y > oldy) {
if (sliding == false) {
// Animation animation =
// AnimationUtils.loadAnimation(context,
// R.anim.slide_in_out);
Animation animation = new TranslateAnimation(0, 0,
hidenOptionsHeight, 0);
animation.setInterpolator(new AccelerateInterpolator(1.0f));
animation.setDuration(600);
hidenOptionsLL.startAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
sliding = true;
}
#Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
sliding = false;
hidenOptionsLL.setVisibility(View.GONE);
}
});
}
} else if (y < oldy) {
if (sliding == false) {
// Animation animation =
// AnimationUtils.loadAnimation(context,
// R.anim.slide_in_out);
Animation animation = new TranslateAnimation(0, 0, 0,
hidenOptionsHeight);
hidenOptionsLL.setVisibility(View.VISIBLE);
animation.setInterpolator(new AccelerateInterpolator(1.0f));
animation.setDuration(600);
hidenOptionsLL.startAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
sliding = true;
}
#Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
sliding = false;
}
});
}
}
}
The layout is this:
<LinearLayout
android:id="#+id/post_view_activity_slide_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="horizontal"
android:visibility="gone" >
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:src="#android:drawable/arrow_down_float" />
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:src="#android:drawable/arrow_up_float" />
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:src="#android:drawable/ic_delete" />
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent"
android:src="#android:drawable/btn_radio" />
</LinearLayout>
I don't find any solution. I want that it works like the options that appear on the bottom of the google search app.
Slideinleft.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="100%p" android:toXDelta="0%p"
android:duration="#android:integer/config_shortAnimTime"/>
Slideinright.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="-100%p" android:toXDelta="0%p"
android:duration="#android:integer/config_shortAnimTime" />
Slideoutleft.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0" android:toXDelta="-100%p"
android:duration="#android:integer/config_shortAnimTime" />
Slideoutright.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0" android:toXDelta="100%p"
android:duration="#android:integer/config_shortAnimTime" />
use when go one activity to other.
overridePendingTransition(R.anim.slide_in_right,
R.anim.slide_out_right);
It sounds like this library might help you:
https://github.com/flavienlaurent/discrollview?utm_source=Android+Weekly&utm_campaign=2daec38d18-Android_Weekly_86&utm_medium=email&utm_term=0_4eb677ad19-2daec38d18-337293613
But otherwise, you're going to want to set fillEnabled fillBefore and fillAfter to true
The problem is that when I ask for the height at first time the view isn't visible an the value of the height was 0:
I did this:
ImageButton minusLetterIB = (ImageButton) findViewById(R.id.post_view_activity_minus_leters_ib);
hidenOptionsHeight = minusLetterIB.getDrawable().getIntrinsicHeight();
and changed the animation to hide an show the layout:
#Override
public void onScrollChanged(ObservableScrollView scrollView, int x, int y,
int oldx, int oldy) {
if (oldy - y > 20) {
if (sliding == false) {
if (slideRL.getVisibility() == View.GONE) {
Animation animation = new TranslateAnimation(0, 0,
-hidenOptionsHeight, 0);
animation.setInterpolator(new AccelerateInterpolator(1.0f));
animation.setDuration(400);
slideRL.startAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
sliding = true;
slideRL.setVisibility(View.VISIBLE);
}
#Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
sliding = false;
if (firstTimeSlideUp) {
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LayoutParams.MATCH_PARENT,
(int) hidenOptionsHeight);
FrameLayout extraLL = new FrameLayout(context);
extraLL.setBackgroundColor(getResources()
.getColor(android.R.color.white));
scrollLL.addView(extraLL, 0, params);
firstTimeSlideUp = false;
}
}
});
}
}
} else if (oldy - y < -20) {
if (sliding == false) {
Log.d("hiding view", "y " + y + " oldy " + oldy);
if (slideRL.getVisibility() == View.VISIBLE) {
Animation animation = new TranslateAnimation(0, 0, 0,
-hidenOptionsHeight);
animation.setInterpolator(new AccelerateInterpolator(1.0f));
animation.setDuration(400);
slideRL.startAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
sliding = true;
}
#Override
public void onAnimationRepeat(Animation animation) {
// TODO Auto-generated method stub
}
#Override
public void onAnimationEnd(Animation animation) {
sliding = false;
slideRL.setVisibility(View.GONE);
}
});
}
}
}
}