Hallo,

ich möchte nun eine GUI für mein 2D-Spiel schreiben. Ich habe 8 Grafiken für ein Fenster: Die vier Seiten und die vier Ecken. Die Ecken zeichne ich eben da hin, wo sie hingehören, und die Seiten zerre ich, indem ich die Breite bzw. Höhe des Quads größer setze als die Grafik ist.

Nun passiert leider ein unschöner Effekt des Texturenfilters, der im Anhang gut zu erkennen ist.

Eigentlich müsste dieser Fehler doch behoben werden können, indem man einen blaken (volltransparenten) Rand rund um die Grafiken erstellt, oder? Seltsamerweise ist das Resultat immer noch dasselbe.

Wenn ihr die Grafiken oder den Quelltext braucht, liefere ich das noch nach.

Danke für eure Mühe!

Grüße,
Yogu

ich vermute du hast alle 8 Grafiken in einer Textur? Der Trick ist nicht die exakten Texturkoordinaten zu verwenden. Wenn du nämlich GL_LINEAR als Filter wählst, was ja auch sinnvoll ist, wird immer zwischen Pixeln in der Textur interpoliert, auch wenn du eigentlich exakt den korrekten Pixel angibst. Das fällt innerhalb der Textur nicht auf, sondern nur am Rand, weil dort eben mit dem Rand interpoliert ist.

Statt nun auf die Texturkoordinate 0.5 zuzugreifen, führst du ein Epsilon ein. Epsilon ist einfach eine sehr kleine Zahl, die etwa ein Zehntel der Größe eines Texturpixels (Texel) entspricht. Sagen wir epsilon := 0.0001. Dann setzt du die Texturkoordinate auf 0.5 - epsilon = 0.4999, so das du also vom Rand der Textur wegrückst. So wird nämlich mit dem nächsten Pixel innerhalb der Textur interpoliert und nicht mit dem außerhalb.

Einen ähnlichen Effekt kannst du auch erreichen wenn du die Grafiken nicht direkt nebeneinander in eine Textur wirfst, sondern dazwischen etwas Platz lässt. Diesen Platz füllst du nicht etwa mit Schwarz oder Transparent, sondern mit der jeweiligen Randfarbe deiner Grafiken!

Ich hoffe die Idee ist klar, ansonsten einfach fragen

_________________
Yeah!

Nein, ich habe 8 verschiedene Texturen. Wäre eine einzelne sinnvoller? Leider sind nicht alle gleich groß, was das komplizierter machen würde.


Ja, das Interpolieren ist mir auch schon aufgefallen (bis auf die Tatsache, dass es sich so nennt ), und daher habe ich ja auch versucht, transparente Ränder einzufügen.

Also das:


Gut, das hab ich dann wohl falsch gemacht. Ich habs jetzt gerade noch mit dem Fortführen der Randfarbe ausprobiert; aber da ich Transparenten verwende, vermischen sich die überlappenden Ränder und verdichten sich zu einer dunkleren Farbe.


Ich nehme letzeres

Danke auf jeden Fall schonmal für deine Antwort!

Grüße,
Yogu

Das mit dem Epsilon könnte auch funktionieren, wenn du direkt das Epsilon in der Texturmatrix einbaust. (glTranslate)

_________________
Blog: kevin-fleischer.de und fbaingermany.com

Und wie meinst du das genau? So ganz habe ich den Sinn dieses Epsilons noch nicht verstanden, dazu blicke ich zu wenig hinter die Kulissen dieses Filters. Aber so hast du es sicher nicht gemeint, oder?



Das funktioniert nämlich genauso wenig

Hmm... Wenn du die Texturen nicht skalierst, würde ich GL_NEAREST als Filterfunktion empfehlen.

Das machst du beim initialisieren der Textur.

Gruß Lord Horazont

_________________
If you find any deadlinks, please send me a notification – Wenn du tote Links findest, sende mir eine Benachrichtigung.
current projects: ManiacLab; aioxmpp
zombofant network • my photostream
„Writing code is like writing poetry“ - source unknown

„Give a man a fish, and you feed him for a day. Teach a man to fish and you feed him for a lifetime. “ ~ A Chinese Proverb

Dann solltest du zu allererst mal dafür sorgen, dass sich die Ränder nicht überlappen....

_________________
Yeah!

Die Überlappungen waren dazu da, die Filteraktivität in den Randbereichen zu unterdrücken.

Ich hab das jetzt mal wieder entfernt (also Überlappungen ausgeschlossen - ein Test halbtransparenten Texturen beweist den Erfolg - und Lord Horazont's Vorschlag zur Filteränderung angewendet. Das Ergebis ist aber immer noch nicht wünschenswert, ich frage mich, ob es überhaupt besser geworden ist. (Unterer Anhang)

Die sichtbaren Verschiebungen zwischen den Grafiken sind übrigens keine Programmierfehler, sondern entstehen durch den Filter. Lasse ich Lord Horazont's zwei Zeilen weg, passt wieder alles - aber die Ränder werden durch den Filter verfälscht (Oberer Screenshot)

Ich danke für die bisherigen Antworten, Lord Horazont und Coolcat! (Und hoffe auf weitere )

Grüße,
Yogu

Bin mir grad nicht ganz sicher, sollte es aber nicht auch was bringen den GL_TEXTURE_WRAP_S und GL_TEXTURE_ WRAP_T auf GL_CLAMP_TO_EDGE zu setzen?

Aya

Clamp to edge funktioniert leider nur wirklich am Rand einer Textur (die Texel am Rand). In der Mitte einer Textur hat es keine Auswirkung.

Yogu kann es sein, dass die Ecken nicht pixelgenau dargestellt sind? Ich hatte vor ein paar Jahren mal was gemacht da habe ich auch so eine Art Fenster aus 9 Quads zusammengebaut. Dabei habe ich sehr genau darauf geachtet, dass die Ecken wirklich Pixelgenau sind und nur die langgezogenen Kanten nicht pixelgenau (geht ja auch nicht). Und bei mir hatte das funktioniert. Auch mit aktivierter Filterung.

Bzw frage ich mich gerade wie du deine Teilstücke innerhalb der Textur angeordnet hast. Also da würde ich auch sagen, dass diese in etwa den Aufbau deines Fensters wiederspiegeln sollten. Denn selbst wenn der Filter dann dazwischen haut, dann würde er nur in das passende Gegenstück filtern was aber wieder die richtige Farbe hätte. = keine dunklen Striche.

Ich hatte ihn aber auch so verstanden das er für jede textur eine eigene hat

Ups. Stimmt. Wer lesen kann ist klar im Vorteil. Wenn die Teilstücke die Textur bis zum Rand ausfüllen dann sollte clamp natürlich auch gehen. Wobei ich persönlich eine Textur vorziehen würde.

Eine Textur ist definitiv besser. Du musst sonst um ein Fenster zu zeichnen 8 verschiedene Texturen binden. Das ist dann auch noch laaaaangsam.

_________________
Blog: kevin-fleischer.de und fbaingermany.com

Genial, Danke! Das funktioniert prima (:D), aber leider nur in der T-Achse (:().

Ich verwende dafür folgende Zeilen, und für mich sehen die vollkommen fehlerfrei aus:




Ne, ich hab das grad noch mal nachgeprüft. Die Quads sind genau gleich groß wie die Texturen, bis auf natürlich die der Kanten.


Korrekt


Es sollte zwar, tut es aber nicht.


Ok, aber da machen diese Filterfehlerchen dann doch noch mehr Probleme als in separaten, oder?

Danke für eure zahlreichen Antworten!

Grüße,
Yogu

ich kann mich meinen Vorrednern nur anschließen. Als ich mir einige Gui-Elemente zusammen gekittet habe, habe ich direkt alle Element in eine quadratische Textur gelegt mit Alphakanal, die glBitmap bietet ja an .tga Dateien zu laden und kann im Zusammenhang mit Blending ohne weiteres den Alphakanal auch nutzen. Dazu ist es am sinnvollsten, die Hintergrundfarbe der Textur so zuwählen, dass die Außenfarbe der Gui-Element gleich oder zumindest extrem ähnlich zum Hintergrund ist, das verhindert hässliche Farbverläufe an den Kanten. Desweitern kann ich nur empfehlen für ein Gui die Texturkordinaten der einzelnen Gui-Elemente in eine Datei zuspeichern. Die Koordinaten bekommst du ganz einfach in dem du 1/Texturbreite bzw. 1/ Texturhöhe mit den Pixelkoordinaten der Elemente multiplizierst. Diese exakten Koordinaten sollten verhindern, dass die Elemente in irgendeiner Form zu einer Seite interpoliert werden. Außerdem ist für solche Zwecke GL_NEAREST aufjedenfall angebracht, da deine Grafik ja bereits Pixelgenau gezeichnet sein sollte.
Wenn du all diese Sachen einigermaßen befolgst (das speichern muss ja nicht unbedingt sein), dann sollte es klappen. Hast du dann immer noch einen Fehler, kann es sein, dass die merkwürdigen Artefakte durch schiefe Vertex-Koordinaten verursacht werden. Diese Problem hatte ich auch schon einmal, wo aus mir unerklärlihen Gründe Komma-werte auftraten beim zeichen der Quads/Triangles. Das kannst du ja auch einmal testen. Evtl. liegts irgendwo an einem gltranslate oder so.

PS.: zum erstellen von TGA Bildern kannst du Gimp oder Photoshop verwenden. Da Gimp frei ist, würde ich dazu tendieren.

grüße, Sellmann

_________________
Klar Soweit?