What am I doing wrong in creating this android floating bubble animation?

Question

I am trying to translate this Swift code:

@objc func heartFlurry()
{
    let heartImage = UIImage(named: "heartWhite")
    let heartImageView = UIImageView(image: heartImage)
    let screenSize = UIScreen.main.bounds
    let heartWidth = Int(heartImage!.size.width)
    let heartHeight = Int(heartImage!.size.height)
    let randomX = arc4random_uniform(UInt32(screenSize.width))
    heartImageView.frame = CGRect(x: Int(randomX) - Int(Double(heartWidth) * 0.5), y: Int(screenSize.height) + heartHeight, width: heartWidth, height: heartHeight)
    view.addSubview(heartImageView)
    let randomIntFrom0To4 = Int.random(in: 1..<6)
    print(randomIntFrom0To4)
    self.updateLove()
    self.playSound(sound: "pop_\(randomIntFrom0To4)")
    UIView.animate(withDuration: 1.5, animations: {
        heartImageView.center = CGPoint(x: heartImageView.center.x, y: CGFloat(-heartHeight))
    }) { (finished: Bool) in
        heartImageView.removeFromSuperview()
    }
}

Into Java, The code (when tapped multiple times) creates an effect that looks like this:

So far I have got this into my Java code:

 void heartFlurry() {

    Drawable heart = getResources().getDrawable( R.drawable.heart );
    View v = new ImageView(getBaseContext());
    ImageView imageView;
    imageView = new ImageView(v.getContext());
    imageView.setImageDrawable(heart);

    Integer heartWidth = heart.getIntrinsicWidth();
    Integer heartHeight = heart.getIntrinsicHeight();

    Display display = getWindowManager().getDefaultDisplay();
    Point size = new Point();
    display.getSize(size);
    int width = size.x;
    int height = size.y;
    Log.e("Width", "" + width);
    Log.e("height", "" + height);

    final int randomX = new Random().nextInt(size.x);
    Log.e("randomX", "" + randomX);

    // RelativeLayout. though you can use xml RelativeLayout here too by `findViewById()`
    final RelativeLayout relativeLayout = new RelativeLayout(this);

    // Setting layout params to our RelativeLayout
    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(size.x, size.y);

    // Setting position of our ImageView
    layoutParams.leftMargin = randomX;
    layoutParams.topMargin = 500;

    // Finally Adding the imageView to RelativeLayout and its position
    relativeLayout.addView(imageView, layoutParams);

    ObjectAnimator animationY = ObjectAnimator.ofFloat(imageView, "translationY", -size.y);
    animationY.setDuration(500);
    animationY.start();

    new CountDownTimer(500, 1000) {
        public void onTick(long millisUntilFinished) {
        }

        public void onFinish() {
           relativeLayout.removeAllViews();

        }
    }.start();

}

I feel like I have all the elements there, creating the imageview, adding a relative layout and setting it at the bottom of the screen and using a random Int for a random X position within the screen width, but nothing happens when I run it. What am I missing?

Thank you.

Answer 1

The problem was with the Relative Layout I created, it was not being properly added to the view.

I added a RelativeLayout in XML to the activities content XML rather than creating it programatically, then referred to it:

RelativeLayout relativeLayout;
relativeLayout = findViewById(R.id.heartLayout);

Then I updated the heartFlurry function to add a rule to the heartImageView params, to start at the bottom of the screen, and use the randomX for the leftMargin.

void heartFlurry() {

    Drawable heart = getResources().getDrawable( R.drawable.heart );
    View v = new ImageView(getBaseContext());
    ImageView imageView;
    imageView = new ImageView(v.getContext());
    imageView.setImageDrawable(heart);

    Display display = getWindowManager().getDefaultDisplay();
    Point size = new Point();
    display.getSize(size);
    int width = size.x;
    int height = size.y;
    Log.e("Width", "" + width);
    Log.e("height", "" + height);

    final int randomX = new Random().nextInt(size.x);
    Log.e("randomX", "" + randomX);

    RelativeLayout.LayoutParams paramsImage = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
    paramsImage.addRule(RelativeLayout.CENTER_IN_PARENT);
    imageView.setLayoutParams(paramsImage);
    relativeLayout.addView(imageView);

    RelativeLayout.LayoutParams heartParams = new RelativeLayout.LayoutParams(
            RelativeLayout.LayoutParams.WRAP_CONTENT,
            RelativeLayout.LayoutParams.WRAP_CONTENT
    );
    heartParams.leftMargin = randomX;
    heartParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM, RelativeLayout.TRUE);
    imageView.setLayoutParams(heartParams);

    ObjectAnimator animationY = ObjectAnimator.ofFloat(imageView, "translationY", -size.y);
    animationY.setDuration(500);
    animationY.start();

    new CountDownTimer(1000, 1000) {
        public void onTick(long millisUntilFinished) {
        }

        public void onFinish() {
           relativeLayout.removeAllViews();
            Log.e("randomX", "Timer Done");

        }
    }.start();

}