Рамка изображения

Picture Frame — это фигура, содержащая изображение, подобно картине в рамке.

Вы можете добавить изображение на слайд через Picture Frame. Таким способом вы форматируете изображение, форматируя саму рамку.

Совет

Aspose предоставляет бесплатные конвертеры — JPEG to PowerPoint и PNG to PowerPoint — позволяющие быстро создавать презентации из изображений.

Создание Picture Frame

Создайте экземпляр класса Presentation.
Получите ссылку на слайд по его индексу.
Создайте объект PPImage, добавив изображение в ImagesCollection, связанную с объектом презентации, которое будет использоваться для заполнения фигуры.
Укажите ширину и высоту изображения.
Создайте PictureFrame на основе ширины и высоты изображения с помощью метода addPictureFrame, доступного у объекта формы, связанного с выбранным слайдом.
Добавьте рамку (с изображением) на слайд.
Запишите изменённую презентацию в файл PPTX.

Этот JavaScript‑код показывает, как создать Picture Frame:

    // Создает экземпляр класса Presentation, представляющего файл PPTX
    var pres = new aspose.slides.Presentation();
    try {
        // Получает первый слайд
        var sld = pres.getSlides().get_Item(0);
        // Создает экземпляр класса Image
        var imgx = pres.getImages().addImage(java.newInstanceSync("java.io.FileInputStream", java.newInstanceSync("java.io.File", "asp1.jpg")));
        // Добавляет рамку изображения с эквивалентными высотой и шириной картинки
        sld.getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, 50, 150, imgx.getWidth(), imgx.getHeight(), imgx);
        // Записывает файл PPTX на диск
        pres.save("RectPicFrame.pptx", aspose.slides.SaveFormat.Pptx);
    } catch (e) {console.log(e);
    } finally {
        if (pres != null) {
            pres.dispose();
        }
    }

Picture Frames позволяют быстро создавать слайды на основе изображений. Комбинируя Picture Frame с параметрами сохранения Aspose.Slides, вы можете управлять операциями ввода/вывода для конвертации изображений между форматами. Полезные страницы: конвертация изображения в JPG; конвертация JPG в изображение; конвертация JPG в PNG, конвертация PNG в JPG; конвертация PNG в SVG, конвертация SVG в PNG.

Создание Picture Frame с относительным масштабом

Изменяя относительное масштабирование изображения, можно создать более сложный Picture Frame.

Создайте экземпляр класса Presentation.
Получите ссылку на слайд по его индексу.
Добавьте изображение в коллекцию изображений презентации.
Создайте объект PPImage, добавив изображение в ImagesCollection, связанную с объектом презентации, которое будет использоваться для заполнения фигуры.
Укажите относительные ширину и высоту изображения в рамке.
Запишите изменённую презентацию в файл PPTX.

Этот JavaScript‑код показывает, как создать Picture Frame с относительным масштабом:

// Создает экземпляр класса Presentation, представляющего PPTX
var pres = new aspose.slides.Presentation();
try {
    // Получает первый слайд
    var sld = pres.getSlides().get_Item(0);
    // Создает экземпляр класса Image
    var imgx = pres.getImages().addImage(java.newInstanceSync("java.io.FileInputStream", java.newInstanceSync("java.io.File", "asp1.jpg")));
    // Добавляет рамку изображения с высотой и шириной, равными картинке
    var pf = sld.getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, 50, 150, imgx.getWidth(), imgx.getHeight(), imgx);
    // Устанавливает относительные масштаб ширины и высоты
    pf.setRelativeScaleHeight(0.8);
    pf.setRelativeScaleWidth(1.35);
    // Сохраняет файл PPTX на диск
    pres.save("RectPicFrame.pptx", aspose.slides.SaveFormat.Pptx);
} catch (e) {console.log(e);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Извлечение растровых изображений из Picture Frames

Можно извлекать растровые изображения из объектов PictureFrame и сохранять их в PNG, JPG и другие форматы. Пример кода ниже демонстрирует, как извлечь изображение из документа «sample.pptx» и сохранить его в формате PNG.

var presentation = new aspose.slides.Presentation("sample.pptx");
try {
    var firstSlide = presentation.getSlides().get_Item(0);
    var firstShape = firstSlide.getShapes().get_Item(0);
    if (java.instanceOf(firstShape, "com.aspose.slides.IPictureFrame")) {
        var pictureFrame = firstShape;
        try {
            var slideImage = pictureFrame.getPictureFormat().getPicture().getImage().getImage();
            slideImage.save("slide_1_shape_1.png", aspose.slides.ImageFormat.Png);
        } finally {
            if (slideImage != null) {
                slideImage.dispose();
            }
        }
    }
} catch (e) {console.log(e);
} finally {
    presentation.dispose();
}

Извлечение SVG‑изображений из Picture Frames

Когда презентация содержит векторную графику SVG, помещённую в формы PictureFrame, Aspose.Slides for Node.js via Java позволяет получить оригинальные векторные изображения с полной точностью. Проходя по коллекции фигур слайда, можно определить каждый PictureFrame, проверить, содержит ли связанный PPImage SVG‑контент, и затем сохранить изображение в нативном формате SVG.

Следующий пример кода демонстрирует извлечение SVG‑изображения из рамки:

var presentation = new aspose.slides.Presentation("sample.pptx");

try {
    var slide = presentation.getSlides().get_Item(0);
    var shape = slide.getShapes().get_Item(0);

    if (java.instanceOf(shape, "com.aspose.slides.IPictureFrame")) {
        const svgImage = shape.getPictureFormat().getPicture().getImage().getSvgImage();

        if (svgImage) {
            fs.writeFileSync("output.svg", svgImage.getSvgData());
        }
    }
} catch (e) {
    console.log(e);
} finally {
    presentation.dispose();
}

Получение прозрачности изображения

Aspose.Slides позволяет получить эффект прозрачности, применённый к изображению. Этот JavaScript‑код демонстрирует операцию:

var presentation = new aspose.slides.Presentation("Test.pptx");
var pictureFrame = presentation.getSlides().get_Item(0).getShapes().get_Item(0);
var imageTransform = pictureFrame.getPictureFormat().getPicture().getImageTransform();
for (var i = 0; i < imageTransform.size(); i++) {
    var effect = imageTransform.get_Item(i);
    if (java.instanceOf(effect, "com.aspose.slides.IAlphaModulateFixed")) {
        var alphaModulateFixed = effect;
        var transparencyValue = 100 - alphaModulateFixed.getAmount();
        console.log("Picture transparency: " + transparencyValue);
    }
}

Форматирование Picture Frame

Aspose.Slides предоставляет множество параметров форматирования, которые можно применить к Picture Frame. С их помощью вы можете изменить рамку так, чтобы она отвечала конкретным требованиям.

Создайте экземпляр класса Presentation.
Получите ссылку на слайд по его индексу.
Создайте объект PPImage, добавив изображение в ImagesCollection, связанную с объектом презентации, которое будет использоваться для заполнения формы.
Укажите ширину и высоту изображения.
Создайте PictureFrame на основе ширины и высоты изображения через метод addPictureFrame объекта Shapes, связанного с выбранным слайдом.
Добавьте Picture Frame (с изображением) на слайд.
Установите цвет линии рамки.
Установите ширину линии рамки.
Поверните рамку, задав положительное или отрицательное значение.
- Положительное значение вращает изображение по часовой стрелке.
- Отрицательное значение вращает изображение против часовой стрелки.
Добавьте Picture Frame (с изображением) на слайд.
Запишите изменённую презентацию в файл PPTX.

Этот JavaScript‑код демонстрирует процесс форматирования Picture Frame:

// Создаёт экземпляр класса Presentation, представляющего PPTX
var pres = new aspose.slides.Presentation();
try {
    // Получает первый слайд
    var sld = pres.getSlides().get_Item(0);
    // Создаёт экземпляр класса Image
    var imgx = pres.getImages().addImage(java.newInstanceSync("java.io.FileInputStream", java.newInstanceSync("java.io.File", "asp1.jpg")));
    // Добавляет рамку изображения с высотой и шириной, равными изображению
    var pf = sld.getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, 50, 150, imgx.getWidth(), imgx.getHeight(), imgx);
    // Применяет некоторое форматирование к PictureFrameEx
    pf.getLineFormat().getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Solid));
    pf.getLineFormat().getFillFormat().getSolidFillColor().setColor(java.getStaticFieldValue("java.awt.Color", "BLUE"));
    pf.getLineFormat().setWidth(20);
    pf.setRotation(45);
    // Записывает файл PPTX на диск
    pres.save("RectPicFrame.pptx", aspose.slides.SaveFormat.Pptx);
} catch (e) {console.log(e);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Совет

Aspose недавно разработал бесплатный Collage Maker. Если вам нужно объединить JPG/JPEG или PNG‑изображения, создать сетку из фото, используйте этот сервис.

Добавление изображения в виде ссылки

Чтобы уменьшить размер презентации, вместо внедрения файлов можно добавлять изображения (или видео) через ссылки. Этот JavaScript‑код показывает, как добавить изображение и видео в заполнитель:

var presentation = new aspose.slides.Presentation("input.pptx");
try {
    var shapesToRemove = java.newInstanceSync("java.util.ArrayList");
    var shapesCount = presentation.getSlides().get_Item(0).getShapes().size();
    for (var i = 0; i < shapesCount; i++) {
        var autoShape = presentation.getSlides().get_Item(0).getShapes().get_Item(i);
        if (autoShape.getPlaceholder() == null) {
            continue;
        }
        switch (autoShape.getPlaceholder().getType()) {
            case aspose.slides.PlaceholderType.Picture :
                var pictureFrame = presentation.getSlides().get_Item(0).getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, autoShape.getX(), autoShape.getY(), autoShape.getWidth(), autoShape.getHeight(), null);
                pictureFrame.getPictureFormat().getPicture().setLinkPathLong("https://upload.wikimedia.org/wikipedia/commons/3/3a/I.M_at_Old_School_Public_Broadcasting_in_October_2016_02.jpg");
                shapesToRemove.add(autoShape);
                break;
            case aspose.slides.PlaceholderType.Media :
                var videoFrame = presentation.getSlides().get_Item(0).getShapes().addVideoFrame(autoShape.getX(), autoShape.getY(), autoShape.getWidth(), autoShape.getHeight(), "");
                videoFrame.getPictureFormat().getPicture().setLinkPathLong("https://upload.wikimedia.org/wikipedia/commons/3/3a/I.M_at_Old_School_Public_Broadcasting_in_October_2016_02.jpg");
                videoFrame.setLinkPathLong("https://youtu.be/t_1LYZ102RA");
                shapesToRemove.add(autoShape);
                break;
        }
    }
    for (var i = 0; i < shapesToRemove.length; i++) {
        var shape = shapesToRemove.get_Item(i);
        presentation.getSlides().get_Item(0).getShapes().remove(shape);
    }
    presentation.save("output.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (presentation != null) {
        presentation.dispose();
    }
}

Обрезка изображения

Этот JavaScript‑код показывает, как обрезать существующее изображение на слайде:

var pres = new aspose.slides.Presentation();
// Создаёт новый объект изображения
try {
    var picture;
    var image = aspose.slides.Images.fromFile(imagePath);
    try {
        picture = pres.getImages().addImage(image);
    } finally {
        if (image != null) {
            image.dispose();
        }
    }
    // Добавляет PictureFrame на слайд
    var picFrame = pres.getSlides().get_Item(0).getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, 100, 100, 420, 250, picture);
    // Обрезает изображение (значения в процентах)
    picFrame.getPictureFormat().setCropLeft(23.6);
    picFrame.getPictureFormat().setCropRight(21.5);
    picFrame.getPictureFormat().setCropTop(3);
    picFrame.getPictureFormat().setCropBottom(31);
    // Сохраняет результат
    pres.save(outPptxFile, aspose.slides.SaveFormat.Pptx);
} catch (e) {console.log(e);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

Удаление обрезанных областей из рамки

Если нужно удалить обрезанные области изображения, содержащегося в рамке, используйте метод deletePictureCroppedAreas(). Метод возвращает обрезанное изображение или оригинал, если обрезка не требуется.

Этот JavaScript‑код демонстрирует операцию:

var presentation = new aspose.slides.Presentation("PictureFrameCrop.pptx");
try {
    var slide = presentation.getSlides().get_Item(0);
    // Получает PictureFrame с первого слайда
    var picFrame = slide.getShapes().get_Item(0);
    // Удаляет обрезанные области изображения PictureFrame и возвращает обрезанное изображение
    var croppedImage = picFrame.getPictureFormat().deletePictureCroppedAreas();
    // Сохраняет результат
    presentation.save("PictureFrameDeleteCroppedAreas.pptx", aspose.slides.SaveFormat.Pptx);
} finally {
    if (presentation != null) {
        presentation.dispose();
    }
}

ПРИМЕЧАНИЕ

Метод deletePictureCroppedAreas() добавляет обрезанное изображение в коллекцию изображений презентации. Если изображение используется только в обработанном PictureFrame, это может сократить размер презентации. В противном случае количество изображений в полученной презентации увеличится.

Метод конвертирует метафайлы WMF/EMF в растровое PNG‑изображение во время операции обрезки.

Блокировка соотношения сторон

Чтобы форма, содержащая изображение, сохраняла соотношение сторон при изменении размеров изображения, используйте метод setAspectRatioLocked, задающий параметр Lock Aspect Ratio.

Этот JavaScript‑код показывает, как заблокировать соотношение сторон формы:

var pres = new aspose.slides.Presentation("pres.pptx");
try {
    var layout = pres.getLayoutSlides().getByType(aspose.slides.SlideLayoutType.Custom);
    var emptySlide = pres.getSlides().addEmptySlide(layout);
    var picture;
    var image = aspose.slides.Images.fromFile("image.png");
    try {
        picture = pres.getImages().addImage(image);
    } finally {
        if (image != null) {
            image.dispose();
        }
    }
    var pictureFrame = emptySlide.getShapes().addPictureFrame(aspose.slides.ShapeType.Rectangle, 50, 150, presImage.getWidth(), presImage.getHeight(), picture);
    // установить форму, чтобы сохранять соотношение сторон при изменении размеров
    pictureFrame.getPictureFrameLock().setAspectRatioLocked(true);
} catch (e) {console.log(e);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

ПРИМЕЧАНИЕ

Параметр Lock Aspect Ratio сохраняет только соотношение сторон формы, но не изображения, которое она содержит.

Использование свойства StretchOff

С помощью методов setStretchOffsetLeft, setStretchOffsetTop, setStretchOffsetRight и setStretchOffsetBottom класса PictureFillFormat можно задать прямоугольник заполнения.

При указании растягивания для изображения исходный прямоугольник масштабируется, чтобы вписаться в заданный прямоугольник заполнения. Каждая грань прямоугольника заполнения задаётся процентным смещением от соответствующей грани ограничивающего прямоугольника формы. Положительный процент задаёт врезку, отрицательный — выступ.

Создайте экземпляр класса Presentation.
Получите ссылку на слайд по его индексу.
Добавьте прямоугольник AutoShape.
Создайте изображение.
Задайте тип заполнения формы.
Установите режим заполнения формы изображением.
Добавьте изображение для заполнения формы.
Укажите смещения изображения от соответствующей грани ограничивающего прямоугольника формы.
Запишите изменённую презентацию в файл PPTX.

Этот JavaScript‑код демонстрирует процесс применения свойства StretchOff:

// Создаёт экземпляр класса Presentation, представляющего файл PPTX
var pres = new aspose.slides.Presentation();
try {
    // Получает первый слайд
    var slide = pres.getSlides().get_Item(0);
    // Создаёт экземпляр класса ImageEx
    var picture;
    var image = aspose.slides.Images.fromFile("aspose-logo.jpg");
    try {
        picture = pres.getImages().addImage(image);
    } finally {
        if (image != null) {
            image.dispose();
        }
    }
    // Добавляет AutoShape типа Rectangle
    var aShape = slide.getShapes().addAutoShape(aspose.slides.ShapeType.Rectangle, 100, 100, 300, 300);
    // Устанавливает тип заливки формы
    aShape.getFillFormat().setFillType(java.newByte(aspose.slides.FillType.Picture));
    // Устанавливает режим заливки формы изображением
    aShape.getFillFormat().getPictureFillFormat().setPictureFillMode(aspose.slides.PictureFillMode.Stretch);
    // Устанавливает изображение для заливки формы
    aShape.getFillFormat().getPictureFillFormat().getPicture().setImage(picture);
    // Указывает смещения изображения от соответствующей грани ограничивающего прямоугольника формы
    aShape.getFillFormat().getPictureFillFormat().setStretchOffsetLeft(25);
    aShape.getFillFormat().getPictureFillFormat().setStretchOffsetRight(25);
    aShape.getFillFormat().getPictureFillFormat().setStretchOffsetTop(-20);
    aShape.getFillFormat().getPictureFillFormat().setStretchOffsetBottom(-10);
    // Записывает файл PPTX на диск
    pres.save("StretchOffsetLeftForPictureFrame_out.pptx", aspose.slides.SaveFormat.Pptx);
} catch (e) {console.log(e);
} finally {
    if (pres != null) {
        pres.dispose();
    }
}

FAQ

Как узнать, какие форматы изображений поддерживаются для Picture Frame?

Aspose.Slides поддерживает как растровые изображения (PNG, JPEG, BMP, GIF и др.), так и векторные (например, SVG) через объект изображения, назначенный PictureFrame. Список поддерживаемых форматов в целом совпадает с возможностями движка конвертации слайдов и изображений.

Как добавление десятков крупных изображений влияет на размер и производительность PPTX?

Встраивание больших изображений увеличивает размер файла и потребление памяти; привязка изображений через ссылки помогает уменьшить размер презентации, но требует постоянной доступности внешних файлов. Aspose.Slides позволяет добавлять изображения по ссылке, чтобы сократить размер файла.

Как заблокировать объект изображения от случайного перемещения/изменения размера?

Используйте блокировки форм для PictureFrame (например, отключить перемещение или изменение размера). Механизм блокировки описан в отдельной статье о защите и поддерживается для различных типов форм, включая PictureFrame.

Сохраняется ли точность векторного SVG при экспорте презентации в PDF/изображения?

Aspose.Slides позволяет извлекать SVG из PictureFrame как оригинальный вектор. При экспорте в PDF или в растровые форматы результат может быть растеризован в зависимости от настроек экспорта; факт того, что оригинальный SVG хранится как вектор, подтверждается поведением извлечения.

Просмотрщик презентаций