Grafiken abrunden (transparente Ecken)

[d34th]

Auf einer neuen Homepage wird es einen wechselnden Hintergrund geben (alle x Stunden). Da der Contentbereich mit einem zu 20% durchsichtigem Hintergrund versehen ist (PNG-32), ändert sich demnach auch alle x Stunden die Hintergrundfarbe des Content-Bereichs.

In News auf der Seite können per Newseditor (TinyMCE) Grafiken eingebunden werden. Da aber (weil es optisch besser aussieht) alle Grafiken abgerundete Ecken haben sollen, müssen die Redakteure die Möglichkeit haben online normale Grafiken zu Grafiken mit abgerundeten Ecken umzuwandeln (jedes mal auf jemanden zu warten, der fix in Photoshop die Ecken abrundet ist zu unkomfortabel).

Weil sich nun aber wiederum die Hintergrundfarbe des Contentbereichs ändern kann, würde man mit der Lösung ein PNG-Bild mit runden Ecken in Farben des Hintergrunds und in der Mitte 100%iger Transparenz über das zu bearbeitende Bild zu legen, nicht weiterkommen. Es sollen in diesem Fall echte transparente und runde Ecken geschaffen werden.

Nun die Frage: Lässt sich das ganze irgendwie so realisieren, dass man das fertige Programm auf den Server legt und jeder Redakteur es nutzen kann (also am besten PHP) und wenn ja....wie?

 

[gp812]

AW: Grafiken abrunden (transparente Ecken)

Auf einer neuen Homepage wird es einen wechselnden Hintergrund geben (alle x Stunden). Da der Contentbereich mit einem zu 20% durchsichtigem Hintergrund versehen ist (PNG-32), ändert sich demnach auch alle x Stunden die Hintergrundfarbe des Content-Bereichs.

In News auf der Seite können per Newseditor (TinyMCE) Grafiken eingebunden werden. Da aber (weil es optisch besser aussieht) alle Grafiken abgerundete Ecken haben sollen, müssen die Redakteure die Möglichkeit haben online normale Grafiken zu Grafiken mit abgerundeten Ecken umzuwandeln (jedes mal auf jemanden zu warten, der fix in Photoshop die Ecken abrundet ist zu unkomfortabel).

Weil sich nun aber wiederum die Hintergrundfarbe des Contentbereichs ändern kann, würde man mit der Lösung ein PNG-Bild mit runden Ecken in Farben des Hintergrunds und in der Mitte 100%iger Transparenz über das zu bearbeitende Bild zu legen, nicht weiterkommen. Es sollen in diesem Fall echte transparente und runde Ecken geschaffen werden.

Nun die Frage: Lässt sich das ganze irgendwie so realisieren, dass man das fertige Programm auf den Server legt und jeder Redakteur es nutzen kann (also am besten PHP) und wenn ja....wie?

Also es muss gehen, und ich glaub, ich hab es schon irgendwo gesehen.
Da hat man mit PHP eine transparente Vorlage erstellt, die genau so groß wie das bild war. Dann hat man am bil die ecken abgeschnitten, und mit der vorlage zusammengeführt.

 

[d34th]

AW: Grafiken abrunden (transparente Ecken)

Jo z.B..

Die Frage ist nur: Wie, also mit welchem Befehl, schneidet man die Ecken ab!?

...oder fällt irgendjemand nen "um-die-Ecke" Trick ein um das zu realisieren.

 

[Christian]

AW: Grafiken abrunden (transparente Ecken)

 

[Chickenshooter]

AW: Grafiken abrunden (transparente Ecken)

...oder die GD2 Lib die könnte das auch tun
link: PHP: Image Funktionen - Manual

MfG Chick

 

[CIX88]

AW: Grafiken abrunden (transparente Ecken)

Ich habe ja schon viel mit der GDlib gemacht, aber saubere runden Ecken geht mit der GDlib nicht wirklich.
Beispiel:
Versuch: runde Ecken mit GDlib
Versuch: runde Ecken mit GDlib [2]

 

[d34th]

AW: Grafiken abrunden (transparente Ecken)

Also GDlib bringt mir nichts, da die Ecken nicht transparent sind (siehe Grafik) und diese zudem echt mal extrem hässlich aussehen ^^



Das ist nen Bild, was von dem Code erzeugt wird, den CIX88 hier verlinkt hat.

...Hab grad mal nen bisschen Meister Google zum Thema gefragt (Image Magick und rounded edges/corners) und bin tatsächlich fündig geworden...

Other - Rounded_corners example

Da man bei privaten Pages ja nie weiss wie schnell sie off gehen hier nochmal der benötigte Code bzw. der Kommentar des Autors:

A method of adding rounded corners to an image by el_supremo on the ImageMagick forum.
This is saving as a png, you may need to save as a gif if png transparency is not supported.

<?php
exec("convert -size 637x140 xc:none -fill white \\
-draw \"roundRectangle 0,0 637,140 15,15\" \\
../original_images/albir.jpg -compose SrcIn -composite rounded_corners.png ");
?>

Muss natürlich ImageMagick installiert sein auf dem Server Danke für die Hilfe!

 

[SweetPenguin]

AW: Grafiken abrunden (transparente Ecken)

dies ist auch sehr nützlich

CVI-Projects (Canvas|Vml|Image effects)