question

MarkMather-7608 avatar image
0 Votes"
MarkMather-7608 asked ·

Help correcting tab header

I need help correcting the tabview tab header title and the Website Icon isn't showing up


7856-tab.png


Right now I seeing this

7857-tab2.png



 private void Neutron_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
         {
             if (args.IsSuccess == true)
             {
                 StatusTextBox.Text = " completed successfully.";
                 Tabs.Header = args.Uri.ToString();
             }
             else
             {
                 StatusTextBox.Text = "Navigation to: " + args.Uri.ToString() +
                                        " failed with error " + args.WebErrorStatus.ToString();
    
             }
         }
    
         }
     }


windows-uwp
tab.png (10.2 KiB)
tab2.png (14.1 KiB)
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

MarkMather-7608 avatar image
0 Votes"
MarkMather-7608 answered ·

here is the code i don't think I named it

 <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="TabViewItem"
                          
                       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" ContentLoading="Neutron_ContentLoading" DOMContentLoaded="Neutron_DOMContentLoaded" NavigationCompleted="Neutron_NavigationCompleted" />
    
             </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.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" Background="White"/>
         <Button Content="" FontFamily="Segoe MDL2 Assets" Margin="57,10,0,0" VerticalAlignment="Top" Height="32" Width="42" Background="#33E8E8E8"/>
         <Button Content="&#xE117;" FontFamily="Segoe MDL2 Assets" Margin="104,11,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.485,0.852" Height="31" Width="45" Background="#33FDFDFD"/>
         <TextBox HorizontalAlignment="Left" Margin="204,10,0,0" Text="" TextWrapping="Wrap" VerticalAlignment="Top" Width="1330" PlaceholderText="Enter Address" AllowDrop="True" BackgroundSizing="InnerBorderEdge" ElementSoundMode="Default" KeyDown="TextBox_KeyDown" Height="31"/>
         <Button Content="&#xE10F;" FontFamily="Segoe MDL2 Assets" Margin="154,11,0,0" VerticalAlignment="Top" RenderTransformOrigin="-0.485,0.852" Height="31" Width="45" Background="#33FFFFFF"/>
         <Button Content="&#xE712;" FontFamily="Segoe MDL2 Assets" Margin="0,11,10,0" VerticalAlignment="Top" RenderTransformOrigin="-0.485,0.852" Height="31" Width="45" HorizontalAlignment="Right" Background="#33EEEEEE">
                
         </Button>
    
     </Grid>
 </Page>
· 6 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Please start using comments and reply to comments instead to post new answers

2 You named it TabViewItem (that is not much correct as the control is a TabView)

<controls:TabView x:Name="TabViewItem"


I updated my previous answer, please check it.

0 Votes 0 ·

k I changed the name from

"TabViewItem" to Tabs it worked

7757-tab5.png


0 Votes 0 ·
tab5.png (5.0 KiB)

Sorry about the posting of new answers instead of the comments.

0 Votes 0 ·

@danielescipioni here is my other question

0 Votes 0 ·

here is the example of the look I'm going for

7788-tab6.png


And thank you so much for you help, sorry for asking to many questions I'm new to uwp I'm normally using basic wanted to learn something new


0 Votes 0 ·
tab6.png (1.3 KiB)

You could accept @danielescipioni 's answer if his solution helps you solve the issue. That will help other people who have the same issue.

0 Votes 0 ·
MarkMather-7608 avatar image
0 Votes"
MarkMather-7608 answered ·
   <controls:TabViewItem 
                    
                 Header="Home" Icon="Home" ManipulationMode="ScaleInertia" CanDrag="True">
                 <WebView x:Name="Neutron" ContentLoading="Neutron_ContentLoading" DOMContentLoaded="Neutron_DOMContentLoaded" NavigationCompleted="Neutron_NavigationCompleted" />
    
             </controls:TabViewItem>
·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

danielescipioni avatar image
0 Votes"
danielescipioni answered ·

Change the control name to TabView to give it a more correct name, here the XAML

<controls:TabView x:Name="TabView"

then use this

private void Neutron_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
{
    if (args.IsSuccess)
    {
        var selectedTabViewItem = (TabViewItem) TabView.SelectedItem;
        if (selectedTabViewItem == null) return;
        selectedTabViewItem.Header = args.Uri.ToString();
        selectedTabViewItem.Icon = new SymbolIcon(Symbol.Accept);
    }
}


To fill "selectedTabViewItem.Icon" you can use an instance of classes BitmapIcon, FontIcon, IconSourceElement, PathIcon, SymbolIcon depending what you want to show.

·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

MarkMather-7608 avatar image
0 Votes"
MarkMather-7608 answered ·

Im getting this error


7825-tab3.png


These are the options I'm getting while trying to fix, also how do you in example make it say "icon" facebook

7787-tab4.png



tab3.png (32.0 KiB)
tab4.png (26.8 KiB)
· 1 ·
10 |1000 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

How did you named your TabView control?

0 Votes 0 ·