Реализация AI-редактирования изображений (Outpainting) в мобильном приложении

Реализация AI-редактирования изображений (Outpainting) в мобильном приложении

Outpainting — расширение изображения за его границы. Пользователь загружает фото 9:16, хочет получить 16:9 — модель дорисовывает боковые части, сохраняя стиль и контекст. Или хочет «отодвинуть камеру»: показать больше окружения вокруг объекта. DALL-E 2 поддерживает это нативно, Stable Diffusion — через тот же inpainting с расширенным холстом.

Логика на клиенте: подготовка холста

Суть outpainting: помести оригинальное изображение на больший холст (с прозрачными или нейтральными полями), передай в API как image + mask (где маска = новые пустые области), получи заполненный результат.

func prepareOutpaintingCanvas(
    original: UIImage,
    targetSize: CGSize,
    placement: CGPoint // где разместить оригинал на холсте
) -> (image: UIImage, mask: UIImage) {
    // Создаём холст нужного размера
    UIGraphicsBeginImageContextWithOptions(targetSize, false, 1.0)
    let context = UIGraphicsGetCurrentContext()!

    // Заливаем серым (нейтральный цвет для областей расширения)
    context.setFillColor(UIColor.gray.cgColor)
    context.fill(CGRect(origin: .zero, size: targetSize))

    // Вставляем оригинал
    original.draw(at: placement)
    let compositeImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()

    // Создаём маску: чёрные пиксели = сохранить, белые = дорисовать
    // Для DALL-E: альфа-канал вместо ч/б
    UIGraphicsBeginImageContextWithOptions(targetSize, false, 1.0)
    let maskContext = UIGraphicsGetCurrentContext()!

    // Белые (прозрачные для DALL-E) — новые области
    maskContext.setFillColor(UIColor.white.cgColor)
    maskContext.fill(CGRect(origin: .zero, size: targetSize))

    // Чёрные (непрозрачные) — оригинальное изображение
    maskContext.setFillColor(UIColor.black.cgColor)
    maskContext.fill(CGRect(origin: placement, size: original.size))
    let maskImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()

    return (compositeImage, maskImage)
}

Позиция оригинала на холсте определяет направление расширения:

• Центр холста → расширение со всех сторон
• Левый край → расширение только вправо
• Произвольно → пользователь управляет через drag

UI управления расширением

Паттерн взаимодействия:

1. Пользователь видит исходное изображение в «рамке» холста
2. Может перетаскивать изображение внутри рамки (или двигать рамку)
3. Выбирает итоговый aspect ratio: 16:9, 4:3, 1:1, или произвольный
4. Нажимает «Расширить»

// Android: draggable image inside canvas with GestureDetector
class OutpaintingView(context: Context) : View(context) {
    var imageOffsetX = 0f
    var imageOffsetY = 0f
    private val gestureDetector = GestureDetector(context, object : SimpleOnGestureListener() {
        override fun onScroll(e1: MotionEvent?, e2: MotionEvent, dx: Float, dy: Float): Boolean {
            imageOffsetX -= dx
            imageOffsetY -= dy
            // Ограничиваем смещение пределами холста
            imageOffsetX = imageOffsetX.coerceIn(-maxOffsetX, 0f)
            imageOffsetY = imageOffsetY.coerceIn(-maxOffsetY, 0f)
            invalidate()
            return true
        }
    })

    override fun onDraw(canvas: Canvas) {
        canvas.drawColor(Color.DKGRAY) // фон расширяемой области
        canvas.drawBitmap(originalBitmap, imageOffsetX, imageOffsetY, null)
    }
}

Отправка на DALL-E 2

// DALL-E 2: image и mask передаются как PNG с альфа-каналом
// В маске: прозрачность = редактировать, непрозрачность = сохранить

func outpaint(composite: UIImage, mask: UIImage, prompt: String, targetSize: String = "1024x1024") async throws -> UIImage {
    // Конвертируем маску: белые пиксели → прозрачные (альфа = 0)
    let alphaMask = convertToAlphaMask(mask)

    guard let compositeData = composite.pngData(),
          let maskData = alphaMask.pngData() else { throw OutpaintError.conversionFailed }

    // Запрос идентичен inpainting — тот же эндпоинт /v1/images/edits
    return try await sendInpaintRequest(imageData: compositeData, maskData: maskData, prompt: prompt, size: targetSize)
}

private func convertToAlphaMask(_ mask: UIImage) -> UIImage {
    UIGraphicsBeginImageContextWithOptions(mask.size, false, 1.0)
    guard let context = UIGraphicsGetCurrentContext() else { return mask }
    // Инвертируем: белое → прозрачное
    context.setBlendMode(.normal)
    mask.draw(in: CGRect(origin: .zero, size: mask.size))
    // Инверсия альфа-канала через CIImage
    UIGraphicsEndImageContext()
    // Используем Core Image для инверсии маски
    let ciImage = CIImage(image: mask)!
    let inverted = ciImage.applyingFilter("CIColorInvert")
    return UIImage(ciImage: inverted)
}

Ограничения размеров

DALL-E 2 принимает только квадратные изображения: 256×256, 512×512, 1024×1024. Для outpainting в 16:9 нужно промежуточное решение: генерируем в 1024×1024, затем кропаем до нужного ratio. Или делаем несколько итераций outpainting.

Stable Diffusion через Replicate/FAL принимает произвольные размеры (кратные 64), что удобнее для outpainting в нестандартных ratio.

Типичные проблемы

Видимый шов на границе оригинала и дорисованной части — случается когда оригинал помещён с резким краем на нейтральный фон. Решение: небольшой градиентный переход (feather) на краях маски — размываем маску на 10–20 пикселей.

Несоответствие стиля — модель дорисовала что-то совсем другого стиля. Промпт должен описывать всю сцену, не только новую часть: «солнечный городской пейзаж, фотореализм, тёплые тона» а не «продолжи».

Сроки

Базовый outpainting с DALL-E 2 (фиксированные направления расширения) — 5–7 дней. Интерактивный draggable холст с произвольным позиционированием, множественные итерации, история — 3–4 недели.