Zum Inhalt springen

Problem mit retina Images

Erstellt am 3. Mai 2015 · 2 Antworten · letzte Antwort am 4. Mai 2015

Tags: TYPO3 6.x, Frage

Niklas Lazinbee ·

Hallo,
bei der Anwendung von Bildern auf Retina-Displays stoße ich auf eine Problem, an dem ich schon länger herum rätsele.

Hier bietet ja die sourceCollection gute Möglichkeiten. Aber für folgendes Szenario scheitert das ganze meines Erachtens:

Bei den Konstanten steht: styles.content.imgtext.maxW = 600

Dann erstelle ich ein Bild im Backend gebe sagen wir 120px Breite ein, die Einstellung in der sourceCollection lautet

retina {	
	if {
		value = {$styles.content.imgtext.layoutKey}
		equals = default
		negate = 1
	}

	width = 600
	pixelDensity = 2

	srcsetCandidate = 600w 2x
	mediaQuery = (max-device-width: 600px) AND (min-resolution: 192dpi)
	dataKey = retina
}

Nun rechnet TYPO3 das Bild auf 1200px hoch, sinnvoll für eine gute Darstellung auf dem Retina-Display wäre doch 240px?

Wie kann ich TYPO3 dazu bewegen, die angegeben Bildgröße x2 zu nehmen und nicht die maximale Größe x2?

Beste Grüße
Niklas

Niklas Lazinbee ·

Beste Dank für den Tip. Das hatte ich zwar schon probiert aber in meiner speziellen Konfiguration hat es nicht das gewünschte Ergebnis gebracht. Aber das hat mich noch mal zum Nachdenken angeregt. Hier ist die spezielle Aufgabenstellung und die Lösung für alle die es interessiert:

Im Normalfall wäre das die Lösung

retina {
	
	if {
		value = {$styles.content.imgtext.layoutKey}
		equals = default
		negate = 1
	}
	
	maxW = 600
	
	pixelDensity = 2

	srcsetCandidate = 600w 2x
	mediaQuery = (max-device-width: 600px) AND (min-resolution: 192dpi)
	dataKey = retina
}

Ich hatte aber in Abhängigkeit von section_frame eine spezielle maxW definiert und zwar so:

tt_content.image.20.maxW.cObject = CASE
tt_content.image.20.maxW.cObject {
	key.field = section_frame

    default = TEXT  
	default.value = {$styles.content.imgtext.maxW}
	
    80 = TEXT
    80.value = 120
}

Diese Bilder hat TYPO3 dann auf 1200px hochgerechnet, da das System nicht mitbekommen hat, dass ich maxW umdefniert habe. Also teile ich das folgendermaßen mit:

tt_content.image.20.1.sourceCollection.retina.maxW.cObject = CASE
tt_content.image.20.1.sourceCollection.retina.maxW.cObject {
    key.field = section_frame

    default = TEXT  
    default.value = {$styles.content.imgtext.maxW}
	
    80 = TEXT
    80.value = 120
}

Und sie da, das Bild wird auf 240px berechnet.