ToolbarItem is not showing

5.5k views Asked by At

Im currently reading trough this book.

Already at the beginning of the book I have a problem. I have Primary ToolbarItems and Secondary ToolbarItems. But none of them are shown. What am I doing wrong?

<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             xmlns:local="clr-namespace:BookCode" 
             x:Class="BookCode.MainPage"
             Title="Visuals">


    <StackLayout Padding="10,0">
        <Label Text="Hello, Xamarin.Forms!"
               FontSize="Large"
               VerticalOptions="CenterAndExpand"
               HorizontalOptions="Center"/>

        <Button Text="Click Me!"
                VerticalOptions="CenterAndExpand"
                HorizontalOptions="Center"/>

        <Switch VerticalOptions="CenterAndExpand"
                HorizontalOptions="Center"/>
    </StackLayout>

    <ContentPage.ToolbarItems>
        <ToolbarItem Text="edit" Order="Primary">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"
                            iOS="edit.png"
                            Android="ic_action_edit.png"
                            WinPhone="Images/edit.png"/>

            </ToolbarItem.Icon>
        </ToolbarItem>
        <ToolbarItem Text="search" Order="Primary">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"
                            iOS="search.png"
                            Android="ic_action_search.png"
                            WinPhone="Images/feature.search.png"/>
            </ToolbarItem.Icon>
        </ToolbarItem>

        <ToolbarItem Text="refresh" Order="Primary">
            <ToolbarItem.Icon>
                <OnPlatform x:TypeArguments="FileImageSource"
                            iOS="reload.png"
                            Android="ic_action_refresh.png"
                            WinPhone="Images/refresh.png"/>
            </ToolbarItem.Icon>
        </ToolbarItem>

        <ToolbarItem Text="explore" Order="Secondary"/>
        <ToolbarItem Text="discover" Order="Secondary"/>
        <ToolbarItem Text="evolve" Order="Secondary" />
    </ContentPage.ToolbarItems>


</ContentPage>
2

There are 2 answers

2
axbeit On BEST ANSWER

The ToolbarItems needs a Navigation Page to show them up. So modify MainPage wrapped by a navigation page:

MainPage = new NavigationPage(new MainPage());
6
Wasif Mahmood Mustafa On

Here you go.

<ContentPage.ToolbarItems>
    <ToolbarItem Text="edit" Order="Primary">
        <ToolbarItem.Icon>
            <OnPlatform x:TypeArguments="FileImageSource"
                        Android="icon.png"/>

        </ToolbarItem.Icon>
    </ToolbarItem>
    <ToolbarItem Text="search" Order="Primary">
        <ToolbarItem.Icon>
            <OnPlatform x:TypeArguments="FileImageSource"
                       Android="icon.png"/>
        </ToolbarItem.Icon>
    </ToolbarItem>

    <ToolbarItem Text="refresh" Order="Primary">
        <ToolbarItem.Icon>
            <OnPlatform x:TypeArguments="FileImageSource"
                        Android="icon.png"/>
        </ToolbarItem.Icon>
    </ToolbarItem>

    <ToolbarItem Text="explore" Order="Secondary"/>
    <ToolbarItem Text="discover" Order="Secondary"/>
    <ToolbarItem Text="evolve" Order="Secondary" />
</ContentPage.ToolbarItems>


<ContentPage.Content>
    <StackLayout Padding="10,0">
        <Label Text="Hello, Xamarin.Forms!"
           FontSize="Large"
           VerticalOptions="CenterAndExpand"
           HorizontalOptions="Center"/>

        <Button Text="Click Me!"
            VerticalOptions="CenterAndExpand"
            HorizontalOptions="Center"/>

        <Switch VerticalOptions="CenterAndExpand"
            HorizontalOptions="Center"/>
    </StackLayout>
</ContentPage.Content>

Toolbar