You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: Document-Processing/PDF/PDF-Viewer/asp-net-core/accessibility.md
+66-68Lines changed: 66 additions & 68 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -7,23 +7,23 @@ control: PDF Viewer
7
7
publishingplatform: ASP.NET Core
8
8
documentation: ug
9
9
---
10
-
# Accessibility in Syncfusion<supstyle="font-size:70%">®</sup> PDF Viewer components
10
+
# Accessibility in SyncfusionPDF Viewer component
11
11
12
-
The PDF Viewer component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles)that are commonly used to evaluate accessibility.
12
+
The PDF Viewer component adheres to accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), and [WCAG 2.2](https://www.w3.org/TR/WCAG22/). It also integrates [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) commonly used for accessibility evaluation.
13
13
14
-
The accessibility compliance for the PDF Viewer component is outlined below.
14
+
Below is an outline of the accessibility compliance for the PDF Viewer component:
@@ -39,71 +39,70 @@ The accessibility compliance for the PDF Viewer component is outlined below.
39
39
40
40
## WAI-ARIA attributes
41
41
42
-
[WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/alert/) (Accessibility Initiative – Accessible Rich Internet Applications) defines a way to increase the accessibility of web pages, dynamic content, and user interface components developed with Ajax, HTML, JavaScript,and related technologies. ARIA provides additional semantics to describe the role, state, and functionality of web components. The following ARIA attributes are used in the PDF Viewer component:
42
+
[WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/patterns/alert/) (Web Accessibility Initiative – Accessible Rich Internet Applications) defines a way to make web content and web applications more accessible. It provides additional semantics to describe the role, state, and functionality of web components. The following ARIA attributes are used in the PDF Viewer component:
43
43
44
44
| Attributes | Purpose |
45
45
| --- | --- |
46
-
|`aria-disabled`| Indicates whether the PDF Viewer component is in a disabled state or not.|
47
-
|`aria-expanded`| Indicates whether the suggestion list has expanded or not. |
48
-
|`aria-readonly`| Indicates the readonly state of the PDF Viewer element. |
49
-
|`aria-haspopup`| Indicates whether the PDF Viewer input element has a suggestion list or not. |
50
-
|`aria-label`|Indicates the breadcrumb item text. |
51
-
|`aria-labelledby`| Provides a label for the PDF Viewer. Typically, the "aria-labelledby" attribute will contain the id of the element used as the PDF Viewer's title. |
52
-
|`aria-describedby`| This attribute points to the PDF Viewer element describing the one it's set on. |
46
+
|`aria-disabled`| Indicates whether the PDF Viewer component is in a disabled state. |
47
+
|`aria-expanded`| Indicates whether the suggestion list has expanded. |
48
+
|`aria-readonly`| Indicates the read-only state of the PDF Viewer element. |
49
+
|`aria-haspopup`| Indicates whether the PDF Viewer input element has a suggestion list. |
50
+
|`aria-label`|Provides a label for the breadcrumb item. |
51
+
|`aria-labelledby`| Provides a label for the PDF Viewer, typically pointing to the ID of the element used as the viewer's title. |
52
+
|`aria-describedby`| This attribute points to an element describing the PDF Viewer component. |
53
53
|`aria-orientation`| Indicates whether the PDF Viewer element is oriented horizontally or vertically. |
54
-
|`aria-valuetext`| Returns the current text of the PDF Viewer. |
55
-
|`aria-valuemax`| Indicates the Maximum value of the PDF Viewer. |
56
-
|`aria-valuemin`| Indicates the Minimum value of the PDF Viewer. |
54
+
|`aria-valuetext`| Returns the current text value of the PDF Viewer. |
55
+
|`aria-valuemax`| Indicates the maximum value of the PDF Viewer. |
56
+
|`aria-valuemin`| Indicates the minimum value of the PDF Viewer. |
57
57
|`aria-valuenow`| Indicates the current value of the PDF Viewer. |
58
-
|`aria-controls`| Attribute is set to the button and it points to the corresponding content. |
58
+
|`aria-controls`| Attribute set on a button, pointing to its corresponding content. |
59
59
60
60
## Keyboard interaction
61
61
62
-
The PDF Viewer component followed the [keyboard interaction](https://www.w3.org/WAI/ARIA/apg/patterns/alert/#keyboardinteraction)guideline, making it easy for people who use assistive technologies (AT) and those who completely rely on keyboard navigation. The following keyboard shortcuts are supported by the Message component.
62
+
The PDF Viewer component follows the [keyboard interaction](https://www.w3.org/WAI/ARIA/apg/patterns/alert/#keyboardinteraction)guidelines, making it easy for users of assistive technologies (AT) and those who rely solely on keyboard navigation. The following keyboard shortcuts are supported by the PDF Viewer component:
63
63
64
-
|**Press (Windows)**|**Press (Macintosh)**|**To do this**|
64
+
|**Press (Windows)**|**Press (Macintosh)**|**To do this**|
65
65
| --- | --- | --- |
66
-
|||**Shortcuts for page navigation**|
67
-
| <kbd>CONTROL + Left Arrow (or) CONTROL + Up Arrow</kbd> | <kbd>COMMAND + Left Arrow (or) COMMAND + Up Arrow</kbd> |Navigate to the first page |
68
-
| <kbd>CONTROL + Right Arrow (or) CONTROL + Down Arrow</kbd> |<kbd>COMMAND + Right Arrow (or) COMMAND + Down Arrow</kbd> |Navigate to the last page |
69
-
|<kbd>Left Arrow</kbd> |<kbd>Left Arrow (or) Shift + Space</kbd> |Navigate to the previous page|
66
+
|||**Shortcuts for page navigation**|
67
+
| <kbd>CONTROL + Left Arrow (or) CONTROL + Up Arrow</kbd> | <kbd>COMMAND + Left Arrow (or) COMMAND + Up Arrow</kbd> |Navigate to the first page |
68
+
| <kbd>CONTROL + Right Arrow (or) CONTROL + Down Arrow</kbd> |<kbd>COMMAND + Right Arrow (or) COMMAND + Down Arrow</kbd> |Navigate to the last page |
69
+
|<kbd>Left Arrow</kbd> |<kbd>Left Arrow (or) Shift + Space</kbd> |Navigate to the previous page|
70
70
| <kbd>Right Arrow</kbd> | <kbd>Right Arrow (or) Space</kbd> | Navigate to the next page |
71
-
| <kbd>CONTROL + G</kbd> | <kbd>COMMAND + G</kbd> | Go To The Page|
|<kbd>Shift + H</kbd> |<kbd>Shift + H</kbd> |Enable pan mode|
95
-
|<kbd>Shift + V</kbd> |<kbd>Shift + V</kbd> |Enable text selection mode|
96
-
97
-
The current implementation of our PDF Viewer includes keyboard shortcuts for various functions like scrolling, zooming, text search, printing, and annotation deletion.
98
-
99
-
To enhance user experience, we're adding additional keyboard shortcuts for actions such as navigating between pages, accessing specific pages, toggling annotation tools, and displaying PDF elements like outlines, annotations, bookmarks, and thumbnails.
100
-
101
-
To support this, we're introducing a new class called **commandManager**, which handles custom commands triggered by specific key gestures. These custom commands will be defined by users and executed accordingly.
102
-
103
-
The **commandManager** will have a parameter called Commands, which will hold the collection of custom keyboard commands specified by users. Each custom command will be represented by a KeyboardCommand class, containing the `command name` and associated `keyboard combination`.
104
-
105
-
Additionally, we're introducing the **keyboardCustomCommands** parameter for the CommandManager, which will utilize the EventCallback to handle keyboard events and trigger appropriate methods when specific key combinations are pressed.
The current implementation of our PDF Viewer includes keyboard shortcuts for functions such as scrolling, zooming, text search, printing, and annotation deletion.
98
+
99
+
To enhance user experience, we are adding additional keyboard shortcuts for actions like navigating between pages, accessing specific pages, toggling annotation tools, and displaying PDF elements (outlines, annotations, bookmarks, and thumbnails).
100
+
101
+
To support these enhancements, we are introducing a new class called **commandManager**. This class handles custom commands triggered by specific key gestures, which are defined by users and executed accordingly.
102
+
103
+
The **commandManager** includes a parameter called `keyboardCommand` (which replaces `Commands`). This parameter holds a collection of custom keyboard commands specified by users. Each custom command is represented by a `KeyboardCommand` class, containing the `name` of the command and its associated `gesture` (keyboard combination).
104
+
105
+
Additionally, we are introducing an `EventCallback` to the `keyboardCustomCommands` parameter for the `CommandManager`. This will handle keyboard events and trigger appropriate methods when specific key combinations are pressed.
107
106
108
107
{% tabs %}
109
108
{% highlight cshtml tabtitle="Standalone" %}
@@ -198,7 +197,6 @@ Additionally, we're introducing the **keyboardCustomCommands** parameter for the
198
197
{% endhighlight %}
199
198
{% endtabs %}
200
199
201
-
202
200
Each `keyboardCommand` object consists of a name property, specifying the `name` of the `custom command`, and a `gesture property`, defining the key gesture associated with the command.
203
201
204
202
For example, the first command named `customCopy` is associated with the **G** key and requires both the **Shift** and **Alt** modifier keys to be pressed simultaneously.
@@ -216,4 +214,4 @@ This setup allows users to perform custom actions within the PDF viewer by press
216
214
217
215
The PDF Viewer component's accessibility levels are ensured through an [accessibility-checker](https://www.npmjs.com/package/accessibility-checker) and [axe-core](https://www.npmjs.com/package/axe-core) software tools during automated testing.
218
216
219
-
N> Follow the steps provided in the [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/asp-net-core/getting-started) to create a simple PDF Viewer sample.
217
+
N> Follow the steps provided in the [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/asp-net-core/getting-started) to create a simple PDF Viewer sample.
Copy file name to clipboardExpand all lines: Document-Processing/PDF/PDF-Viewer/asp-net-core/download.md
+6-2Lines changed: 6 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,7 +10,7 @@ documentation: ug
10
10
11
11
# Download a PDF document in PDF Viewer component
12
12
13
-
The PDF Viewer supports downloading the loaded PDF file. You can enable/disable the download using the following code snippet.
13
+
The PDF Viewer supports downloading the loaded PDF file. You can enable or disable the download using the following example.
14
14
15
15
{% tabs %}
16
16
{% highlight cshtml tabtitle="Standalone" %}
@@ -36,7 +36,7 @@ The PDF Viewer supports downloading the loaded PDF file. You can enable/disable
36
36
37
37
38
38
39
-
You can invoke download action using following code snippet.,
39
+
You can also programmatically invoke the download action using the `download()` method, as shown below:
40
40
41
41
{% tabs %}
42
42
{% highlight cshtml tabtitle="Standalone" %}
@@ -76,6 +76,10 @@ You can invoke download action using following code snippet.,
76
76
{% endhighlight %}
77
77
{% endtabs %}
78
78
79
+
## Get the base64 string while downloading the PDF document
80
+
81
+
You can use the [downloadEnd](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.pdfviewer.pdfviewer.html#Syncfusion_EJ2_PdfViewer_PdfViewer_DownloadEnd) event of the PDF Viewer to retrieve the downloaded document as a base64 string.
0 commit comments