How do I in UWP in Tabview add buttons for navigation?

Mark Mather 156 Reputation points
2020-03-23T18:22:06.267+00:00
<Page
    x:Class="Frost.Browser2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Frost"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>

        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <controls:TabView x:Name="Tabs"

                      TabWidthBehavior="Equal"
                      CanCloseTabs="True"
                      IsCloseButtonOverlay="False"
                      CanDragItems="True"
                      CanReorderItems="False"
                      AllowDrop="False"
                      SelectedTabWidth="200" Margin="0,60,0,0" TabNavigation="Local" TabFocusNavigation="Local">

            <controls:TabView.Resources>

                <x:Double x:Key="TabViewItemHeaderMinHeight">40</x:Double>
                <x:Double x:Key="TabViewItemHeaderMinWidth">55</x:Double>
                <x:Double x:Key="TabViewItemHeaderMaxWidth">200</x:Double>

            </controls:TabView.Resources>




            <controls:TabView.TabStartHeader>
                <Button Width="48"
                Height="{StaticResource TabViewItemHeaderMinHeight}"
                Margin="0,0,-1,0"
                BorderThickness="1"
                Background="Transparent" 
                Style="{StaticResource ButtonRevealStyle}" 
                Padding="2,2,0,0">
                    <Viewbox MaxWidth="16" MaxHeight="16">
                        <SymbolIcon Symbol="OpenPane"/>
                    </Viewbox>
                </Button>
            </controls:TabView.TabStartHeader>

            <!-- Tabs -->
            <controls:TabViewItem Header="Home" Icon="Home" ManipulationMode="ScaleInertia" CanDrag="True" >

                <WebView x:Name="Neutron" />


            </controls:TabViewItem>


            <controls:TabView.TabActionHeader>
                <Button x:Name="AddTabButtonUpper"
                Width="48"
                Height="{StaticResource TabViewItemHeaderMinHeight}"
                Margin="-1,0,0,0"
                BorderThickness="1"
                Background="Transparent"
                Style="{StaticResource ButtonRevealStyle}">
                    <Viewbox MaxWidth="16"
                    MaxHeight="16">
                        <FontIcon FontFamily="Segoe MDL2 Assets"
                      Glyph="&#xE710;" />
                    </Viewbox>
                </Button>

            </controls:TabView.TabActionHeader>

            <controls:TabView.TabEndHeader>
                <Button Width="48"
                Height="{StaticResource TabViewItemHeaderMinHeight}"
                Margin="-1,0,0,0"
                BorderThickness="1" 
                Background="Transparent" 
                Style="{StaticResource ButtonRevealStyle}">
                    <Viewbox MaxWidth="16" MaxHeight="16">
                        <SymbolIcon Symbol="Setting"/>

                    </Viewbox>
                </Button>
            </controls:TabView.TabEndHeader>

            <controls:TabView.Footer>
                <TextBlock x:Name="StatusTextBox" Padding="12,8,12,8"
                   HorizontalAlignment="Left"
                   FontSize="12" FontWeight="Bold"
                   Text="Ready" />

            </controls:TabView.Footer>

        </controls:TabView>
        <Button Content="&#xE0A6;" FontFamily="Segoe MDL2 Assets" Margin="10,10,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.371,0.344" RequestedTheme="Default" Height="32" Width="42"/>
        <Button Content="" FontFamily="Segoe MDL2 Assets" Margin="57,10,0,0" VerticalAlignment="Top" Height="32" Width="42"/>
        <Button Content="&#xE117;" FontFamily="Segoe MDL2 Assets" Margin="104,11,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.485,0.852" Height="31" Width="45"/>
        <TextBox HorizontalAlignment="Left" Margin="213,10,0,0" Text="" TextWrapping="Wrap" VerticalAlignment="Top" Width="1331" PlaceholderText="Enter Address" AllowDrop="True" BackgroundSizing="InnerBorderEdge" ElementSoundMode="Default"/>
        <Button Content="GO" Margin="1549,10,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.275,0.531" Click="Button_Click"/>
        <Button Content="&#xE10F;" FontFamily="Segoe MDL2 Assets" Margin="154,11,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.485,0.852" Height="31" Width="45"/>


    </Grid>
</Page>
Universal Windows Platform (UWP)
{count} votes

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.