Полное руководство по изменению размеров изображений в Битрикс: функция CFile::ResizeImageGet

Полное руководство по CFile::ResizeImageGet в 1С-Битрикс

Одной из наиболее востребованных задач при разработке сайтов на 1С-Битрикс является изменение размеров изображений. Правильная обработка графики важна и для дизайна, и для производительности. В этой статье подробно разберем встроенную функцию CFile::ResizeImageGet — от базового использования до продвинутых техник.

Для чего нужно изменять размер изображений?

Загрузка исходных изображений в высоком разрешении (например, 4000×3000 пикселей) и их прямое отображение в интерфейсе приводит к нескольким проблемам:

• Медленная загрузка страниц: Браузер скачивает тяжелые файлы, даже если они отображаются в маленьком блоке
• Нарушение дизайна: Изображения могут "выпадать" из сетки или иметь неоптимальное качество
• Лишний трафик: Пользователи мобильных устройств загружают ненужные мегабайты

Базовый синтаксис функции CFile::ResizeImageGet

Функция принимает четыре основных параметра:

CFile::ResizeImageGet(
    $file,               // ID файла или массив с данными о файле
    $size,               // Массив с требуемыми размерами
    $resizeType,         // Метод изменения размера
    $filters             // Дополнительные фильтры (необязательно)
);

Детальный разбор параметров

1. Параметр $file

Можно передать:

• ID файла из таблицы b_file: $arItem["DETAIL_PICTURE"]["ID"]
• Массив с данными файла: $arItem["DETAIL_PICTURE"]
• Путь к файлу на диске: array("src" => "/upload/image.jpg")

2. Параметр $size — массив размеров

Определяет конечные размеры изображения:

// Фиксированные размеры
array('width' => 600, 'height' => 400)

// Только по ширине (высота рассчитывается автоматически)
array('width' => 800)

// Только по высоте
array('height' => 600)

// Максимальные размеры (сохранение пропорций)
array('max_width' => 1200, 'max_height' => 800)

3. Параметр $resizeType — методы ресайза

Битрикс предоставляет несколько констант для разных сценариев:

Константа	Описание	Использование
BX_RESIZE_IMAGE_EXACT	Точное соответствие указанным размерам. Изображение обрезается, если пропорции не совпадают	Аватарки, фиксированные блоки в дизайне
BX_RESIZE_IMAGE_PROPORTIONAL	Сохранение пропорций. Изображение вписывается в указанные границы	Галереи, новости, товары (чаще всего)
BX_RESIZE_IMAGE_PROPORTIONAL_ALT	Пропорциональное изменение с заполнением всей области. Увеличивает изображение до максимальных размеров	Фоновые изображения, когда важна полная заполненность

4. Параметр $filters — дополнительные обработки

Массив дополнительных фильтров для применения к изображению:

$filters = array(
    "name" => "sharpen",
    "precision" => 15
);

Практические примеры использования

Пример 1: Базовое использование для детальной картинки

<?php
$PhotoResize = CFile::ResizeImageGet(
    $arItem["DETAIL_PICTURE"]["ID"],
    array('width' => 600, 'height' => 365),
    BX_RESIZE_IMAGE_EXACT,
    false
);
?>
<img src="<?= $PhotoResize['src'] ?>" width="<?= $PhotoResize['width'] ?>" height="<?= $PhotoResize['height'] ?>" alt="">

Пример 2: Пропорциональное изменение для списка товаров

<?php
$imageResized = CFile::ResizeImageGet(
    $arElement["PREVIEW_PICTURE"],
    array('width' => 300, 'height' => 200),
    BX_RESIZE_IMAGE_PROPORTIONAL,
    array()
);
?>
<img src="<?= $imageResized['src'] ?>" alt="<?= $arElement['NAME'] ?>">

Пример 3: Оптимизация для ретиновых экранов

<?php
$image1x = CFile::ResizeImageGet(
    $arItem["DETAIL_PICTURE"],
    array('width' => 800, 'height' => 600),
    BX_RESIZE_IMAGE_PROPORTIONAL,
    false
);
$image2x = CFile::ResizeImageGet(
    $arItem["DETAIL_PICTURE"],
    array('width' => 1600, 'height' => 1200),
    BX_RESIZE_IMAGE_PROPORTIONAL,
    false
);
?>
<img src="<?= $image1x['src'] ?>"
     srcset="<?= $image1x['src'] ?> 1x, <?= $image2x['src'] ?> 2x"
     alt="">

Важные особенности и ограничения

Кеширование ресайзов

Битрикс автоматически кеширует результаты ресайза. При повторном запросе того же размера для того же изображения будет использован уже созданный файл из папки /upload/resize_cache/.

Качество изображения

По умолчанию используется качество 95% (для JPEG). Его можно изменить через настройки в .settings.php:

'image' => array(
    'quality' => 85, // Качество JPEG от 0 до 100
)

Обработка ошибок

Всегда проверяйте результат перед выводом:

$resized = CFile::ResizeImageGet($fileId, $size, $resizeType);
if (is_array($resized) && isset($resized['src'])) {
    // Выводим изображение
} else {
    // Выводим заглушку или логируем ошибку
}

Альтернативные методы обработки изображений

• Компонент bitrix:system.field.edit/file — для форм редактирования
• Методы класса CFile::ResizeImage — для физического изменения исходного файла
• Внешние CDN-сервисы — для облачной обработки изображений на лету

Оптимизация производительности

При активной работе с изображениями важно:

1. Использовать асинхронную загрузку для изображений ниже первого экрана
2. Настроить сжатие на уровне веб-сервера (mod_pagespeed для Apache)
3. Регулярно очищать кеш ресайзов от неиспользуемых файлов
4. Использовать современные форматы (WebP) через конвертацию

Функция CFile::ResizeImageGet — мощный и гибкий инструмент в арсенале разработчика Битрикс. Правильное её использование не только улучшает визуальную часть сайта, но и значительно повышает скорость его работы и удобство для пользователей.