fluent-svelte icon indicating copy to clipboard operation
fluent-svelte copied to clipboard

NavigationView

Open Tropix126 opened this issue 3 years ago • 4 comments

One of WinUI's most important (and most complex) components is NavigationView, which provides the base layout for most apps. NavigationView provides the base layout for most apps with either a sidebar or navigation strip.

image

image

Tropix126 avatar Mar 15 '22 15:03 Tropix126

I think that it's probably best to split this into two components, considering how different they are. Also not sure about the viability of topnav's overflow menu with traditional slots. We'll see.

Tropix126 avatar Mar 15 '22 15:03 Tropix126

thinking of something like this

<NavigationView variant="standard | narrow | minimal" backButton menuButton expanded on:expand on:collapse on:back>
    <svelte:fragment slot="title">
        Header
    </svelte:fragment>

    <svelte:fragment slot="header">
        <AutoSuggestBox placeholder="Search" />
    </svelte:fragment>

    <svelte:fragment slot="items">
        <NavigationViewItem>Item 1</NavigationViewItem>
        <NavigationViewItem>Item 2</NavigationViewItem>
        <NavigationViewItem>Item 3</NavigationViewItem>
        <NavigationViewItem>Item 4</NavigationViewItem>
    </svelte:fragment>

    <svelte:fragment slot="footer">
        <NavigationViewItem>Settings</NavigationViewItem>
    </svelte:fragment>

    <TextBlock variant="title">Page Title</TextBlock>
</NavigationView>

Tropix126 avatar Mar 15 '22 16:03 Tropix126

How much customization will be available? Would it work for navigating pages as well?

d2dyno1 avatar Apr 26 '22 21:04 d2dyno1

How much customization will be available? Would it work for navigating pages as well?

I think that this will ideally just be for layout. I'll leave the navigation up to a routing library of the user's choice, since things start to get very complicated and unwieldy at that point.

Tropix126 avatar May 02 '22 01:05 Tropix126