.NET MAUI PDF Viewer Search Styling
The PDF Viewer for .NET MAUI provides a flexible styling API for its search toolbar items.
As the PDFViewerToolbar
is based on the RadToolbar
control, all toolbar items in the PDF Viewer inherit from ButtonToolbarItem
. All styling properties available for the ButtonToolbarItem
are also applicable for the PDF toolbar items.
The table below lists all toolbar items related to the search feature and their target type:
Toolbar Item | Target Type |
---|---|
PdfViewerSearchNavigationToolbarItem |
Style property with target type NavigationButtonToolbarItemView
|
PdfViewerNavigateToPreviousSearchResultToolbarItem |
Style property with target type PdfViewerNavigateToPreviousSearchResultToolbarItemView
|
PdfViewerNavigateToNextSearchResultToolbarItem |
Style property with target type PdfViewerNavigateToNextSearchResultToolbarItemView
|
PdfViewerSearchEntryToolbarItem |
Style property with target type PdfViewerSearchEntryToolbarItemView
|
PdfViewerSearchBusyIndicatorToolbarItem |
Style property with target type PdfViewerSearchBusyIndicatorToolbarItemView
|
The PdfViewerSearchBusyIndicatorToolbarItemView
inherits from the BusyIndicatorToolbarItemView.
The PdfViewerSearchEntryToolbarItemView
inherits from the EntryToolbarItemView.
The PdfViewerNavigateToPreviousSearchResultToolbarItemView
, PdfViewerNavigateToNextSearchResultToolbarItemView
, and NavigationButtonToolbarItemView
inherit from ButtonToolbarItemView.
Styling the Search Toast Message on Mobile
The PdfViewerSearchNavigationToolbarItem
has a ToastStyle
property which allows you to style the toast message with search results on mobile. The target type of the ToastStyle
is the PdfViewerSearchToast
.
Here is an example how to define the ToastStyle
<Style x:Key="ToastStyle" TargetType="telerik:PdfViewerSearchToast">
<Setter Property="Fill" Value="#FF7F7F" />
<Setter Property="TextColor" Value="White" />
</Style>
And the PdfViewerSearchNavigationToolbarItem
:
<telerik:PdfViewerSearchNavigationToolbarItem ToastStyle="{StaticResource ToastStyle}" IsVisible="{OnIdiom Phone=True, Desktop=False}" />
Styling the Search Settings
The search results are highlighted by using the following properties:
-
MainSearchResultFill
(Color
)—Specifies the fill of the main search result. -
SearchResultsFill
(Color
)—Specifies the fill of all search results, except the main result.
Here is an example with styling the MainSearchResultFill
and SearchResultsFill
:
<telerik:RadPdfViewer x:Name="pdfViewer">
<telerik:RadPdfViewer.SearchSettings>
<telerik:PdfViewerSearchSettings MainSearchResultFill="#99FF7F7F"
SearchResultsFill="#997FC9FF"/>
</telerik:RadPdfViewer.SearchSettings>
</telerik:RadPdfViewer>