androidkotlinpinchzoomzoom-sdktouchimageview

How to keep additional ImageView on same position of a zoomable ImageView - after zooming (Kotlin)


I am using the TouchImageView Repository from MikeOrtiz for Kotlin to implement a zoomable ImageView into my Android APP - so far this is easy, even when I am a greenhorn in coding.

Now I want to add an additional ImageView (a red arrow) to the zoomable ImageView (a mountain). The red arrow should always point on the top of this mountain, but when I zoom the zoomable ImageView, the position and size of the red arrow does not follow this zoom code of course. I have no idea how to achieve the same behavior for the arrow, so that it keeps the position even when zoomed.

I read many "solutions" in the internet, but they either do not work, or are for other programming languages. Maybe someone knows how to solve my issue.

Yet there is no code in my main activity, but this is my XML code:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="230dp"
        android:layout_gravity="center">

        <com.ortiz.touchview.TouchImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@color/black"
            android:src="@drawable/mountain"/>

        <ImageView
            android:layout_width="48dp"
            android:layout_height="110dp"
            android:src="@drawable/arrow"
            android:translationX="185dp"
            android:translationY="-28dp" />

    </androidx.cardview.widget.CardView>



</FrameLayout>

This is my problem visualized:

Not zoomed - Correct position of arrow

Zoomed - Wrong position of arrow


Solution

  • Found a solution here:

    https://github.com/davemorrissey/ssiv-kotlin-sample

    The "Extension" Part was what I wanted.