[TYPO3-german] GIFBUILDER + abgerundete Ecken + Schlagschatten

Peter Jaraczewski peter at norvlit.de
Thu Jul 17 16:37:15 CEST 2008


Hallo!

Hat jemand von euch Erfahrungen mit Masken (abgerundete Ecken) im 
GIFBUILDER, und dann einem nachträglichen Schlagschatten? Das Ergebnis 
der ersten Operation müsste in PNG Form vorliegen, damit man den 
Schlagschatten durch die "transparenten" spitzen Ecken hindurchsieht.

Ich habe im Web TS Beispiele für beide Operationen gefunden, aber ich 
scheitere daran diese unter einen Hut zu bringen.

Runde Ecken:
tt_content.image.20.1.file >
tt_content.image.20.1.file {
     import.current = 1
     width.field = imagewidth
     m.mask.import.cObject = IMG_RESOURCE
     m.mask.import.cObject.file = GIFBUILDER
     m.mask.import.cObject.file {
       # Hier wird die dynamische Maske mit der gleichen größe wie das 
aktuele
       # Bild erstellt, aber mit runden Ecken.
       XY = [10.w],[10.h]
       format = png
       # Da der "XY" Parameter keinen stdWrap hat, finden wir die größe 
durch
       # erneutes laden des Bilds herraus
       10 = IMAGE
       10.file {
         import.current = 1
         width.field = imagewidth
         maxW = {$styles.content.imgtext.maxW}
         maxW.override.data = register:maxImageWidth
         maxWInText = {$styles.content.imgtext.maxWInText}
         maxWInText.override.data = register:maxImageWidthInText
       }
       # Erstellen einer weißen Box der die ganze größe einnimmt
       20 = BOX
       20.dimensions = 0,0,[10.w],[10.h]
       20.color = #FFFFFF

       # Die Maske für die Ecke oben links setzen
       30 = IMAGE
       30.file = {$imagePath}cornermask_tl.gif
       30.align = l,t

       # Die Maske für die Ecke oben rechts setzen
       40 = IMAGE
       40.file = {$imagePath}cornermask_tr.gif
       40.align = r,t

       # Die Maske für die Ecke oben unten links
       50 = IMAGE
       50.file = {$imagePath}cornermask_bl.gif
       50.align = l,b

       # Die Maske für die Ecke oben unten rechts
       60 = IMAGE
       60.file = {$imagePath}cornermask_br.gif
       60.align = r,b
     }

     # Die schnellste methode (empfohlen) ist ein statisches Bild wie 
folgt zu verwenden:
#    m.bgImg = {$imagePath}clear.gif

     # Aber es kann auch dynamisch erstellt werden:
     m.bgImg.import.cObject = IMG_RESOURCE
     m.bgImg.import.cObject.file = GIFBUILDER
     m.bgImg.import.cObject.file {
       # Hier wird die dynamische bgMask erstellt
       # Größe dieses Bildes ist unwichtig
       XY = [10.w],[10.h]
       format = png
       10 = BOX
       10.dimensions = 0,0,10,10
       10.color = {$bgColor}
     }
}




Schlagschatten:

tt_content.image.20.1.file >
tt_content.image.20.1.file = GIFBUILDER
tt_content.image.20.1.file {
	XY = [10.w]+20,[10.h]+20
	# The background color of the image/content
	backColor = #ffffff
	# Create a "dummy" image from the real image which is 20 pixel
	# smaller than the set width.
	10 = IMAGE
	10 {
		file.import.current = 1
		file.width.stdWrap = 1
		file.width.stdWrap.field = imagewidth
		file.width.stdWrap.wrap = |-20
		file.width.prioriCalc = intval
		offset = 10,10
	}
	# Draw a black/gray box over the dummy image
	20 = BOX
	20.dimensions = 10,10,[10.w],[10.h]
	# You have to set lib.shadowIntensity in your constants.
	20.color = {$lib.shadowIntensity}
	# Blur the black box
	30 = EFFECT
	30.value = blur=99 |
#	Blur again if required (wider blurred edge/shadow)
#	31 < .30
	# Put the image on top again at a slightly more left top position.
	50 < .10
	50.offset = 5,5
}

Hat jemand vielleicht einen Tip für mich?


Gruß

Peter


More information about the TYPO3-german mailing list