View in Blazor DocumentEditor component
8 Jul 20241 minute to read
Web Layout
Blazor Word Processor
component (a.k.a Document Editor) component allows you to change the view to web layout and print using the layoutType
property with the supported LayoutType
.
<SfDocumentEditorContainer @ref="editor" EnableToolbar="true" Height="590px" LayoutType="LayoutType.Continuous">
</SfDocumentEditorContainer>
NOTE
Default value of
LayoutType
in DocumentEditorContainer component isPages
.
Show Ruler
Using ruler we can refer to setting specific margins, tab stops, or indentations within a document to ensure consistent formatting in Document Editor Container.
The following example illustrates how to enable ruler in Document Editor Container.
<div>
<SfDocumentEditorContainer @ref="container" EnableToolbar=true Height="590px" DocumentEditorSettings="@settings">
</SfDocumentEditorContainer>
</div>
@code {
SfDocumentEditorContainer container;
public DocumentEditorSettingsModel settings = new DocumentEditorSettingsModel() { ShowRuler = true };
}
Heading Navigation Pane
Using the heading navigation pane allows users to swiftly navigate documents by heading, enhancing their ability to move through the document efficiently.
The following example demonstrates how to enable the heading navigation pane in a document editor.
<SfDocumentEditorContainer @ref="container" Height="590px" DocumentEditorSettings="settings">
</SfDocumentEditorContainer>
@code {
SfDocumentEditorContainer container;
DocumentEditorSettingsModel settings = new DocumentEditorSettingsModel() { ShowNavigationPane = true};
}