Цитата |
---|
Александр Шарапов написал: И в инфоблоке когда включаешь уменьшить картинку если боьшая она тоже с таким же округлением: иногда то по высоте, то по ширине пиксел потеряет. |
Вы про автоматическое создание PREVIEW_PICTURE из DETAIL_PICTURE?
Я для себя пришёл к следующему решению.
1) В элементе храним только одну картинку достаточно большого размера. Почему только одну? Ну, например, на одном из проектов для показа лент новостей у меня используются такие размеры картинок: 240x180, 100x75, 370x278, 500x330 -- и это после редизайна, а до редизайна размеры были другими. По-моему, лучше генерить любые такие картинки по месту из той самой одной-единственной.
(Кстати, забавно, но лучше всего хранить эту картинку в поле PREVIEW_PICTURE, чтобы не возиться с bitrix:rss.out, который умеет брать картинки только
из этого поля).
2) Масштабируем картинки в result_modifier.php шаблона компонента с помощью такой функции:
Код |
---|
// ресайзит картинку (массив $arPic как после CFile::GetFileArray() или ID файла)
// если не указана высота, ресайзит только по ширине
function myResizePic($arPic, $width, $height = 0)
{
if (!is_array($arPic) && intval($arPic))
$arPic = CFile::GetFileArray($arPic);
$arPic['WIDTH'] = intval($arPic['WIDTH']);
$arPic['HEIGHT'] = intval($arPic['HEIGHT']);
if ($arPic['WIDTH'] <= 0 || $arPic['HEIGHT'] <= 0)
return false;
$ratioX = $width / $arPic['WIDTH'];
$ratioY = $height / $arPic['HEIGHT'];
if ($ratioX >=1 && $ratioY >= 1)
{
$out = array(
'src' => $arPic['SRC'],
'width' => $arPic['WIDTH'],
'height' => $arPic['HEIGHT'],
);
}
else
{
$ratio = max($ratioX, $ratioY);
$out = CFile::ResizeImageGet(
$arPic,
array(
'width' => round($ratio * $arPic['WIDTH']),
'height' => round($ratio * $arPic['HEIGHT']),
),
BX_RESIZE_IMAGE_EXACT,
true
);
}
return $out;
}
|
Как это работает.
В большинстве случаев важна только ширина картинки. Например, на детальной странице новости или в одноколоночной ленте новостей. В этом случае задаём только ширину, а высота будет задана исходным соотношением сторон:
Код |
---|
$smth['pic'] = myResizePic($smth['PREVIEW_PICTURE'], 200);
|
Иногда важны и ширина, и высота. Например, в так называемой шахматке, когда у вас вёрстка в несколько колонок, и картинки должны быть одинаковыми. В этом случае задаём и ширину, и высоту:
Код |
---|
$smth['pic'] = myResizePic($smth['PREVIEW_PICTURE'], 200, 150); |
Получим картинку, ширина которой не меньше 200px, а высота не меньше 150px. Поскольку соотношение сторон редко бывает идеальным, придётся обрезать какую-то часть картинки при показе. Ну, скажем, так:
Код |
---|
<a href="..." clas="pic"><img src="....."></a>
|
Код |
---|
a.pic {
display:block;
width:200px;
height:150px;
overflow:hidden;
}
|