I have ViewPager + PageAdapter for slide images. I'm trying add Alpha animation button which appears when user tap on screen and disappears when tap again.
When I add clickListner for ImageView or for some invisible layout over ImageView animation button works fine, but slider doesn`t work now. What I should do for combine these 2 functions.
imageView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
final Animation aAnim1 = new AlphaAnimation(1.0f, 0.0f);
final Animation aAnim2 = new AlphaAnimation(0.0f, 1.0f);
if (VISIBLE_FLAG == true) {
aAnim1.setDuration(250);
aAnim1.setFillAfter(true);
save_btn.startAnimation(aAnim1);
exit_btn.startAnimation(aAnim1);
VISIBLE_FLAG = false;
}
else {
aAnim1.setDuration(250);
aAnim1.setFillAfter(true);
save_btn.startAnimation(aAnim2);
exit_btn.startAnimation(aAnim2);
VISIBLE_FLAG = true;
}
}
});
Related
I have used an imageView to display 5 nearly equal images randomly on the screen.The thing is every image is turned off and immediately next one is displayed.So that the viewer can easily find that image is being changed.Is it possible to add animation effects to imageView? (like, one image slowly fades out,in the meanwhile another image fades in)
u can modify ur self
ImageView img_view= (ImageView) findViewById(R.id.DemoImage);
int images[] = { R.drawable.image1, R.drawable.image2,R.drawable.image3 };
animate(img_view, images, 0,false);
private void animate(final ImageView imageView, final int images[], final int imageIndex, final boolean forever) {
int fadeInDuration = 1000;
int timeBetween = 5000;
int fadeOutDuration = 1000;
imageView.setVisibility(View.INVISIBLE);
imageView.setImageResource(images[imageIndex]);
Animation fadeIn = new AlphaAnimation(0, 1);
fadeIn.setInterpolator(new DecelerateInterpolator());
fadeIn.setDuration(fadeInDuration);
Animation fadeOut = new AlphaAnimation(1, 0);
fadeOut.setInterpolator(new AccelerateInterpolator());
fadeOut.setStartOffset(fadeInDuration + timeBetween);
fadeOut.setDuration(fadeOutDuration);
AnimationSet animation = new AnimationSet(false);
animation.addAnimation(fadeIn);
animation.addAnimation(fadeOut);
animation.setRepeatCount(1);
imageView.setAnimation(animation);
animation.setAnimationListener(new AnimationListener() {
public void onAnimationEnd(Animation animation) {
if (images.length - 1 > imageIndex) {
animate(imageView, images, imageIndex + 1,forever);
}
else {
if (forever){
animate(imageView, images, 0,forever);
}
}
}
});
}
when i click a button the translate animation starts. then button placed where translate animation gets end. it working good but after animation button click not working.
thanks in advance
public class ButtonFragment extends Activity implements OnClickListener{
private Button btn;
private int width;
private Boolean flag = true;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_button_fragment);
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
width = size.x;
btn = (Button) findViewById(R.id.btn);
btn.setOnClickListener(this);
}
#Override
public void onClick(View v) {
TranslateAnimation animation = null;
switch (v.getId()) {
case R.id.btn:
if(flag == true) {
animation = new TranslateAnimation(0, width-92 , 0, 0);
flag=false;
}
else{
animation = new TranslateAnimation(width-92,0 , 0, 0);
flag = true;
}
animation.setDuration(1000);
animation.setFillAfter(true);
btn.startAnimation(animation);
break;
default:
break;
}
}
}
code proper alignment was done
As given in this page:
Another disadvantage of the view animation system is that it only modified where the View was drawn, and not the actual View itself. For instance, if you animated a button to move across the screen, the button draws correctly, but the actual location where you can click the button does not change, so you have to implement your own logic to handle this.
Try using property animation and read the link given above.
I'm trying to make a tab look-A-like buttons row with a background that is an ImageView.
Here is the ImageView:
now on this image there are three buttons when the fragment loads.
when i click button one:
there are two situations:
1) when screen looks like the image above, then i want to move the buttons to the right so the screen looks like this:
and when it looks like the image above, i want it to return to the first image state.
the last case is when a user press's B3 i want it to react the same as B1 but to the other side, like this:
I tried so far lots of methods to try this, all have not worked, it seems that when i animate the movement the buttons stay in the same place:
here is my code so far:
btn_spa.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View v)
{
isMapPressed=false;
isInfoPressed=false;
int toMoveNow=0;
if(!isSpaPressed)
{
if(isMapPressed)
toMoveNow=(toMove/2)+40;
else
toMoveNow=-(toMove/2+40);
int[] arr = new int[]{0,0};
btn_spa.getLocationOnScreen(arr);
Animation animation = new TranslateAnimation(arr[0], toMoveNow, 0, 0);
animation.setDuration(1000);
animation.setFillAfter(true);
//rel_buttons_wrapper.startAnimation(animation);
btn_info.startAnimation(animation);
btn_map.startAnimation(animation);
btn_spa.startAnimation(animation);
Toast.makeText(getActivity(), "Button spa clicked", Toast.LENGTH_SHORT).show();
}
}
});
btn_map.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0)
{
isSpaPressed=false;
isInfoPressed=false;
int toMoveNow=0;
if(!isMapPressed && isSpaPressed)
{
toMoveNow=-(toMove/2+40);
int[] arr = new int[]{0,0};
btn_map.getLocationOnScreen(arr);
Animation animation = new TranslateAnimation(arr[0], toMoveNow, 0, 0);
animation.setDuration(1000);
animation.setFillAfter(true);
// rel_buttons_wrapper.startAnimation(animation);
btn_info.startAnimation(animation);
btn_map.startAnimation(animation);
btn_spa.startAnimation(animation);
Toast.makeText(getActivity(), "Button map clicked", Toast.LENGTH_SHORT).show();
}
else
{
toMoveNow=(toMove/2+40);
int[] arr = new int[]{0,0};
btn_map.getLocationOnScreen(arr);
Animation animation = new TranslateAnimation(arr[0], toMoveNow, 0, 0);
animation.setDuration(1000);
animation.setFillAfter(true);
// rel_buttons_wrapper.startAnimation(animation);
btn_info.startAnimation(animation);
btn_map.startAnimation(animation);
btn_spa.startAnimation(animation);
Toast.makeText(getActivity(), "Button map clicked", Toast.LENGTH_SHORT).show();
}
}
});
btn_info.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v)
{
int toMoveNow=0;
if(!isInfoPressed && isSpaPressed)
{
toMoveNow=(toMove/2)+40;
int[] arr = new int[]{0,0};
btn_info.getLocationOnScreen(arr);
Animation animation = new TranslateAnimation(arr[0], toMoveNow, 0, 0);
animation.setDuration(1000);
animation.setFillAfter(true);
rel_buttons_wrapper.startAnimation(animation);
btn_info.startAnimation(animation);
btn_map.startAnimation(animation);
btn_spa.startAnimation(animation);
Toast.makeText(getActivity(), "Button info clicked", Toast.LENGTH_SHORT).show();
}
else
{
toMoveNow=-(toMove/2);
int[] arr = new int[]{0,0};
btn_info.getLocationOnScreen(arr);
Animation animation = new TranslateAnimation(arr[0], toMoveNow, 0, 0);
animation.setDuration(1000);
animation.setFillAfter(true);
rel_buttons_wrapper.startAnimation(animation);
btn_info.startAnimation(animation);
btn_map.startAnimation(animation);
btn_spa.startAnimation(animation);
Toast.makeText(getActivity(), "Button info clicked", Toast.LENGTH_SHORT).show();
}
isSpaPressed=false;
isMapPressed=false;
}
});
Sorry for the long question, I wanted to be as informative as possible.
any help would be good guys,
Kind Regards.
you can use ObjectAnimator class, it moves views and their bounds so they actually move when you move them, here is a tutorial :
http://developer.android.com/guide/topics/graphics/prop-animation.html#object-animator
I have a Relative Layout containing some textviews which floats over a gridview. When I select an item in the grid, the layout moves down to nearly the end of the screen and only about 1/5th of it is visible. This is done using simple Translate Animation. Now when I click another button in the grid, I need to Relative Layout to move back to its original position on top of the gridview. I did this also with Translate Animation and this is happnening, but only the portion of the RelativeLayout which was visible when it was collapsed is translating (moving) and the other portion becomes visible after animation has ended. This looks really ugly.
I know that Android doesnt draw the portion of the view that is not visible on the screen. Is there a way to force draw the full portion ?
My Animation code is given below:
public void smoothExpanderAnimate(final int finalTarget,final RelativeLayout expander,final int animateToY,final boolean setExpanded,final boolean refreshGrid)
{
final RelativeLayout.LayoutParams head_params = (RelativeLayout.LayoutParams)expander.getLayoutParams();
TranslateAnimation anim = new TranslateAnimation(0f, 0f, 0f, animateToY);
anim.setDuration(400);
//timeListHeight = list.getHeight();
//anim.setFillAfter(true);
anim.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
//Should I try something here ?
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
head_params.topMargin = finalTarget;
expander.clearAnimation();
expander.setLayoutParams(head_params);
isExpanded = setExpanded;
isAnimating = false;
if(!setExpanded)
{
setChildHeight(timeListHeight, list);
}
}
});
isAnimating = true;
expander.startAnimation(anim);
}
I found a solution for this.
If you dont need to support lower API levels and are fine with API level 11 onwards, you can use ObjectAnimator for this. ObjectAnimator has a translatey method which works quite well.
If you need to support API 8 onwards, you need to make sure your view comes within the bounds of the screen and then animates. The following code modification did the trick.
I know it seems very weird, do let me know if there is a better way to do this.
public void smoothExpanderAnimate(boolean addSpecialFix,final int finalTarget,final RelativeLayout expander,final int animateToY,final boolean setExpanded,final boolean refreshGrid)
{
final RelativeLayout.LayoutParams head_params = (RelativeLayout.LayoutParams)expander.getLayoutParams();
TranslateAnimation anim = new TranslateAnimation(0f, 0f, 0f, animateToY);
anim.setDuration(400);
expander.setVisibility(View.INVISIBLE); //Make View invisible
if(isExpanded && addSpecialFix){
//THIS IS THE FIX
int old = head_params.topMargin;
head_params.topMargin = finalTarget;
expander.clearAnimation();
expander.setLayoutParams(head_params); //move invisible view to the final position
anim = new TranslateAnimation(0f, 0f, old-closedY, 0);
Log.d("asdasd", old+"");
anim.setDuration(400);
}
//timeListHeight = list.getHeight();
//anim.setFillAfter(true);
anim.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationStart(Animation animation) {
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationEnd(Animation animation) {
head_params.topMargin = finalTarget;
expander.clearAnimation();
expander.setLayoutParams(head_params);
isExpanded = setExpanded;
isAnimating = false;
expander.setVisibility(View.VISIBLE);
if(refreshGrid)
{
mCalAdapter.notifyDataSetChanged();
}
if(!setExpanded)
{
setListHeight(timeListHeight, list);
}
}
});
isAnimating = true;
expander.startAnimation(anim);
}
I had used TranslateAnimation and slide up and down a view.
However, I realize, even though after I slide down the view, and use View.GONE in its visibility, the view still able to receive touch event.
You can produce the same problem, by clicking on the button to make the orange color view disappear from the bottom of the screen. Then, when you click on the bottom of the screen, you will realize touch event of the custom view is still being triggered.
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
int color = getResources().getColor(android.R.color.holo_orange_light);
// construct the RelativeLayout
final RelativeLayout customView = new RelativeLayout(this) {
#Override
public boolean onTouchEvent(MotionEvent event) {
this.setPressed(true);
Log.i("CHEOK", "OH NO! TOUCH!!!!");
return super.onTouchEvent(event);
}
};
customView.setBackgroundColor(color);
final FrameLayout frameLayout = (FrameLayout)this.findViewById(R.id.frameLayout);
frameLayout.addView(customView, new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, 100, Gravity.BOTTOM));
customView.setVisibility(View.GONE);
Button button = (Button)this.findViewById(R.id.button1);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (customView.getVisibility() != View.VISIBLE) {
// Slide up!
TranslateAnimation anim=new TranslateAnimation(0,0,100,0);
anim.setFillAfter(true);
anim.setDuration(200);
Log.i("CHEOK", "VISIBLE!!!");
customView.setVisibility(View.VISIBLE);
customView.setAnimation(anim);
customView.setEnabled(true);
} else {
// Slide down!
TranslateAnimation anim=new TranslateAnimation(0,0,0,100);
anim.setFillAfter(true);
anim.setDuration(200);
// HELPME : Not sure why, after I hide the view by sliding it down,
// making it View.GONE and setEnabled(false), it still able to
// receive touch event.
Log.i("CHEOK", "GONE!!!");
customView.setVisibility(View.GONE);
customView.setAnimation(anim);
customView.setEnabled(false);
}
}
});
}
}
The complete source code to demonstrate this problem can be found here :
https://www.dropbox.com/s/1101dm885fn5hzq/animator_bug.zip
How can I make my custom view not to receive touch event, after I had slide it down?
It is not clear to me why you are using setAnimation() instead of startAnimation() as it does not appear that you have set a start time on your animations.
On another note, I have found that setting a view to GONE while it has an associated animation does not make it truly "GONE." Instead, you must first get rid of the animation using clearAnimation().
So, something like this instead:
public void onClick(View v) {
if (customView.getVisibility() != View.VISIBLE) {
// Slide up!
TranslateAnimation anim=new TranslateAnimation(0,0,100,0);
anim.setFillAfter(true);
anim.setDuration(200);
customView.setVisibility(View.VISIBLE);
customView.setEnabled(true);
customView.startAnimation(anim);
} else {
// Slide down!
TranslateAnimation anim=new TranslateAnimation(0,0,0,100);
anim.setFillAfter(true);
anim.setDuration(200);
anim.setAnimationListener(new AnimationListener() {
#Override
public void onAnimationEnd(Animation animation) {
customView.clearAnimation();
customView.setVisibility(View.GONE);
customView.setEnabled(false);
}
#Override
public void onAnimationRepeat(Animation animation) {
// nothing to do
}
#Override
public void onAnimationStart(Animation animation) {
// nothing to do
}
}
}
}
I don't recall, but you may have to post() the contents of onAnimationEnd() instead of running the code immediately for it to take effect properly.