I am having an issue when generating a PDF File with DInkToPDF where When I upload a jpeg image it is being rendered on the pdf in landscape mode. If I display the image in a image tag directly in my "Edit Form" it renders in the browser in portrait as it should be. This problem is only happening when generating a PDF file. If I navigate to the JPEG (stored on the file system) It opens in portrait. Below is the html code I use to display the pdf and the C# code I use to render the pdf.
I am not 100% sure if the problem is with DInkToPDF or with the way I am displaying or the way I am storing the file.
@model Report
@{
int SecoundPhoto = 0;
int PhotoCount = 0;
for (int count = 0; count < Model.ReportPhotos.Count(); count++)
{
SecoundPhoto = count + 1;
PhotoCount += 2;
<div class="row" style="padding-top:10px;">
<div class="col-xs-6" style="margin-bottom:10px;padding-left: 5px;padding-right: 5px;margin-top: 5px;">
<div class="card" style="width: auto; background-color: whitesmoke;">
<center><img style="margin-top: 20px;" class=" card-img-top" src="https://@Context.Request.Host/Files\@Model.ReportPhotos[count].FilePath" alt="@Model.ReportPhotos[count].Name" width="400" /></center>
<div class="card-body" style="padding:10px !important">
<div style="display: inline-block; min-height: 10px; width: 100%; font-size:16px;"><center>@Model.ReportPhotos[count].Description</center></div>
</div>
</div>
</div>
@if (SecoundPhoto < Model.ReportPhotos.Count())
{
<div class="col-xs-6" style="margin-bottom:10px;padding-left: 5px;padding-right: 5px;margin-top: 5px;">
<div class="card" style="width: auto; background-color: whitesmoke;">
<center><img style="margin-top: 20px;" class="card-img-top" src="https://@Context.Request.Host/Files\@Model.ReportPhotos[SecoundPhoto].FilePath" alt="@Model.ReportPhotos[SecoundPhoto].Name" width="400" /></center>
<div class="card-body" style="padding:10px !important">
<div style="display: inline-block; min-height: 10px; width: 100%; font-size:16px;"><center>@Model.ReportPhotos[SecoundPhoto].Description</center></div>
</div>
</div>
</div>
}
</div>
count = SecoundPhoto;
if (PhotoCount == 4)
{
// Break the Page After 4 photos
<div style='page-break-after: always;'></div>
PhotoCount = 0;
}
}
}
And this is the code I use to render the PDF with DinktoPDF
public async Task<ReturnFile> CreatePDF(Report report, Controller controller)
{
var pdfandViewName = GetPdfAndViewName(report);
var globalSettings = new GlobalSettings
{
ColorMode = ColorMode.Color,
Orientation = Orientation.Portrait,
PaperSize = PaperKind.A4,
//DPI = 320,
Margins = new MarginSettings { Top = 22, Left = 10, Right = 10, Bottom = 12 },
DocumentTitle = pdfandViewName.pdfName
};
var objectSettings = new ObjectSettings
{
PagesCount = true,
HtmlContent = await RenderView(controller, pdfandViewName.viewName.ToString(), report, true),
WebSettings = { DefaultEncoding = "utf-8" },
HeaderSettings = { Line = false, HtmUrl = "https://" + controller.HttpContext.Request.Host.Value + "/Report/_ReportHeader/" + report.Id, Right = "Page [page] of [toPage]", Spacing = 3.0 },
FooterSettings = { Line = false, HtmUrl = "https://" + controller.HttpContext.Request.Host.Value + "/Report/_ReportFooter", Spacing = 3.0 }
};
var pdf = new HtmlToPdfDocument()
{
GlobalSettings = globalSettings,
Objects = { objectSettings }
};
var fileBytes = _converter.Convert(pdf);
_repo.SaveChanges();
ReturnFile ReturnValue = new ReturnFile();
ReturnValue.FileName = pdfandViewName.pdfName;
ReturnValue.FileBytes = fileBytes;
return ReturnValue;
}
This is the code that is Handling the uploading of the image files
public async Task CreateReportPhotos(int Id, List<IFormFile> files, Report report)
{
// Set Photo Path Varible
string PhotoPath = GetPhotoUploadDirectory(report);
// Loop through Files that were uploaded
foreach (var formFile in files)
{
// Create a GUID for a FileName for the file to Make it Unique and to Prevent Overwriting of Files
var FileName = Guid.NewGuid().ToString() + "." + formFile.FileName.Split(".")[1];
// Check If File Exists
if (formFile.Length > 0)
{
// Create the File using system IO to the file stream
using (var stream = System.IO.File.Create(_config.GetValue<string>("ProjectsFolder:Path") + PhotoPath + FileName))
{
var maxWidth = 1000;
var image = Image.Load(formFile.OpenReadStream());
if (image.Width > maxWidth)
{
int verticalSize = (maxWidth * image.Height)/image.Width;
image.Mutate(x => x.Resize(maxWidth, verticalSize));
await image.SaveAsJpegAsync(stream);
}
else
{
// Copy/move file to Folder Directory
await formFile.CopyToAsync(stream);
}
}
// File has been Uploaded Lets add the reference to the Database for the report
ReportPhotos Photo = new ReportPhotos()
{
ReportId = Id,
Name = FileName,
FilePath = PhotoPath + FileName,
FileSize = Math.Round(Convert.ToDouble(formFile.Length / 1024) / 1024, 2).ToString(),
ContentType = formFile.ContentType,
Extension = "." + formFile.FileName.Split(".")[1],
DateCreated = DateTime.Now,
Description = ""
};
// Add Photo to the ReportPhotos Table
_repo.AddEntity(Photo);
}
}
// Save All the changes we have made
_repo.SaveChanges();
}
UPDATE: I found this github thread that seems to be what is happening with me View Thread
Unfortunately none of their solutions solved my problem.