Wie erhalte ich den Schnittpunkt von zwei Linien (ImageViews)

Question

Ich wurde gebeten, eine Aufgabe zu bearbeiten, bei der es zwei Linien gibt und ich den Schnittpunkt der beiden Linien ermitteln muss. Die beiden Linien sind ImageView s und beide ImageView s gezogen werden können, und wenn sich diese beiden Linien schneiden, muss ich den Schnittpunkt ermitteln. Hier ist der Code, den ich bis jetzt implementiert habe:

main.xml

---

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <ImageView android:id="@+id/xImg1" android:layout_width="100sp"
        android:layout_height="100sp" android:layout_marginTop="50sp"
        android:layout_marginLeft="10sp"
        android:background="@drawable/line_6x10" />
    <ImageView android:id="@+id/xImg2" android:layout_width="100sp"
        android:layout_height="100sp" android:layout_marginTop="50sp"
        android:background="@drawable/line_10x10" android:layout_marginLeft="200sp" />

main.java

---

package sra.inter;

import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.RelativeLayout.LayoutParams;

public class Main extends Activity implements OnTouchListener {
    private ImageView mImg1, mImg2;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        mImg1 = (ImageView) findViewById(R.id.xImg1);
        mImg2 = (ImageView) findViewById(R.id.xImg2);
        mImg1.setOnTouchListener(this);
        mImg2.setOnTouchListener(this);
    }

    int x1 = 100, y1 = 10, x2 = 200, y2 = 50;

    @Override
    public boolean onTouch(View v, MotionEvent event) {

        if (v == mImg1) {

            LayoutParams mLayoutParams = (LayoutParams) mImg1.getLayoutParams();
            if (event.getAction() == MotionEvent.ACTION_MOVE) {

                x1 = (int) event.getRawX();
                y1 = (int) event.getRawY();
                mLayoutParams.leftMargin = x1 - 5;
                mLayoutParams.topMargin = y1 - 60;
                mImg1.setLayoutParams(mLayoutParams);
                check();

            }
        } else if (v == mImg2) {

            LayoutParams mLayoutParams = (LayoutParams) mImg2.getLayoutParams();
            if (event.getAction() == MotionEvent.ACTION_MOVE) {
                x2 = (int) event.getRawX();
                y2 = (int) event.getRawY();
                mLayoutParams.leftMargin = x2 - 5;
                mLayoutParams.topMargin = y2 - 60;
                mImg2.setLayoutParams(mLayoutParams);
                check();
            }

        }

        return true;
    }

    boolean b = false;

    private void check() {

        if (x1 == x2 || y1 == y2) {
            if (!b) {
                b = true;
Log.w("---> x1 " + x1 + "   y1 :" + y1 + "   x2: " + x2+ " y2 :" + y2 + "", "-->");
        Toast.makeText(getApplicationContext(), " interected ", 0)
                        .show();
                mImg1.setOnTouchListener(null);
                mImg2.setOnTouchListener(null);

            }
        }
    }

}

Bild 1:

Bild 2:

Bild 3:

Wie erhält man den Schnittpunkt dieser beiden Linien?

Answer 1

Ich würde das mit reiner Mathematik beginnen!

Unter der Annahme, dass sowohl ImageView1 als auch ImageView2 keinen Beschnitt haben (d.h. die Linien in den Bildern sind die Diagonale des ImageViews), könnten Sie die Breite und die Höhe beider Bilder verwenden, um beide Linien in Formeln auszudrücken. Hier ist ein Beispiel. HINWEIS: Ich verwende das Android-Koordinatensystem -> Punkt (0,0) ist die obere linke Ecke mit y-Inkrementierung nach unten!!!

Klicken Sie hier für die grafische Darstellung

Zeile1

y = h1/w1(x - a1) + b1

Zeile2

y = -h2/w2(x - a2) + b1 + h2

Jetzt wollen wir den Punkt, an dem Linie1 = Linie2 ist, also erhalten wir

h1/w1(x - a1) + b1 = -h2/w2(x - a2) + b1 + h2

Wenn man die Gleichung umschreibt, erhält man:

x = (w1\*w2\*(b2 + h2 - b1) + h1\*w2\*a1 + h2\*w1\*a2) / (h1\*w2 + h2\*w1);

Sobald Sie die x-Koordinate kennen, können Sie damit die y-Koordinate bestimmen... Nachfolgend finden Sie etwas Code:

private void check() 
    {
        // Setup variables for shorter notation
        int w1 = mImg1.getWidth();
        int h1 = mImg1.getHeight();
        int a1 = mImg1.getLeft();
        int b1 = mImg1.getTop();

        int w2 = mImg2.getWidth();
        int h2 = mImg2.getHeight();
        int a2 = mImg2.getLeft();
        int b2 = mImg2.getTop();

        int x = 0;
        if(h1*w2 + h2*w1 == 0)
        {   // Return to avoid division by zero
            return;
        }
        else
        {   // Calculate the x-value using the re-written formula
            x = (w1*w2*(b2 + h2 - b1) + h1*w2*a1 + h2*w1*a2) / (h1*w2 + h2*w1);
        }

        // Now use the x-value to calculate the y-value
        int y = h1 / w1 * (x - a1) + b1;

        Log.d("Output", "x: " + x + " y:" + y);     
    }

HINWEIS: Sie sollten Ihre ImageViews auf Android:width="wrap_content" und Android:height="wrap_content" einstellen. Andernfalls sind die Bilder auf die von Ihnen eingegebene Größe fixiert! Ich habe es mit einer ImageView mit einem kreisförmigen Hintergrund getestet. Wenn man die berechneten x-y-Koordinaten verwendet, wird die Kugel genau am Schnittpunkt gezeichnet! Viel Erfolg!