Set bottom fixed while scaling in Android

Question

I have two Image views, one is below the other one.

I want to resize the images, and when one is getting bigger, I want the other one to be become smaller. But, I also want the image above to be pivoted at the top and the lower one to be pivoted at bottom.

I achieved this on first one (top), but I couldn't make the one below pivot at the bottom.

Question: How can I go about making the bottom image pivot and become smaller as the top one becomes larger.

Here is my layout :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:id="@+id/root">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/imageView"
            android:layout_alignParentTop="true"
            android:scaleType="fitCenter"
            android:src="@drawable/as" />

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/imageView"
            android:scaleType="fitCenter"
            android:id="@+id/imageView2"
            android:src="@drawable/as" />
</RelativeLayout>

Here is my Java code :

 root = (RelativeLayout) findViewById(R.id.root);
        iv = (ImageView) findViewById(R.id.imageView);
        iv2 = (ImageView) findViewById(R.id.imageView2);
        iv.setPivotY(iv.getX());


   detector = new GestureDetectorCompat(this, new GestureDetector.SimpleOnGestureListener() {

        @Override
        public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
            iv.setScaleY(iv.getScaleY() - distanceY / root.getHeight());
            iv2.setScaleY(iv2.getScaleY()+ distanceY / root.getHeight());
           return true;
        }
    });

Answer 1

I am not entirely sure what you are trying to achieve, but this code splits the screen into two section, each of which is used for one of the imageviews. I have left the code that scales the images and have code to set the pivot points, assuming you have some purpose in mind. I do suggest you comment them out and try to see if you get the desired results without them.

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context=".MainActivity"
                android:id="@+id/root">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
        android:layout_alignParentTop="true"
        android:scaleType="fitCenter"
        android:src="@mipmap/ic_launcher" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/imageView"
        android:scaleType="fitCenter"
        android:id="@+id/imageView2"

        android:src="@mipmap/ic_launcher" />
</RelativeLayout>

MainActivity.java:

import android.support.v4.view.GestureDetectorCompat;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.RelativeLayout;

import static com.example.justtesting.R.id.imageView;

public class MainActivity extends AppCompatActivity{

    GestureDetectorCompat detector;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final int minH = 10;
        final RelativeLayout root = (RelativeLayout) findViewById(R.id.root);
        final ImageView iv = (ImageView) findViewById(imageView);
        final ImageView iv2 = (ImageView) findViewById(R.id.imageView2);

        detector = new GestureDetectorCompat(this, new GestureDetector.SimpleOnGestureListener() {

            @Override
            public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
                int height = iv.getHeight() + iv2.getHeight();
                android.view.ViewGroup.LayoutParams layoutParams = iv.getLayoutParams();
                if ((int) distanceY + layoutParams.height < minH)
                    layoutParams.height = minH;
                else if ((int) distanceY + layoutParams.height > height - minH)
                    layoutParams.height = height-minH;
                else
                    layoutParams.height = (int) distanceY + layoutParams.height;
                android.view.ViewGroup.LayoutParams layoutParams2 = iv2.getLayoutParams();
                layoutParams2.height = height-layoutParams.height;
                iv.setLayoutParams(layoutParams);
                iv2.setLayoutParams(layoutParams2);
                return true;
            }
        });
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        return detector.onTouchEvent(event);
    }
}

Notice that I replaced your referenced image with the default launcher image in both ImageViews as I don't have your image file in my project.

android:src="@mipmap/ic_launcher"

Change it as you see fit.

And here are some screenshots of the app running on Nexus 5 emulator (X86-64)/Android-22 (same result with Android-23).

Good luck!