I was making this simple and cool looking animation.
And using this question - How to spin an android icon on its center point? I got my icon to rotate. But after the rotation I wish to move the image view upwards. How can I achieve this?
I'm using this code to move the imageview upwards.
TranslateAnimation animation = new TranslateAnimation(0, 0, 0, -700);
animation.setDuration(1*1500);
animation.setRepeatCount(0);
ImageButton logo_icon_two = (ImageButton) findViewById(R.id.logo_icon);
logo_icon_two.startAnimation(animation);
The problem is that when I add the code, the image view moves up but then goes back to the spot it was in, also the rotation animation stops. My full class below -
public class WelcomeActivity extends Activity {
private static final float ROTATE_FROM = 0.0f;
private static final float ROTATE_TO = -10.0f * 360.0f;// 3.141592654f * 32.0f;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.welcome_activity);
ImageButton logo_icon = (ImageButton) findViewById(R.id.logo_icon);
RotateAnimation r; // = new RotateAnimation(ROTATE_FROM, ROTATE_TO);
r = new RotateAnimation(ROTATE_FROM, ROTATE_TO, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
r.setDuration((long) 1*1500);
r.setRepeatCount(0);
logo_icon.startAnimation(r);
TranslateAnimation animation = new TranslateAnimation(0, 0, 0, -700);
animation.setDuration(1*1500);
animation.setRepeatCount(0);
ImageButton logo_icon_two = (ImageButton) findViewById(R.id.logo_icon);
logo_icon_two.startAnimation(animation);
}
}
Question is, how can I make it that, when opening app. the image rotates and then stops, and then the image is then moved up.
You have to call setFillAfter(true) method for both your animations, and if necessary, change the layoutparams of imageview after animation end then invalidate once.
Related
The Translate animation works, but I cant scale it. What happens when I add it in, the ImageView for it disappears
TranslateAnimation translateMeteor = new TranslateAnimation(32,221,40,300);
translateMeteor.setDuration(5000);
translateMeteor.setRepeatCount(Animation.INFINITE);
translateMeteor.setInterpolator(new LinearInterpolator());
ScaleAnimation scaleMeteor = new ScaleAnimation(1500,200,1300,100);
scaleMeteor.setDuration(5000);
scaleMeteor.setRepeatCount(Animation.INFINITE);
scaleMeteor.setInterpolator(new LinearInterpolator());
AnimationSet meteorAnimation = new AnimationSet(false);
meteorAnimation.addAnimation(translateMeteor);
meteorAnimation.addAnimation(scaleMeteor);
meteor.startAnimation(translateMeteor);
meteor.startAnimation(meteorAnimation);
For those wondering, I have tried to run it without TranslateAnimation, but same issue happens
{Visual Aid}
I am making an application with a drag and drop menu. User can fill out three edit texts (width, height, and rotation) then press on "add new" button and a new button with the specified values is created at the origin. However if the rotation attribute is anything other than 0 say 45 degrees, then it rotates the whole button along with the text. I would like for the text to remain horizontal with no rotation. I have looked up but the post all refer back to the rotation attribute which i am already using.
onViewCreated()
tvAddTable = view.findViewById(R.id.btn_add_table);
tvWidth = view.findViewById(R.id.et_width);
tvHeight = view.findViewById(R.id.et_height);
tvRotation = view.findViewById(R.id.et_rotation);
mSize = new Point();
mDisplay = Objects.requireNonNull(getActivity()).getWindowManager().getDefaultDisplay();
mDisplay.getSize(mSize);
final View.OnTouchListener touchListener = this;
tvAddTable.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {[enter image description here][1]
ConstraintLayout layout = view.findViewById(R.id.floor_layout);
//set the properties for button
Button btnTag = new Button(getContext());
btnTag.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));
if(ids.isEmpty()){
ids.add(0);
}else{
ids.add(ids.size());
}
btnTag.setId(ids.size());
btnTag.setText(Integer.toString(btnTag.getId()));
//add button to the layout
layout.addView(btnTag);
btnTag.setLayoutParams(new ConstraintLayout.LayoutParams(Integer.parseInt(tvWidth.getText().toString()), Integer.parseInt(tvHeight.getText().toString())));
btnTag.setRotation(Integer.parseInt(tvRotation.getText().toString()));
btnTag.setOnTouchListener(touchListener);
}
});
The rotation attribute rotates the entire view, not just the text or just the background. That's by design. There is no text or background rotation attribute. If you need that, make a custom view.
If you only want the background to rotate, you can probably do it by setting the background drawable to a RotateDrawable that wraps the background you want.
I'm trying to have two animations occur in one activity with the first happening first and only once it's done, does the second start. The ObjectAnimator moves the imageView up the screen using the .ofFloat() method and then I want a loading animation which loops through several image files to create a loading-like effect.
This is my code:
//Animations
final Handler handler = new Handler(Looper.getMainLooper());
handler.postDelayed(new Runnable()
{
#Override
public void run()
{
//Change cloud from sleeping to awake/happy
g2ndSleepingClouds.setBackgroundResource(R.drawable.clouds_happy_formatted);
//Move image view 250 pixels up the screen vertically
ObjectAnimator animation1 = ObjectAnimator.ofFloat(g2ndSleepingClouds, "translationY", -250f);
animation1.setDuration(1000);
animation1.start();
//Loading animation
loadingImageView.setBackgroundResource(R.drawable.loading_1);
loadingAnimation = (AnimationDrawable) loadingImageView.getBackground();
loadingAnimation.stop();
loadingAnimation.start();
}
}, 1000);
The error I get in Logcat is:
"android.graphics.drawable.BitmapDrawable cannot be cast to android.graphics.drawable.AnimationDrawable"
Any help?
I have a spinning wheel, which is an ImageView, in my app, and the animation is working well, but the issue is for just a split second it snaps back to it's original position (0 degree rotation). The .gif below shows what I am talking about.
The last split second of the rotation it has that awkward snap back that makes the animation look extremely unsmooth.
I am looking for a way to fix this but I cannot quite figure it out. This is my code right now that animates the ImageView and rotates it to the final position of the animation
ImageView readyButton = findViewById(R.id.spinnerready);
final ImageView spinnerSpin = findViewById(R.id.spinnerspin);
final Animation animRotate = new RotateAnimation(ROTATE_FROM, ROTATE_TO, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
animRotate.setDuration(5000);
animRotate.setRepeatCount(0);
readyButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
float newDeg = ROTATE_TO;
spinnerSpin.startAnimation(animRotate);
spinnerSpin.postDelayed(new Runnable() {
#Override
public void run() {
spinnerSpin.setRotation(ROTATE_TO);
}
}, 5000);
while(newDeg > 360) {
newDeg = newDeg - 360;
}
}
});
I have also tried changing the delay of the rotation to 4500 instead of 5000 but the issue is not fixed. Is there a way to eliminate the ImageView from going back to its original position after the animation?
I am creating an image by using Canvas- and Bitmap class. I want to set it as a background for the user. Then I want to add some more images on top of it.
this is the code for image that is supposed to be as background.
ImageView imgMap1 = (ImageView) findViewById(R.id.imgMap1);
imgMap1.setImageDrawable(new BitmapDrawable(Bitmap.createBitmap(bmp, 0, 0, 500, 500)));
and this is the code to make it as background:
LinearLayout ll = new LinearLayout(this);
ll.setBackgroundResource(R.drawable.nn);
this.setContentView(ll);
The Problem here is: When I set it as background, I can't see the other photo anymore.
How can I do this?
Thanks in advance.
The other Images are added in the Layout. they are movable by finger touch. user can reposition them by finger.
ImageView i1 = (ImageView) findViewById(R.id.Image1);
ImageView i2 = (ImageView) findViewById(R.id.Image2);
The layout is built from the top down in your XML file, or in the order you add elements in code. It sounds like your other images is being added to the layout first, either as a higher-up element in the XML file, or earlier in your code. You'll need to add the other code as context for a complete answer.
Just noticed that you can directly set Bitmap as your ImageView's content using setImageBitmap(Bitmap bm)See the Android Reference
Then let talk about your question.
First, create your own class extends the View;
Second, load background image and overlay image using Bitmap
Third, invoke onTouch event, so that the onDraw method will automatically redraw the overlay image using the coordinates returned by onTouch
Something like:
public class dragndrop extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
// using this to load your background image
BitmapFactory.Options opt = new BitmapFactory.Options();
opt.inPreferredConfig = Bitmap.Config.RGB_565; // this is not a must
bmBackground = BitmapFactory.decodeFile(filePath, opt);
super.onCreate(savedInstanceState);
DrawView dv = new DrawView(dragndrop.this);
setContentView(dv);
}
public class DrawView extends View {
Point coordinate;
public DrawView(Context context) {
super(context);
setFocusable(true); //necessary for getting the touch events
}
#Override
protected void onDraw(Canvas canvas) {
// assume you have already load your background image as bitmap
canvas.drawBitmap(bmBackground, 0, 0, null);
// assume bm is the overlay image you need to put on top,
// the method here will draw the object with the coordinate you give
canvas.drawBitmap(bm, coordinate.x, coordinate.y, null);
}
// events when touching the screen
public boolean onTouchEvent(MotionEvent event) {
int eventaction = event.getAction();
int x = (int)event.getX();
int y = (int)event.getY();
switch (eventaction ) {
case MotionEvent.ACTION_DOWN:
// add code here to determine the point user touched is within the object or not
break;
}
}
break;
case MotionEvent.ACTION_MOVE: // touch 'n' drag
// pass the touch point to your object
coordinate.x = x;
coordinate.y = y;
break;
case MotionEvent.ACTION_UP:
// touch drop - just do things here after dropping
break;
}
// redraw the canvas
invalidate();
return true;
}
}
}
This is my own snippet, please edit before use, and please let me know when your question is resolved.