[dev-v5] FluentTreeView #3802
Merged
[dev-v5] FluentTreeView #3802
Conversation
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
4 tasks
|
✅ All tests passed successfully Details on your Workflow / Core Tests page. |
Summary - Unit Tests Code CoverageSummary
CoverageMicrosoft.FluentUI.AspNetCore.Components - 99.5%
|
|
@PascalVorwerk FYI |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
[dev-v5] FluentTreeView
A hierarchical list structure component for displaying data in a collapsible and expandable way.
You can create a Tree manually by nesting
FluentTreeItemcomponents or by using theItemsproperty ofFluentTreeViewto dynamically generate a tree from a list of objects.If you use the
Itemsproperty, you can also set theItemTemplateproperty to specify how each item should be displayed.With these two ways of creating a tree, using the
Textparameter will display the text of the element, adding an ellipsis...if the text is too long.Each element also has the properties
IconStart,IconEnd, andIconAsideto display an icon to the left, right, or at the end of the text.Manual TreeView
Items parameter
In this example, we create a tree dynamically by using the
Itemsproperty ofFluentTreeView.The
Itemsparameter is a list of TreeViewItem that represent the items in the tree.When a user selects an item, the
SelectedItemparameter is updated with theITreeViewItemof the selected item.Mutliple Selection
The
FluentTreeViewcomponent supports the multiple selection of items using theSelectionModeparameter.When this parameter is set to
TreeSelectionMode.Multiple, a checkbox is displayed next to each item.You can customize the visibility of the checkbox using the
MultipleSelectionVisibilityparameter.This function allows you to show, hide (keeping the space) or hide and remove the checkbox, based on each
ITreeViewItemobjects.Live example: https://fluentui-blazor-v5.azurewebsites.net/TreeView
Unit Tests