-
Notifications
You must be signed in to change notification settings - Fork 17
Add accessibility for CV. #1152
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
Merged
Changes from 5 commits
Commits
Show all changes
6 commits
Select commit
Hold shift + click to select a range
0b1eeaf
Add accessibility for CV.
didiyordanova da7f562
add more info for accessibility
didiyordanova 29a4e15
add template
didiyordanova e1c93fd
add current item and visual states
didiyordanova 334a648
fix encoding
didiyordanova 7dec20d
address comments
didiyordanova File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
#collectionview-keyboard-notes | ||
## Notes | ||
|
||
Here are notes that the users should be aware of when using the keyboard navigation support: | ||
|
||
* Groups are not part of the keyboard navigation support. | ||
didiyordanova marked this conversation as resolved.
Show resolved
Hide resolved
|
||
* When entering the CollectionView with the keyboard, if there is already a `CurrentItem` set, this item becomes focused and is used as a starting point for navigation onwards. | ||
* When entering the CollectionView with the keyboard, if there is no `CurrentItem` set, the first rendered item becomes current. If there are no rendered items, then the first item from the data view becomes current. An example of no rendered items—when all groups in the `viewport` are collapsed. In this case when expanding the first group, the `CurrentItem` will become visible. | ||
didiyordanova marked this conversation as resolved.
Show resolved
Hide resolved
|
||
* When changing the `CurrentItem` to an item that is not in the `viewport`, the CollectionView scrolls to this item. The CollectionView won't scroll to an item if the `CurrentItem` is inside a collapsed group and the item is not visible. | ||
#end | ||
|
||
#collectionview-keyboard-common-text | ||
While applying part of the keyboard keys, you can also change the current item behavior of the CollectionView component. For more details, see the article on [setting the .NET MAUI CollectionView Current Item]({%slug collectionview-current-item%}) | ||
|
||
The following table lists the actions and keyboard combinations that are available in the CollectionView: | ||
#end |
42 changes: 42 additions & 0 deletions
42
controls/collectionview/accessibility/keyboard-navgation/maccatalyst.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
--- | ||
title: MacCatalyst | ||
page_title: .NET MAUI CollectionView Documentation - Keyboard Support on MacCatalyst | ||
description: Learn more about the available keyboard combinations as part of the supported Telerik UI for .NET MAUI CollectionView accessibility standards. | ||
position: 2 | ||
slug: collectionview-keyboard-support-mac | ||
--- | ||
|
||
# .NET MAUI CollectionView Keyboard Support on MacCatalyst | ||
|
||
The [Telerik UI for .NET MAUI CollectionView]({%slug collectionview-overview%}) provides keyboard navigation support on `MacCatalyst`. | ||
|
||
@[template](/_contentTemplates/common/collectionview.md#collectionview-keyboard-common-text) | ||
|
||
|
||
| Hotkey Combinations | Action | | ||
didiyordanova marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| -------------------- | ------ | | ||
| `Tab` | Enters or exits the CollectionView. | | ||
| `Up Arrow` | Navigates to the previous item in the CollectionView when the orientation of the `ItemsLayout` is `Vertical`. | | ||
| `Down Arrow` | Navigates to the next item in the CollectionView when the orientation of the `ItemsLayout` is `Vertical`. | | ||
| `Left Arrow` | Navigates to the previous item in the CollectionView when the orientation of the `ItemsLayout` is `Horizontal`. | | ||
| `Right Arrow` | Navigates to the previous item in the CollectionView when the orientation of the `ItemsLayout` is `Horizontal`. | | ||
| `Space` | Selects the currently focused item in `Single` `SelectionMode`. When `SelectionMode` is multiple, the `Space` key selects/deselects the current item. | | ||
| `Fn` + `Up Arrow` | When all items are in the viewport, the first item becomes current. When not all items are in the viewport, the first rendered item becomes current. When pressing `Page Up` again, a new portion of items appear and the first of them becomes current. | | ||
didiyordanova marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| `Fn` + `Down Arrow` | When all items are in the viewport, the last item becomes current. When not all items are in the viewport, the last rendered item becomes current. When pressing `Page Down` again, a new portion of items appear and the last of them becomes current. | | ||
didiyordanova marked this conversation as resolved.
Show resolved
Hide resolved
|
||
| `Fn` + `Left Arrow` | The first item in the CollectionView becomes current. | | ||
| `Fn` + `Right Arrow` | The last item in the CollectionView becomes current. | | ||
|
||
|
||
@[template](/_contentTemplates/common/collectionview.md#collectionview-keyboard-notes) | ||
|
||
## Additional Resources | ||
|
||
- [.NET MAUI CollectionView Product Page](https://www.telerik.com/maui-ui/collectionview) | ||
- [.NET MAUI CollectionView Forum Page](https://www.telerik.com/forums/maui?tagId=1829) | ||
- [Telerik .NET MAUI Blogs](https://www.telerik.com/blogs/mobile-net-maui) | ||
- [Telerik .NET MAUI Roadmap](https://www.telerik.com/support/whats-new/maui-ui/roadmap) | ||
|
||
## See Also | ||
|
||
- [Keyboard navigation support on MacCatalyst]({%slug collectionview-keyboard-support-mac%}) | ||
- [Screen Reader]({%slug collectionview-accessibility-screen-reader%}) |
43 changes: 43 additions & 0 deletions
43
controls/collectionview/accessibility/keyboard-navgation/windows.md
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
--- | ||
title: WinUI | ||
page_title: .NET MAUI CollectionView Documentation - Keyboard Support for WinUI | ||
description: Learn more about the available keyboard combinations as part of the supported Telerik UI for .NET MAUI CollectionView accessibility standards. | ||
position: 1 | ||
slug: collectionview-keyboard-support-winui | ||
--- | ||
|
||
# .NET MAUI CollectionView Keyboard Support on WinUI | ||
|
||
The [Telerik UI for .NET MAUI CollectionView]({%slug collectionview-overview%}) provides keyboard navigation support on `WinUI`. | ||
|
||
@[template](/_contentTemplates/common/collectionview.md#collectionview-keyboard-common-text) | ||
|
||
|
||
| Hotkey Combinations | Action | | ||
| -------------------- | ------ | | ||
| `Tab` | Enters or exits the CollectionView. | | ||
| `Shift` + `Tab` | Enters or exits the CollectionView. | | ||
| `Up Arrow` | Navigates to the previous item in the CollectionView when the orientation of the `ItemsLayout` is `Vertical`. | | ||
| `Down Arrow` | Navigates to the next item in the CollectionView when the orientation of the `ItemsLayout` is `Vertical`. | | ||
| `Left Arrow` | Navigates to the previous item in the CollectionView when the orientation of the `ItemsLayout` is `Horizontal`. | | ||
| `Right Arrow` | Navigates to the previous item in the CollectionView when the orientation of the `ItemsLayout` is `Horizontal`. | | ||
| `Space` | Selects the currently focused item in `Single` `SelectionMode`. When `SelectionMode` is multiple, the `Space` key selects/deselects the current item. | | ||
| `Page Up` | When all items are in the viewport, the first item becomes current. When not all items are in the viewport, the first rendered item becomes current. When pressing `Page Up` again, a new portion of items appear and the first of them becomes current. | | ||
| `Page down` | When all items are in the viewport, the last item becomes current. When not all items are in the viewport, the last rendered item becomes current. When pressing `Page Down` again, a new portion of items appear and the last of them becomes current. | | ||
| `Home` | The first item in the CollectionView becomes current. | | ||
| `End` | The last item in the CollectionView becomes current. | | ||
|
||
|
||
@[template](/_contentTemplates/common/collectionview.md#collectionview-keyboard-notes) | ||
|
||
## Additional Resources | ||
|
||
- [.NET MAUI CollectionView Product Page](https://www.telerik.com/maui-ui/collectionview) | ||
- [.NET MAUI CollectionView Forum Page](https://www.telerik.com/forums/maui?tagId=1829) | ||
- [Telerik .NET MAUI Blogs](https://www.telerik.com/blogs/mobile-net-maui) | ||
- [Telerik .NET MAUI Roadmap](https://www.telerik.com/support/whats-new/maui-ui/roadmap) | ||
|
||
## See Also | ||
|
||
- [Keyboard navigation support on MacCatalyst]({%slug collectionview-keyboard-support-mac%}) | ||
- [Screen Reader]({%slug collectionview-accessibility-screen-reader%}) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
--- | ||
title: Screen Reader | ||
page_title: .NET MAUI CollectionView Documentation - Screen Reader | ||
description: The Telerik UI for .NET MAUI CollectionView provides screen reader support for Android and iOS. | ||
position: 0 | ||
slug: collectionview-accessibility-screen-reader | ||
tags: accessibility, collectionview, screen reader, accessibility support, dotnet maui | ||
--- | ||
|
||
# .NET MAUI CollectionView Screen Reader Support (Android and iOS) | ||
|
||
The Telerik UI for .NET MAUI CollectionView provides extensive accessibility support and enables users with disabilities to acquire complete control over its features. | ||
|
||
The CollectionView allows the users to use the Android (TalkBack) and iOS (VoiceOver) screen readers for voice descriptions of the elements inside the CollectionView. | ||
|
||
## See Also | ||
|
||
- [Keyboard navigation support on MacCatalyst]({%slug collectionview-keyboard-support-mac%}) | ||
- [Keyboard navigation support on WinUI]({%slug collectionview-keyboard-support-winui%}) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,37 @@ | ||
--- | ||
title: Current Item | ||
page_title: .NET MAUI CollectionView Documentation - Current Item | ||
description: Learn how to set the behavior and style the appearance of the current cell of the Telerik UI for .NET MAUI CollectionView component. | ||
position: 25 | ||
slug: collectionview-current-item | ||
tags: current item, keyboard navigation, maui, collectionview, dotnet maui | ||
--- | ||
|
||
# .NET MAUI CollectionView Current Item | ||
|
||
The [Telerik UI for .NET MAUI CollectionView]({%slug colelctionview-overview%}) provides options for configuring the behavior and style of its current item. | ||
|
||
## Setting the Behavior | ||
|
||
The CollectionView allows you to use the `CurrentItem` property of type `object` to programmatically modify the current item during keyboard navigation, when using the mouse, and so on. | ||
|
||
## Styling the Item | ||
|
||
You can style the current item by setting the `Focused`, `FocusedSelected`, and `FocusedMouseOver` [visual states of the CollectionView]({%slug collectionview-visual-states%}). Define the visual states by using the [Item Styling of the CollectionView]({%slug collectionview-item-styling%}). | ||
|
||
## Additional Resources | ||
|
||
- [.NET MAUI CollectionView Product Page](https://www.telerik.com/maui-ui/collectionview) | ||
- [.NET MAUI CollectionView Forum Page](https://www.telerik.com/forums/maui?tagId=1829) | ||
- [Telerik .NET MAUI Blogs](https://www.telerik.com/blogs/mobile-net-maui) | ||
- [Telerik .NET MAUI Roadmap](https://www.telerik.com/support/whats-new/maui-ui/roadmap) | ||
|
||
## See Also | ||
|
||
- [Data Binding]({%slug collectionview-data-binding%}) | ||
- [Grouping]({%slug collectionview-grouping%}) | ||
- [Filtering]({%slug collectionview-filtering%}) | ||
- [Sorting]({%slug collectionview-sorting%}) | ||
- [Selection]({%slug collectionview-selection%}) | ||
- [Commands]({%slug collectionview-commands%}) | ||
- [Events]({%slug collectionview-events%}) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
--- | ||
title: Visual States | ||
page_title: .NET MAUI CollectionView Documentation - Visual States | ||
description: Learn how to set the border color, background color, and other visual states to the Telerik UI for .NET MAUI CollectionView item. | ||
position: 0 | ||
slug: collectionview-visual-states | ||
tags: style, visual states, item, collectionview, maui, dotnet maui | ||
--- | ||
|
||
# .NET MAUI CollectionView Visual States | ||
|
||
This article describes the visual states provided by the CollectionView control. | ||
|
||
You can use these visual states to change the appearance of the control based on its state—such as when it's disabled, focused, hovered, and more. | ||
|
||
The CollectionView provides the following `CommonStates` visual states: | ||
|
||
| Visual State | Description | | ||
| ------------- | --------------- | | ||
| `Normal` | Applies when the item is in its normal state. | | ||
| `Selected` | Applies when the item is selected—for `Single` or `Multiple` `SelectionMode`. | | ||
| `MouseOver` | Applies when the mouse cursor is hovering over the item. | | ||
| `Focused` | Applies when setting the current item. | | ||
| `FocusedMouseOver` | Applies when the current item is set and the mouse cursor is hovering it. | | ||
| `FocusedSelected` | Applies when the item is selected and focused. | | ||
| `Disabled` | Applies when the ColelctionView item `IsEnabled` is `False`. | | ||
|
||
## See Also | ||
|
||
- [Grouping]({%slug collectionview-grouping%}) | ||
- [Filtering]({%slug collectionview-filtering%}) | ||
- [Sorting]({%slug collectionview-sorting%}) | ||
- [Selection]({%slug collectionview-selection%}) | ||
- [Commands]({%slug collectionview-commands%}) | ||
- [Events]({%slug collectionview-commands%}) | ||
|
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.