Skip to content

Commit 3b11a68

Browse files
didiyordanovadidiyordanova
authored
Merge pull request #1183 from telerik/didi/toolbar-updates
update toolbars
2 parents 48982e5 + ff9daf3 commit 3b11a68

File tree

4 files changed

+67
-6
lines changed

4 files changed

+67
-6
lines changed

‎controls/imageeditor/toolbar/styling.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ Each toolbar item has a `Style` property and the target type of the property is
3333

3434
| Toolbar Item | Style Target type |
3535
| ------------ | ------- |
36-
| `ImageEditorTransformationsToolbarItem` | `NavigationButtonToolbarItem` |
36+
| `ImageEditorTransformationsToolbarItem` | `NavigationButtonToolbarItemView` |
3737
| `ImageEditorFiltersToolbarItem` | `ImageEditorFilterOptionsToolbarItemView` |
3838
| `ImageEditorCropOptionsToolbarItem` | `ImageEditorCropOptionsToolbarItemView` |
3939
| `ImageEditorResizeOptionsToolbarItem` | `ImageEditorResizeOptionsToolbarItemView` |

‎controls/pdfviewer/toolbar/styling.md‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,29 @@ slug: pdfviewer-toolbar-styling
1010

1111
The <a href="https://www.telerik.com/maui-ui/pdf-viewer" target="_blank">.NET MAUI PDF Viewer</a> provides a flexible styling API for its toolbar items.
1212

13-
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.
13+
## Style the Toolbar Items
1414

15-
Here is an example:
15+
The `PDFViewerToolbar` is based on the `RadToolbar` control, so the toolbar items in the PDF Viewer use a `ToolbarItem`.
16+
17+
Each toolbar item has a `Style` property and the target type of the property is the corresponding `ToolbarItemView`:
18+
19+
| Toolbar Item | Style Target Type |
20+
| ------------ | ------- |
21+
| `PdfViewerFitToWidthToolbarItem ` | `ButtonToolbarItemView` |
22+
| `PdfViewerZoomInToolbarItem ` | `ButtonToolbarItemView` |
23+
| `PdfViewerZoomOutToolbarItem ` | `ButtonToolbarItemView` |
24+
| `PdfViewerSearchToolbarItem ` | `ButtonToolbarItemView` |
25+
| `PdfViewerToggleLayoutModeToolbarItem ` | `ButtonToolbarItemView` |
26+
| `PdfViewerNavigateToPreviousPageToolbarItem ` | `ButtonToolbarItemView` |
27+
| `PdfViewerNavigateToNextPageToolbarItem ` | `ButtonToolbarItemView` |
28+
| `PdfViewerNavigateToPageToolbarItem ` | `ToolbarItemView` |
29+
| `PdfViewerSearchNavigationToolbarItem ` | `NavigationButtonToolbarItemView` |
30+
31+
All styling properties available for the target type [`ButtonToolbarItemView`]({%slug toolbar-items-button%}) are also applicable for the PDF toolbar items that use this target type.
32+
33+
All properties applicable for [`NavigationButtonToolbarItemView`({%slug toolbar-items-navigation-button%}) can be used for stlying the `PdfViewerSearchNavigationToolbarItem`.
34+
35+
## Example for Styling the Toolbar
1636

1737
**1.** PDF Viewer and Toolbar definitions in XAML:
1838

‎controls/richtexteditor/styling/toolbar-styling.md‎

Lines changed: 43 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,51 @@ slug: richtexteditor-toolbar-styling
1010

1111
The [.NET MAUI RichTextEditor]({%slug richtexteditor-overview%}) provides a flexible styling API for its toolbar items.
1212

13-
The `RichTextEditorToolbar` is based on the `RadToolbar` control. All toolbar items in the RichTextEditor inherit from `ButtonToolbarItem`.
13+
## Style the Toolbar Items
1414

15-
All styling properties available for the `ButtonToolbarItem` are applicable for the rich text editor toolbar items.
15+
The `RichTextEditorToolbar` is based on the `RadToolbar` control, so the toolbar items in the RichTextEditor use a `ToolbarItem`.
1616

17-
Here is an example:
17+
Each toolbar item has a `Style` property and the target type of the property is the corresponding `ToolbarItemView`:
18+
19+
| Toolbar Item | Style Target Type |
20+
| ------------- | --------------- |
21+
| `RichTextEditorFontFamilyToolbarItem` | `RichTextEditorListPickerToolbarItemView` |
22+
| `RichTextEditorFontSizeToolbarItem` | `RichTextEditorListPickerToolbarItemView` |
23+
| `SeparatorToolbarItem` | `ToolbarItem` |
24+
| `RichTextEditorBoldToolbarItem` | `ToggleButtonToolbarItemView` |
25+
| `RichTextEditorItalicToolbarItem` | `ToggleButtonToolbarItemView` |
26+
| `RichTextEditorUnderlineToolbarItem` | `ToggleButtonToolbarItemView` |
27+
| `RichTextEditorAlignLeftToolbarItem` | `RadioButtonToolbarItemView` |
28+
| `RichTextEditorAlignCenterToolbarItem` | `RadioButtonToolbarItemView` |
29+
| `RichTextEditorAlignRightToolbarItem` | `RadioButtonToolbarItemView` |
30+
| `RichTextEditorAlignJustifyToolbarItem` | `RadioButtonToolbarItemView` |
31+
| `RichTextEditorTextColorToolbarItem` | `RichTextEditorColorPickerToolbarItemView` |
32+
| `RichTextEditorHighlightTextColorToolbarItem` | `RichTextEditorColorPickerToolbarItemView` |
33+
| `RichTextEditorBulletingToolbarItem` | `ToggleButtonToolbarItemView` |
34+
| `RichTextEditorNumberingToolbarItem` | `ToggleButtonToolbarItemView` |
35+
| `RichTextEditorOutdentToolbarItem` | `ButtonToolbarItemView` |
36+
| `RichTextEditorIndentToolbarItem` | `ButtonToolbarItemView` |
37+
| `RichTextEditorTextFormattingToolbarItem` | `RichTextEditorListPickerToolbarItemView` |
38+
| `RichTextEditorClearFormattingToolbarItem` | `ButtonToolbarItemView` |
39+
| `RichTextEditorStrikethroughToolbarItem` | `ToggleButtonToolbarItemView` |
40+
| `RichTextEditorSuperscriptToolbarItem` | `ToggleButtonToolbarItemView` |
41+
| `RichTextEditorSubscriptToolbarItem` | `ToggleButtonToolbarItemView` |
42+
| `RichTextEditorUndoToolbarItem` | `ButtonToolbarItemView` |
43+
| `RichTextEditorRedoToolbarItem` | `ButtonToolbarItemView` |
44+
| `RichTextEditorColorPickerToolbarItem` | `RichTextEditorColorPickerToolbarItemView` |
45+
| `RichTextEditorCopyToolbarItem` | `ButtonToolbarItemView` |
46+
| `RichTextEditorCutToolbarItem` | `ButtonToolbarItemView` |
47+
| `RichTextEditorPasteHtmlToolbarItem` | `ButtonToolbarItemView` |
48+
| `RichTextEditorAddOrEditHyperlinkToolbarItem` | `ButtonToolbarItemView` |
49+
| `RichTextEditorAddHyperlinkToolbarItem` | `ButtonToolbarItemView` |
50+
| `RichTextEditorRemoveHyperlinkToolbarItem` | `ButtonToolbarItemView` |
51+
| `RichTextEditorAddOrEditImageToolbarItem` | `ButtonToolbarItemView` |
52+
| `RichTextEditorHyperlinkNavigationToolbarItem` | `ButtonToolbarItemView` |
53+
| `RichTextEditorImageNavigationToolbarItem` | `ButtonToolbarItemView` |
54+
55+
All styling properties available for the target type [`ButtonToolbarItemView`]({%slug toolbar-items-button%}), [`ToggleButtonToolbarItemView`]({%slug toolbar-items-toggle-button%}), [`RadioButtonToolbarItemView`]({%slug toolbar-items-radio-button%}) are also applicable for the RichTextEditor toolbar items that use this target type.
56+
57+
## Example for Styling the Toolbar
1858

1959
**1.** RichTextEditor and Toolbar definitions in XAML:
2060

‎controls/richtexteditor/toolbar/overview.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ The table below shows all toolbar items available for both Desktop and Mobile:
6262
| `RichTextEditorColorPickerToolbarItem` | Allows picking a specific color from a collection of colors. |
6363
| `RichTextEditorCopyToolbarItem` | Copies the selected HTML to the clipboard. |
6464
| `RichTextEditorCutToolbarItem` | Cuts the selected HTML to the clipboard. |
65+
| `RichTextEditorPasteHtmlToolbarItem` | Pastes HTML from the clipboard. |
6566
| `RichTextEditorAddOrEditHyperlinkToolbarItem` | Opens a popup to add ot edit a hyperlink. |
6667
| `RichTextEditorAddHyperlinkToolbarItem` | Adds a hyperlink. |
6768
| `RichTextEditorRemoveHyperlinkToolbarItem` | Remove the hyperlink for the current selection. |

0 commit comments

Comments
 (0)