how to create Sliding Up Panel without using any library in android - android

In single view I want to display map and list of places in recyclerview so I divided my layout by using weight. Now it will show map half screen and list half screen based on place recyclerview scrolling I want to display location of the place in google map. At same time while scrolling I want to make my list 80% bigger after that when they using map it should become normal size this all working. Now what I want is an animation for increasing height like google music.
Code for collapse:
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if (interpolatedTime == 1) {
v.setVisibility(View.VISIBLE);
} else {
v.getLayoutParams().height = (int) (initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int) (initialHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
Code for expand:
v.measure(AbsoluteLayout.LayoutParams.MATCH_PARENT, AbsoluteLayout.LayoutParams.MATCH_PARENT);
final int targetHeight = (height / 100) * 40;
// Older versions of android (pre API 21) cancel animations for views with a height of 0.
v.getLayoutParams().height = 1;
v.setVisibility(View.VISIBLE);
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? AbsoluteLayout.LayoutParams.MATCH_PARENT
: (int) (targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int) (targetHeight / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
Animation smooth is not coming can some one help me

Related

Android RelativeLayout height animation

I am looking for height animation for RelativeLayout. Normally it should be starting from base value to the height of the layout. I was trying to write with EasyAndroidAnimation library. But could not succeed. Below code is attached. It is bouncing up from the base. I need something smooth.
new BounceAnimation(this.LayoutGraph)
.setBounceDistance(50)
.setNumOfBounces(5)
.setDuration(500)
.animate();
Also I am looking for something easy like this as I have to use the approach for many layouts:
layout.startfrom(basevalue)
layout.to(height of the layout)
layout.animate()
Any help will be appreciated.
CODE Adding*
As Requested Please find the below code which I am trying.
I am calling the animation by calling the below code.
expand(this.mFirstGraph);
expand method
public void expand(final View v) {
v.measure(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
int i = (int)(0.075F * this.mWidthScreen);
//this.mFirstGraph.getLayoutParams().height = i;
int length=(int)(0.425F * this.mWidthScreen * (this.maxTemp - this.mWeatherModel.mWeekHighTemperatures[0]) / this.ratioTemp);
final int targetHeight = i+ length;
Log.e("BASIC5", "targetHeight: "+targetHeight);
// Older versions of android (pre API 21) cancel animations for views with a height of 0.
v.getLayoutParams().height = 1;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? LinearLayout.LayoutParams.WRAP_CONTENT
: (int)(targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
public void animate() {
// TODO Auto-generated method stub
}
};
// 1dp/ms
//a.setDuration((int) (targetHeight / v.getContext().getResources().getDisplayMetrics().density));
a.setDuration(2000);
Log.e("BASIC5", "Duration value: "+ (int) (targetHeight / v.getContext().getResources().getDisplayMetrics().density));
a.setInterpolator(new AccelerateInterpolator(3));
v.startAnimation(a);
}
public void collapse(final View v) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if(interpolatedTime == 1){
v.setVisibility(View.GONE);
}else{
v.getLayoutParams().height = initialHeight - (int)(initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
public void animate() {
// TODO Auto-generated method stub
}
};
// 1dp/ms
//a.setDuration((int)(initialHeight / v.getContext().getResources().getDisplayMetrics().density));
a.setDuration(200);
//a.setInterpolator(new DecelerateInterpolator());
v.startAnimation(a);
}
Problems identified currently
The animation is not smooth.
Height is not proper. Which I am currently working on it.
Maybe this basic example could help you:
public void expand(final View v) {
v.measure(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
final int targetHeight = v.getMeasuredHeight();
// Older versions of android (pre API 21) cancel animations for views with a height of 0.
v.getLayoutParams().height = 1;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? LinearLayout.LayoutParams.WRAP_CONTENT
: (int)(targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int) (targetHeight / v.getContext().getResources().getDisplayMetrics().density));
//a.setInterpolator(new AccelerateInterpolator(3));
v.startAnimation(a);
}
public void collapse(final View v) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if(interpolatedTime == 1){
v.setVisibility(View.GONE);
}else{
v.getLayoutParams().height = initialHeight - (int)(initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int)(initialHeight / v.getContext().getResources().getDisplayMetrics().density));
//a.setInterpolator(new DecelerateInterpolator());
v.startAnimation(a);
}

Animated Dropdown with saperate cells animation in android

I need a drop-down with animation to open/close like this.
It needs animation with cells. You can see that in below animation image.
If anyone has an idea or a tutorial related to this solution than please share it with me.
Thanks in advance.
If you have any questions or querys in your mind than feel free to ask me.
I really want to get the proper solution to this.
You can use custom expand and collapse animations to show and hide a view. On top view clicked, expand and collapse required view. For this, you have to first calculate height of view.
Expand and collapse animation functions are followings.
Expand
/**
* Expanding a view with animation based on its height
*/
public static void expand(final View v,final int targetHeight) {
v.measure(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1
? targetHeight
: (int)(targetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int)(targetHeight*2 / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}
Collapse
/**
* Collapsing a view with animation based on its height
*/
public static void collapse(final View v,final int initialHeight)
{
Animation a = new Animation()
{
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
if(interpolatedTime == 1){
v.setVisibility(View.GONE);
}else{
v.getLayoutParams().height = initialHeight - (int)(initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration((int)(initialHeight*2 / v.getContext().getResources().getDisplayMetrics().density));
v.startAnimation(a);
}

Expand Animation to work on both sides? (on negative axis)

I implemented an ExpandAnimation on view like this:
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
LayoutParams lp =
(LayoutParams) view.getLayoutParams();
if(rightAnimation){
lp.width = (int) (mStartWidth + mDeltaWidth *
interpolatedTime);
view.setLayoutParams(lp);
}else{
}
}
With this animation my view expands and shrinks.
What i want to do is to implement this animation to the other side (to -x side) as well. But i get confused a little bit, since shrinking the width will not work.
(Since minus widths or heights are not allowed)
Does anyone know a better way to implement expand animation to the left (-x) or up(-y) side as well?
Or maybe mirroring the view?
Finally I achieved to make a left hand side expand animation. Here is the code:
private class ExpandAnimation extends Animation implements Animation.AnimationListener {
private final int mStartWidth;
private final int mDeltaWidth;
int delta;
public ExpandAnimation(int startWidth, int endWidth) {
mStartWidth = startWidth;
mDeltaWidth = endWidth - startWidth;
RelativeLayout.LayoutParams param = (RelativeLayout.LayoutParams) getLayoutParams();
delta = param.width;
setAnimationListener(this);
}
#Override
protected void applyTransformation(float interpolatedTime, Transformation t) {
RelativeLayout.LayoutParams param = (RelativeLayout.LayoutParams) getLayoutParams();
delta = param.width;
if(param.width <= 0){
delta = 0;
}
param.width = (int) (mStartWidth + mDeltaWidth *
interpolatedTime);
if(delta != 0){
delta = (int) (mStartWidth + mDeltaWidth *
interpolatedTime) - delta;
}
param.leftMargin -=delta;
setLayoutParams(param);
}
#Override
public boolean willChangeBounds() {
return true;
}
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
setText(text);
requestLayout();
mExpanded = !mExpanded;
}
#Override
public void onAnimationRepeat(Animation animation) {
}
}
For a reason that I don't know, width comes as -2 in the start. So i filter out that by an if. Apply Transformation method does the job.

Expand/Collapse animation in Android ListView

I'm trying to have my listview expanded/collapsed with an animation, and I have the following code.
What I wanna have is a listview, on the top part of the screen, that expands and collapses, but when it collapses up, I just wanna see the currently selected item from the listview (one one item, one row).
public static Animation expand(final View v, final boolean expand) {
try {
Method m = v.getClass().getDeclaredMethod("onMeasure", int.class,
int.class);
m.setAccessible(true);
m.invoke(v,
MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
MeasureSpec.makeMeasureSpec(
((View) v.getParent()).getMeasuredWidth(),
MeasureSpec.AT_MOST));
} catch (Exception e) {
e.printStackTrace();
}
final int initialHeight = v.getMeasuredHeight();
if (expand) {
v.getLayoutParams().height = 50;
} else {
v.getLayoutParams().height = initialHeight;
}
v.setVisibility(View.VISIBLE);
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
int newHeight = 50;
if (expand) {
newHeight = (int) (initialHeight * interpolatedTime);
} else {
newHeight = (int) (initialHeight * (1 - interpolatedTime));
}
v.getLayoutParams().height = newHeight;
v.requestLayout();
if (interpolatedTime == 1 && !expand)
v.setVisibility(View.GONE);
}
#Override
public boolean willChangeBounds() {
return true;
}
};
a.setDuration(500);
return a;
}
The problem is that when collapsing, I'd like to have the first row of the listview visible, and not the listview completely hidden, but I can't find the part of the code that will do that.
Any help, please?
Thanks a lot in advance.

How to make a smooth animation on a list in Android?

I have implemented an animation for a Layout that must flow downwards and upwards. The animation precisely must flow in both low that high. This gridview is located above a ExpandbleListView. So, when I close all the groups the animation is very fluid. When the groups on the list are open, with many elements, however the animation is triggered, it is not as fluid as I would like it to be. I'll post the code of my animation:
public void expand(final View v) {
v.measure(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
final int targtetHeight = v.getMeasuredHeight();
v.getLayoutParams().height = 0;
v.setVisibility(View.VISIBLE);
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
v.getLayoutParams().height = interpolatedTime == 1 ? LayoutParams.WRAP_CONTENT
: (int) (targtetHeight * interpolatedTime);
v.requestLayout();
}
#Override
public boolean willChangeBounds() {
return true;
}
};
Interpolator i = AnimationUtils.loadInterpolator(this,
android.R.anim.linear_interpolator);
a.setInterpolator(i);
a.setDuration(200);
v.startAnimation(a);
}
and :
public static void collapse(final View v) {
final int initialHeight = v.getMeasuredHeight();
Animation a = new Animation() {
#Override
protected void applyTransformation(float interpolatedTime,
Transformation t) {
if (interpolatedTime == 1) {
v.setVisibility(View.GONE);
} else {
v.getLayoutParams().height = initialHeight
- (int) (initialHeight * interpolatedTime);
v.requestLayout();
}
}
#Override
public boolean willChangeBounds() {
return true;
}
};
// 1dp/ms
a.setDuration(200);
v.startAnimation(a);
}
How can I do to make the animation smoother?
--> Edit: I was wrong code, I corrected

Categories

Resources