Bedeutung der Mode-Einstellungen für die Generierung von Vorschaubildern
11. Mai 2010
thumbnail vorschaubild modus mode default crop force embed
Dieser Artikel beschreibt, was die einzelnen Modus-Einstellungen zur Erstellung von Vorschaubildern (Thumbnails) bedeuten und bewirken.
Nachfolgend finden Sie Beispiele zur Nutzung der verschiedenen mode-Einstellungen für wsl:thumbnail und wThumbnail::createThumbnail, welche mit der jeweiligen Bedeutung anschaulich dargestellt werden.
- default
Das Bild wird so weit verkleinert, dass beide Seiten in die Vorgabe passen und der ggf. entstehende Leerraum abgeschnitten wird. So kann es sein, dass eine Seite kleiner als angegeben dargestellt wird. - crop
Das Bild wird so weit verkleinert, dass eine Seite in die Vorgabe passt und die ggf. überstehenden Seiten abgeschnitten werden. - force
Die Größe wird angepasst und das Bild ggf. verzerrt. - embed
Das Bild wird so weit verkleinert, dass beide Seiten in die Vorgabe passen und der ggf. entstehende Leerraum aufgefüllt wird. - embedTop
wie embed, mit Ausrichtung oben - embedRight
wie embed, mit Ausrichtung rechts - embedBottom
wie embed, mit Ausrichtung unten - embedLeft
wie embed, mit Ausrichtung links - embedTopLeft
wie embed, mit Ausrichtung oben links - embedTopRight
wie embed, mit Ausrichtung oben rechts - embedBottomLeft
wie embed, mit Ausrichtung unten links - embedBottomRight
wie embed, mit Ausrichtung unten rechts
Beispiel: Thumbnail-Erstellung mit Modus default
Quelltext
<?php
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'default');
$pathThumbnailhochkant = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest-hochkant.jpg', 120, 120, 'default');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>Originalbild quer</h2>';
print '<a href="/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg"><img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" /></a>';
print '<h2>Originalbild hochkant</h2>';
print '<a href="/devAssets/img/examples/CIMG1299-Thumbnailtest-hochkant.jpg"><img style="background-color:#f0f0f0" src="'.$pathThumbnailhochkant.'" /></a>';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'default');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>default</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'crop');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>crop</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'force');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>force</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'embed');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>embed</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'embedTop');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>embedTop</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest-hochkant.jpg', 120, 120, 'embedRight');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>embedRight</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest.jpg', 120, 120, 'embedBottom');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>embedBottom</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
$pathThumbnail = wThumbnail::createThumbnail('/devAssets/img/examples/CIMG1299-Thumbnailtest-hochkant.jpg', 120, 120, 'embedLeft');
print '<div style="margin:8px;padding:8px;border:1px solid #C0C0C0;background-color:#f9f9f9">';
print '<h2>embedLeft</h2>';
print '<img style="background-color:#f0f0f0" src="'.$pathThumbnail.'" />';
print '</div>';
?>
Ergebnis
Originalbild quer
Originalbild hochkant
default
crop
force
embed
embedTop
embedRight
embedBottom
embedLeft
