Rotation von einer Bitmap

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Rotation von einer Bitmap

    Hallo Entwickler, ich hab aktuell ein Problem wo ich nicht weiter weiß.

    Wie kann ich das Bild so drehen wie es im Bild ist?

    Ich hab schon camera, canvas und matrix probiert aber nichts hat so richtig funktioniert. :(

    Bitte helft mir :)
    Bilder
    • Unbenannt-1.png

      61,34 kB, 408×642, 225 mal angesehen
  • Hey Marco,

    ich hab jetzt einen relativ guten weg gefunden über Canvas den ich garnicht gewusst hab. ^^
    Aber ein kleines Problem gibt es trotzdem ich hab ein knick im Bild siehe Anhang.

    Hier der Code Snipped wie ich das Bild anpasse.


    Java-Quellcode

    1. public Bitmap rotateScreen(Bitmap screenshot) {
    2. float[] mPoints = {
    3. topLeftX, topLeftY,
    4. topRightX, topRightY,
    5. bottomLeftX, bottomLeftY,
    6. bottomRightX, bottomRightY
    7. };
    8. Bitmap cs = Bitmap.createBitmap(frames.getWidth(), frames.getHeight(), Bitmap.Config.ARGB_8888);
    9. Canvas canvas = new Canvas(cs);
    10. canvas.drawBitmapMesh(screenshot, 1, 1, mPoints, 0, null, 0, null);
    11. return cs;
    12. }
    Alles anzeigen



  • Der Knick scheint von oben links (topLeftX/topLeftY) nach unten rechts (bottomRightX/bottomRightY) zu gehen.

    Kannst Du das Ganze mal mit einer vernünftigen Dummy-Grafik machen?
    Beispielsweise von so einer Art Karopapier.
    Erst einmal quadratisch und dann vielleicht noch in einem Rechteck.

    Da lassen sich sicherlich bessere Annahmen zur Fehlerursache treffen.
    Je mehr Käse, desto mehr Löcher.
    Je mehr Löcher, desto weniger Käse.
    Daraus folgt: je mehr Käse, desto weniger Käse.

    »Dies ist ein Forum. Schreibt Eure Fragen in das Forum, nicht per PN!«
  • Okay, wenn ich mir das Resultat in Verbindung mit der Dokumentation so ansehe, dann sieht das 'richtig' aus…

    "Canvas.drawBitmapMesh(…)" schrieb:

    A more general version of this method is drawVertices().

    "Canvas.drawVertices(…)" schrieb:

    Draw the array of vertices, interpreted as triangles (based on mode).


    Du nimmst ein 2D Bild von sagen wir 5,68cm Höhe und 3,20cm Breite.
    Jetzt möchtest Du das auf sagen wir 4,75cm Höhe (links), 2,78cm Breite (oben), 5,32cm Höhe (rechts) und 3,02cm Breite (unten) skalieren.
    Dein Ansatz macht Folgendes: aus den vier Punktpaaren schnibbelt es sich zwei Rechtecke und skaliert sie entsprechend.
    Stumpf gesagt hast Du jetzt ein Dreieck mit spitzem 72° Winkel und einer Schenkellänge von 2,78cm x 5,32cm.
    Sowie ein Dreieck mit einem stumpfen 98° Winkel und einer Schenkellänge von 3,02cm x 4,75cm.
    Auf diese Dreiecke werden jetzt die ausgeschnittenen Dreiecke projiziert: 3,20 x 5,68 mit 90° auf 2,78 x 5,32 mit 72°; 3,20 x 5,68 mit 90° auf 3,02 x 4,75 mit 98°
    Daher hast Du diesen Knick, der bei Linien stark auffallend sichtbar ist. (Andererseits hat eine solche Transformation bei reinen Farben wenig Sinn…)

    Die von Dir benutzte Methode teilt Dein Mesh in flächenmäßig ungefähr gleich große Dreiecke und projiziert über jedes Dreieck einen Ausschnitt Deines Ursprungsbildes.
    Das ist so eine Art simuliertes 3D, bei dem ja auch einzelne Texturen auf einzelne Dreiecksflächen gepackt werden. Und wie bei 3D gilt: je mehr und dadurch kleiner die Dreiecke, desto besser das Ergebnis.

    Du könntest also dem Canvas einfach statt 4 Ecken (oben links, oben rechts, unten links, unten rechts) auch 9 Ecken geben (oben links, oben mitte, oben rechts, mitte links, mitte, mitte rechts, unten links, unten mitte, unten rechts). Du kannst das meinetwegen auch auf 64 Ecken aufblähen. Die Qualität wird immer besser, die Berechnungszeit immer höher.

    Eine Alternative wäre natürlich, direkt ein OpenGL View mit einer entsprechend vorbereiteten Szene bereit zu stellen, auf der Du dann jeweils die Textur darstellst.
    Fakt ist: einfach mal so lässt sich das nicht umsetzen.
    Je mehr Käse, desto mehr Löcher.
    Je mehr Löcher, desto weniger Käse.
    Daraus folgt: je mehr Käse, desto weniger Käse.

    »Dies ist ein Forum. Schreibt Eure Fragen in das Forum, nicht per PN!«
  • Aaaahh okay, danke für die Erläuterung, ich werde es einfach mal mit mehr ecken probieren da das OpenGL ein bisschen Kompliziert aussieht und ich nicht so recht weiß wie man dann dieses Bild speichert :/
  • Kurze frage am Rande mit dem Koordinaten, ich hab die jetzt so angeordnert ist das soweit korrekt? Weil ich wüsste jetzt nicht wie ich die anders anordnen soll Ich bekomme da solch ein gebilde raus :/





    Quellcode

    1. topLeftX, topLeftY,
    2. topMidX, topMidY,
    3. topRightX, topRightY,
    4. midLeftX, midLeftY,
    5. midMidX, midMidY,
    6. midRightX, midRightY,
    7. bottomLeftX, bottomLeftY,
    8. bottomMidX, bottomMidY,
    9. bottomRightX, bottomRightY
  • Die Anordnung scheint gemäß Dokumentation (von oben links nach unten rechts) richtig.
    Interessant müssten die Werte sein.
    Je mehr Käse, desto mehr Löcher.
    Je mehr Löcher, desto weniger Käse.
    Daraus folgt: je mehr Käse, desto weniger Käse.

    »Dies ist ein Forum. Schreibt Eure Fragen in das Forum, nicht per PN!«
  • das sind die einzelnen Werte (ja das ist sehr große koordinaten soll ja auch fullhd sein das bild ;) )


    Java-Quellcode

    1. float topLeftX, topLeftY, topMidX, topMidY, topRightX, topRightY,
    2. midLeftX, midLeftY, midMidX, midMidY, midRightX, midRightY,
    3. bottomLeftX, bottomLeftY, bottomMidX, bottomMidY, bottomRightX, bottomRightY;
    4. topLeftX = 377;
    5. topLeftY = 630;
    6. topMidX = 800;
    7. topMidY = 555;
    8. topRightX = 1197;
    9. topRightY = 486;
    10. midLeftX = 377;
    11. midLeftY = 1440;
    12. midMidX = 800;
    13. midMidY = 1440;
    14. midRightX = 1197;
    15. midRightY = 1440;
    16. bottomLeftX = 377;
    17. bottomLeftY = 2246;
    18. bottomMidX = 800;
    19. bottomMidY = 2321;
    20. bottomRightX = 1197;
    21. bottomRightY = 2390;
    Alles anzeigen
  • Davon ausgehend, dass oben links 0,0 ist, sieht das zumindest richtig aus…

    Ich würde jetzt einmal nur einzelne Viertel anzeigen, also zuerst topLeftX,topLeftY;topMidX,topMidY;midLeftX,mitLeftY;midMidX,midMidY;
    Dann mal gucken, was daraus gemacht wird.

    Dann das Viertel topMid->topRight->midMid->midRight und so weiter.
    Je mehr Käse, desto mehr Löcher.
    Je mehr Löcher, desto weniger Käse.
    Daraus folgt: je mehr Käse, desto weniger Käse.

    »Dies ist ein Forum. Schreibt Eure Fragen in das Forum, nicht per PN!«
  • Sieht auf jeden Fall richtig aus.

    Nun mal die Hälften probieren: obere Hälfte, untere Hälfte, linke Hälfte, rechte Hälfte, aber mit den jeweils 6 Koordinaten.

    Also für die obere Hälfte:
    topLeftX, topLeftY;
    topMidX, topMidY;
    topRightX, topRightY;
    midLeftX, midLeftY;
    midMidX, midMidY;
    midRightX, midRightY;
    Je mehr Käse, desto mehr Löcher.
    Je mehr Löcher, desto weniger Käse.
    Daraus folgt: je mehr Käse, desto weniger Käse.

    »Dies ist ein Forum. Schreibt Eure Fragen in das Forum, nicht per PN!«
  • So hab es jetzt mit

    topLeftX, topLeftY;
    topMidX, topMidY;
    topRightX, topRightY;
    midLeftX, midLeftY;
    midMidX, midMidY;
    midRightX, midRightY;

    und

    midLeftX, midLeftY,
    midMidX, midMidY,
    midRightX, midRightY,
    bottomLeftX, bottomLeftY,
    bottomMidX, bottomMidY,
    bottomRightX, bottomRightYProbiert das kam raus
    Bilder
    • screener_20150320(13-10-25).png

      489,27 kB, 1.600×2.880, 126 mal angesehen
    • screener_20150320(13-14-07).png

      444,76 kB, 1.600×2.880, 136 mal angesehen
  • Ausgezeichnet, da läuft also irgendwas schief. =)

    Offenbar hat die Doku irgendwo gelogen. Es sieht für mich so aus, als würde Deine Eingabe nicht von oben links nach unten rechts aufgelöst, sondern total willkürlich.

    Snippet 1 geht von topLeft -> topMid -> midLeft;
    Snippet 2 geht von topMid -> topRight ->midLeft;

    Alle Weiteren werden stumpf ignoriert.

    Zurück zur Dokumentation:
    verts Array of x,y pairs, specifying where the mesh should be drawn. There must be at least (meshWidth+1) * (meshHeight+1) * 2 + vertOffset values in the array
    Das ist gegeben. Also weiter im Text.
    meshWidth The number of columns in the mesh. Nothing is drawn if this is 0
    meshHeight The number of rows in the mesh. Nothing is drawn if this is 0

    Das bedeutet wohl, Du musst die Angaben in Breiten und Höhe gemäß Deiner Koordinaten anpassen.

    Java-Quellcode

    1. // also statt
    2. canvas.drawBitmapMesh(screenshot, 1, 1, mPoints, 0, null, 0, null);
    3. // Bedeutet: erzeuge mir eine Zeile und eine Spalte; also ein einziges Feld.
    4. // lieber
    5. canvas.drawBitmapMesh(screenshot, 2, 2, mPoints, 0, null, 0, null);
    6. // Bedeutet: erzeuge mir zwei Zeilen und zwei Spalten; also vier Felder.

    Je detaillierter Du das Bild darstellen willst, desto mehr Zeilen und Spalten musst Du auch zusätzlich zu den Punkten definieren.
    Je mehr Käse, desto mehr Löcher.
    Je mehr Löcher, desto weniger Käse.
    Daraus folgt: je mehr Käse, desto weniger Käse.

    »Dies ist ein Forum. Schreibt Eure Fragen in das Forum, nicht per PN!«