Migrado c Галерея изображений

Question

Фон

В настоящее время я использую Kendo-UI в качестве моей интерфейсной библиотеки и использую метод saveAs для создания отчетов на основе DOM, который рендерился, но столкнулся с некоторыми серьезными проблемами с производительностью (особенно в IE). Поэтому я решил, что буду обрабатывать генерацию PDF на стороне сервера, используя Migrado c.

Что я пытаюсь сделать

Сейчас у меня есть просмотр списка ( см. демонстрацию ), который по существу представляет галерею изображений. То, с чем я испытываю трудности, - это попытаться понять, как сделать изображение / текст go слева направо.

Что я сделал

Вот мой текущий код:

// Title
var title = section.AddParagraph("Photos");
title.Format.SpaceAfter = Unit.FromPoint(9);
title.Format.SpaceBefore = Unit.FromPoint(9);
title.Format.Font.Bold = true;
title.Format.Font.Color = new Color(33, 37, 41);
title.Format.Font.Name = "Segoe UI";
title.Format.Font.Size = Unit.FromPoint(11);
title.Format.Borders.Bottom = new Border()
{
    Color = new Color(222, 226, 230),
    Style = BorderStyle.Single
};

// listview
foreach (var photo in _photos)
{
    var photoDocument = _documentService.Get(photo.DocumentId);
    var textFrame = section.AddTextFrame();
    textFrame.AddImage("base64:" + Convert.ToBase64String(photoDocument.ThumbnailBinaryData));
    paragraph = textFrame.AddParagraph(photo.Filename);
    paragraph.Format.Alignment = ParagraphAlignment.Center;
    if (photo.CreatedOn != null)
    {
        var dateValue = (DateTimeOffset) photo.CreatedOn;
        paragraph.AddLineBreak();
        paragraph.AddText(dateValue.ToString("yyyy-MM-dd"));
    }
}

Проблема этого подхода заключается в том, что Migrado c размещает фотографии вертикально, а текст в основном друг над другом (см. Изображение ниже).

Вопрос

Как я могу сделать так, чтобы изображения go слева направо, пока не осталось ни одной комнаты, в этом случае он начинает перенос на следующую строку?

Обновление

Я могу выстроить фотографии в линию слева направо, но без текста, используя:

var paragraph = section.AddParagraph();
foreach (var photo in _photos)
{
    var photoDocument = _documentService.Get(photo.DocumentId);
    paragraph.AddImage("base64:" + Convert.ToBase64String(photoDocument.ThumbnailBinaryData));
}

Однако я до сих пор не понял, как установить текст под изображением, чтобы изображения отображались в одной строке.

Update # 2

Потратив долгое время на размышления об этом, в конечном итоге я создал таблицу и вычислил максимальное количество столбцов, которое можно уместить на странице, а затем динамически добавлять столбцы как I go. Я не уверен, что это правильное решение или нет, но оно работает для меня:

if (_photos.Any())
{
    var columnWidth = Unit.FromInch(1.75);
    var maximumColumns = (int)Math.Floor((11.5 - pageSetup.LeftMargin.Inch - pageSetup.RightMargin.Inch) / columnWidth.Inch); // 11.5 (page width) - 0.25 (left margin) - 0.25 (right margin) divided by columnWidth
    var table = section.AddTable();
    table.Style = "Table";
    if (maximumColumns > photos.Count())
    {
        columnWidth = Unit.FromInch(Math.Floor((11.5 - pageSetup.LeftMargin.Inch - pageSetup.RightMargin.Inch) / photos.Count()));
        maximumColumns = photos.Count();
    }

    Enumerable.Range(1, maximumColumns).ForEach(i => table.AddColumn(columnWidth));

    var row = table.AddRow();
    var columnIndex = 0;
    foreach (var photo in _photos)
    {
        if (columnIndex == maximumColumns - 1)
        {
            row = table.AddRow();
            columnIndex = 0;
        }
        else
        {
            columnIndex++;
        }

        var photoDocument = _documentService.Get(photo.DocumentId);
        var photoParagraph = row.Cells[columnIndex].AddParagraph();
        photoParagraph.AddImage("base64:" + Convert.ToBase64String(photoDocument.ThumbnailBinaryData));
        photoParagraph.AddLineBreak();
        photoParagraph.AddText(photo.Filename);
        photoParagraph.Format.Alignment = ParagraphAlignment.Center;
        if (photo.CreatedOn != null)
        {
            var dateValue = (DateTimeOffset)photo.CreatedOn;
            photoParagraph.AddLineBreak();
            photoParagraph.AddText(dateValue.ToString("yyyy-MM-dd"));
        }
    }
}