Unplanned
Last Updated: 07 Mar 2024 13:11 by David
Nicolas
Created on: 20 Dec 2022 07:16
Category: PDFViewer
Type: Feature Request
23
Add the ability to change the default zoom level
I would like to be able to control the default zoom level in the PDF viewer. For example, I would like to be able to set it as "Fit to Page". 
3 comments
David
Posted on: 07 Mar 2024 13:11

I created the following using reflection to allow you to change the zoom to "Fit to width" at any time, but you can also do "Fit to page" as well.

private async Task ZoomPdf()
{
if (_pdfViewerRef == null) return;

var type = _pdfViewerRef.GetType();

var parameterTypes = new[] { typeof(PdfViewerZoomLevelDescriptor) };

var dynMethod = type.GetMethod("ZoomAsync", BindingFlags.NonPublic | BindingFlags.Instance, parameterTypes);

await (dynMethod?.Invoke(_pdfViewerRef, new object[] { GetZoomLevelDescriptor(_pdfViewerRef, type, "Fit to width") }) as Task ?? Task.CompletedTask);
}

private static PdfViewerZoomLevelDescriptor GetZoomLevelDescriptor(object? instance, IReflect type, string valueToFind)
{
// Use reflection to get the ZoomLevels property
var zoomLevelsProperty = type.GetProperty("ZoomLevels", BindingFlags.NonPublic | BindingFlags.Instance);

if (zoomLevelsProperty == null)
{
throw new InvalidOperationException("ZoomLevels property not found.");
}

// Get the value of the ZoomLevels property
var zoomLevelsValue = zoomLevelsProperty.GetValue(instance);

// Ensure the value is of the correct type (List<PdfViewerZoomLevelDescriptor>)
if (zoomLevelsValue is List<PdfViewerZoomLevelDescriptor> zoomLevels)
{
// Search for the descriptor with the specified value
var descriptor = zoomLevels.FirstOrDefault(z => z.Value == valueToFind);

return descriptor;
}

throw new InvalidOperationException("ZoomLevels property is not of the expected type.");
}

ADMIN
Dimo
Posted on: 23 Nov 2023 08:56

Hello Marc,

Thanks for your contribution. Indeed, a JavaScript workaround is possible. Here is a complete example for the Blazor PdfViewer.

Regards,
Dimo
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources!
Marc
Posted on: 23 Nov 2023 04:26

A workaround for 'Fit to Width' can be accomplished by adding this JavaScript, but a regular setting would be better...

function setZoomOption(zoomOption) {
var combo = $(".k-combobox-clearable").find("input").last().getKendoComboBox();

if (combo) {
console.log("SetZoomOption: Zoomcombo found");

combo.select(zoomOption);
combo.trigger("change");
}
else {
console.log("SetZoomOption: Zoomcombo not found");
}
}

And call it from HTML:
 <input type="button" value="Set ZoomOption" onclick="setZoomOption(2)" />

Or from Blazor:

    private async Task SetZoomFullWidth()
    {
        // Set scale does not work / is not available
        // await JsRuntime!.InvokeVoidAsync("setScale",PdfZoom);
        await JsRuntime!.InvokeVoidAsync("setZoomOption", 2);
    }