MAUI: iOS: Image alignment issue in pdfwebviewer

Question

MAUI: iOS: Image alignment issue in pdfwebviewer

Sreenivasan, Sreejith 1,020

I have a custom pdfwebviewer like below where I viewing both pdf and images.

<ctrl:PdfWebViewer Grid.Row="2" Uri="{Binding SelectedArticleUrl}"
                   HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"
                   AutomationProperties.IsInAccessibleTree="False"/>

My problem is with the image alignment and pdf works fine. It is currently vertically on start but I need it on the center. I tried updating the handler codes, but nothing works as expected. The issue is on the maui ios platform and android part working fine. I can share the handler code one to one since it is very lengthy.

Jack Dang (WICLOUD CORPORATION) 18,975 Reputation points Microsoft External Staff Moderator

2026-07-27T11:44:46.2966667+00:00

Hi @Sreenivasan, Sreejith ,

We are currently investigating the issue and will provide an update soon. Thank you for your patience.

Answer accepted by question author

Nancy Vo (WICLOUD CORPORATION) 8,075 Microsoft External Staff Moderator

Hello @Sreenivasan, Sreejith ,

Thanks for your question.

This behavior is often related to how iOS WKWebView renders a standalone image. When an image URL is loaded directly, iOS treats it as a raw image document without a real <body> element, so alignment changes applied through the handler or injected CSS may have no effect. This could be the reason your handler updates are not producing the expected result.

I recommend loading the image through a small HTML wrapper on iOS, rather than loading the image URL directly. The HTML provides a container that can be centered with CSS:

string imageHtml = $@"
<html>
  <head>
    <style>
      html, body {{ margin:0; padding:0; height:100%; }}
      body {{ display:flex; justify-content:center; align-items:center; }}
      img  {{ max-width:100%; max-height:100%; object-fit:contain; }}
    </style>
  </head>
  <body><img src='{imageUrl}' /></body>
</html>";

wkWebView.LoadHtmlString(new NSString(imageHtml), baseUrl: null);

The PDF loading path can be left unchanged, and this branch would only run when the URL points to an image.

I hope this addresses your question. If this response was helpful, please consider following the guidance to provide feedback. Thank you.

Sreenivasan, Sreejith 1,020 Reputation points

2026-07-28T08:07:52.8533333+00:00

@Nancy Vo (WICLOUD CORPORATION) I didn't get where should I add this code. So if I share my handler code one to one could you please redirect me?
Nancy Vo (WICLOUD CORPORATION) 8,075 Reputation points Microsoft External Staff Moderator

2026-07-28T08:32:16.11+00:00

Hi @Sreenivasan, Sreejith ,
Please feel free to share the relevant portion of your handler via private message. This may help us narrow down the problem.
Sreenivasan, Sreejith 1,020 Reputation points

2026-07-28T08:35:08.8333333+00:00

@Nancy Vo (WICLOUD CORPORATION) Please send a private message.
Bruce (SqlWork.com) 84,951 Reputation points

2026-07-30T16:51:17.29+00:00

in your custom PdfWebViewer you need to add logic to load an image via LoadHtmlString (as example) rather than setting the Uri to the image. the view code could look at the passed Uri to determine its an image vs pdf, or pass a content type.

alternatively, use the image control when an image rather than web viewer.

note: if this is in a scroll list, be sure to use a virtual scroll list as a large number of active webview controls can cause issues.

1 additional answer

Your answer

Jack Dang (WICLOUD CORPORATION) 18,975 Reputation points Microsoft External Staff Moderator

2026-07-27T11:44:46.2966667+00:00

Hi @Sreenivasan, Sreejith ,

We are currently investigating the issue and will provide an update soon. Thank you for your patience.
Sreenivasan, Sreejith 1,020 Reputation points

2026-07-28T08:07:52.8533333+00:00

@Nancy Vo (WICLOUD CORPORATION) I didn't get where should I add this code. So if I share my handler code one to one could you please redirect me?
Nancy Vo (WICLOUD CORPORATION) 8,075 Reputation points Microsoft External Staff Moderator

2026-07-28T08:32:16.11+00:00

Hi @Sreenivasan, Sreejith ,
Please feel free to share the relevant portion of your handler via private message. This may help us narrow down the problem.
Sreenivasan, Sreejith 1,020 Reputation points

2026-07-28T08:35:08.8333333+00:00

@Nancy Vo (WICLOUD CORPORATION) Please send a private message.
Bruce (SqlWork.com) 84,951 Reputation points

2026-07-30T16:51:17.29+00:00

in your custom PdfWebViewer you need to add logic to load an image via LoadHtmlString (as example) rather than setting the Uri to the image. the view code could look at the passed Uri to determine its an image vs pdf, or pass a content type.

alternatively, use the image control when an image rather than web viewer.

note: if this is in a scroll list, be sure to use a virtual scroll list as a large number of active webview controls can cause issues.

Answer 1

Bruce (SqlWork.com) 84,951

unlike android, IOS and IOS web view have a build-in pdf viewer. android typically uses a web view with a javascript library to view pdf's. using the IOS native pdf viewer (pdfkit) may give you the control you want.

0 comments