How to continuouslly fadein and out Button in Android? - android

I want to fade in and out a Button in my android app when user activates a feature.
I saw examples on stackoverflow that shows fading in or out. But is there an easy way to combine in/out animations all together that repeats unlimited amount of time?

Use on your Animation object the following :
myAnimation.setRepeatCount(Animation.INFINITE);
myAnimation.setRepeatMode(Animation.REVERSE);

I am not 100% sure about your question, but this worked for me as a continue fadeOut and fadeIn animation:
int value = 0;
for (int i=0;i<100000;i++){
if (value == 0){
doFadeOutAnimation();
value = 1;
}
else if (value == 1){
doFadeInAnimation();
value = 0;
}
}

Related

SwipeRefreshLayout stop refreshing without animation

I'm aware that calling myRefreshLayout.setRefreshing(false) will end the refresh animation... BUT, it doesn't just stop, it finishes it's current spin and animates off-screen.
Is there a way to avoid that in certain instances? I'm looking to just have it instantly disappear.
Thanks!
Try this out:
int cnt = swiperefresh.getChildCount();
for(int i=0; i<cnt; i++) {
View ch = swiperefresh.getChildAt(i);
if(ch.getClass().getSimpleName().equals("CircleImageView")) {
ch.clearAnimation();
ch.setVisibility(View.GONE);
swiperefresh.setRefreshing(false);
ch.clearAnimation();
break;
}
}
I found an elegant way. There is a reset() method in SwipeRefreshLayout which cancels the animation and immediately hides the progress drawable without animation. Unfortunately this method is package private. But it is called during setEnabled(false), so you could use it like this:
swipeRefreshLayout.setEnabled(false)
swipeRefreshLayout.setEnabled(true)

RecyclerView - animate change of grid layout manager columns

I want to animate the change of my RecyclerViews GridLayoutManager. I defaulty show a list of items in a grid with 3 columns and the user can select to show more or less columns.
I would like the views in the RecyclerView to move/scale to their new positions, but I have no idea how this could be done.
What I want in the end
allow to scale the grid via an expand/contract touch gesture => I know how to do that
animate the change of the LayoutManager
Does anyone know how I can animate the change of the LayoutManager?
The source of inspiration here would be the Google Photos app,the stock Sony Gallery app
There are basically 2 approaches you can go with:
You modify the spancount of the GridLayoutManager using setSpanCount(int)
You set a very high span count(~100) use the SpanSizeLookUp to change the per item spanSize on the fly.
I have used the Gist provided by Musenkishi,for this answer to provide an animator to animate the changes in grid layout changes
I have used this approach in a sample GitHub project implementing the same.
Caveats:
I have currently used the click listener to keep modifying the the span size look up.This could be changed to a ItemGestureListener to capture pinch zoom events and change accordingly.
You need to determine a way to choose a span count so that all the items in a row occupy the entire screen width (and hence you do not see any empty space)
You call notifyItemRangeChanged using a runnable post delayed since you cannot call the notifyChanged methods from within bindView/createView etc.
After changing the span size,you need to notifyItemRangeChanged with an appropriate range so that all the items currently displayed on the screen are shifted accordingly.I have used (code at the bottom)
This is not a complete solution but a 2 hour solution for the same.You can obviously improve on all the points mentioned :).
I hope to keep updating the sample since this kind of views have always fascinated me.
Do not view this as the final solution but just a particular way of achieving this approach. If you were to use a StaggerredLayoutManager instead,you could easily avoid blank spaces between items.
public int calculateRange() {
int start = ((GridLayoutManager) grv.getLayoutManager()).findFirstVisibleItemPosition();
int end = ((GridLayoutManager) grv.getLayoutManager()).findLastVisibleItemPosition();
if (start < 0)
start = 0;
if (end < 0)
end = getItemCount();
return end - start;
}
I deal with the same problem as you, and so far I have not found a good solution.
Simple change of columns number in GridLayoutManager seems weird so for now I use animation to fade out/in entire layout. Something like this:
private void animateRecyclerLayoutChange(final int layoutSpanCount) {
Animation fadeOut = new AlphaAnimation(1, 0);
fadeOut.setInterpolator(new DecelerateInterpolator());
fadeOut.setDuration(400);
fadeOut.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
productsRecyclerLayoutManager.setSpanCount(layoutSpanCount);
productsRecyclerLayoutManager.requestLayout();
Animation fadeIn = new AlphaAnimation(0, 1);
fadeIn.setInterpolator(new AccelerateInterpolator());
fadeIn.setDuration(400);
productsRecycler.startAnimation(fadeIn);
}
});
productsRecycler.startAnimation(fadeOut);
}
If you combine fade out/in animation with scaling each visible item, It will be a decent animation for GridLayoutManager changes.
You can do this with "gesture detector"
see the sample tutorial here http://wiki.workassis.com/pinch-zoom-in-recycler-view/ In this tutorial we will fetch images from gallery and show them in a grid layout in recycler view. You will be able to change layout on pinch gesture. Following are the screen shots of different layouts.
mScaleGestureDetector = new ScaleGestureDetector(this, new ScaleGestureDetector.SimpleOnScaleGestureListener() {
#Override
public boolean onScale(ScaleGestureDetector detector) {
if (detector.getCurrentSpan() > 200 && detector.getTimeDelta() > 200) {
if (detector.getCurrentSpan() - detector.getPreviousSpan() < -1) {
if (mCurrentLayoutManager == mGridLayoutManager1) {
mCurrentLayoutManager = mGridLayoutManager2;
mRvPhotos.setLayoutManager(mGridLayoutManager2);
return true;
} else if (mCurrentLayoutManager == mGridLayoutManager2) {
mCurrentLayoutManager = mGridLayoutManager3;
mRvPhotos.setLayoutManager(mGridLayoutManager3);
return true;
}
} else if(detector.getCurrentSpan() - detector.getPreviousSpan() > 1) {
if (mCurrentLayoutManager == mGridLayoutManager3) {
mCurrentLayoutManager = mGridLayoutManager2;
mRvPhotos.setLayoutManager(mGridLayoutManager2);
return true;
} else if (mCurrentLayoutManager == mGridLayoutManager2) {
mCurrentLayoutManager = mGridLayoutManager1;
mRvPhotos.setLayoutManager(mGridLayoutManager1);
return true;
}
}
}
return false;
}
});

Android RatingBar aligned right

I have a custom rating bar in which i edited from this tutorial (http://kozyr.zydako.net/2010/05/23/pretty-ratingbar/)
I only want to show full cookies and not empty ones hence i replaced the empty-cookie.png with just a transparent image.
My problem is, in my UI i want my visible cookies to be right aligned, in other words, to be shown from right to left instead of the current left to right.
How can i achieve that? i DO NOT NEED to show half cookies and this is only used as an indicator (android:isIndicator="true")
Alternate non-ratingbar solutions are welcomed too. :)
i solved this by setting visibilities of multiple ImageViews stored in an array and displayed using a RelativeLayout in the end.
private void setClocksVisible(int numClocks) {
if(numClocks == 0 || numClocks == -1) {
for(int i=0; i< holder.ratingClocks.length; i++) {
holder.ratingClocks[i].setVisibility(View.INVISIBLE);
}
} else {
for(int i=0; i<numClocks; i++) {
holder.ratingClocks[i].setVisibility(View.VISIBLE);
}
}
}

catch notes like animation

I need to create an animation like in the "Catch notes" app. The animation that I am referring to is when you press on an object in a list, all of the object above it go up and all of the objects below it go down, all with animation.
I was thinking that it could not be possible by using a regular list view. so maybe the way to do it is just to put the objects manually one by one in some way?
Any better ideas?
Thanks!
Get all visible items (listView.getFirstVisiblePosition() to getLastVisiblePosition()) and get there views with listView.getChildAt(index).
Then you can animate all the views above and below your view with ObjectAnimator or similar.
Example:
for (int i = listView.getFirstVisiblePosition(); i < myListAdapter.getCount() && i <= listView.getLastVisiblePosition(); i++) {
View v = listView.getChildAt(i - listView.getFirstVisiblePosition());
ListItem listItem = myListAdapter.getListItem(i);
if (v != null) {
ObjectAnimator.ofFloat(v, "translationY", 0, -screenHeight).start();
}
}

WebView next/previous page transitions

I'm generating a book app, of sorts, that displays pages in a WebView. I have Next/Previous ImageButtons and a GestureOverlay to detect left/right swipes.
When I want a page change I call:
private void changePage(int delta) {
currentPageIndex = currentPageIndex + delta;
if (currentPageIndex < 0) {
// negative index
currentPageIndex = 0;
} else if (currentPageIndex >= listOfPages.length) {
// index requested is out of range of the list
currentPageIndex = listOfPages.length - 1;
} else {
// set values for page load
filename = listOfPages[currentPageIndex];
mWebView.loadUrl("file:///android_asset/" + filename);
}
}
'listOfPages' is a string array of my filenames and loadUrl() works great, but is there any way that anyone knows of to be able to have a page transition to simulate a simple page turn?
If anyone's interested, I found a way to do this.
I defined Animation variables:
Animation slideLeftAnimation = AnimationUtils.loadAnimation(getBaseContext(), R.anim.slide_left);
Animation slideRightAnimation = AnimationUtils.loadAnimation(getBaseContext(), R.anim.slide_right);
And the slide_left and slide_right xml files are from the Android API tutorials.
Then, for left or right swipes, I used mWebView.startAnimation(leftOrRightAnimation); before my mWebView.loadUrl(url); call. Hope this helps anyone else! Chris

Categories

Resources