如何在所有页面的NavigationBar中添加图标?

时间:2019-02-13 11:15:41

标签: c# xaml xamarin.forms

所以我试图在我的NavigationBar中实现一个图标,以便可以在我的所有页面中看到它...我正在使用xamarin表单,因此我希望它能够在android和iOS中都可以使用...我我不确定如何执行此操作,但是我试图将其添加到MyCar.xaml

<customControls:BasePage xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
    xmlns:views="clr-namespace:OficinaDigitalX.Views"   
    xmlns:customControls="clr-namespace:OficinaDigitalX.ViewModel"
    x:Name="MyCar">
<customControls:BasePage.Content>
    <AbsoluteLayout>



        <StackLayout Padding="10, 0, 10, 0">


            <ListView 
                ItemsSource="{Binding Path=CarList}"
                IsPullToRefreshEnabled="False"
                SelectedItem="{Binding Path=SelectedCar}">
                <ListView.Header>
                    <Label Text="Os Meus Carros" FontSize="Large" />
                </ListView.Header>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <TextCell Text="{Binding VID}" 
                                  TextColor="Black" 
                                  Detail="{Binding LicensePlate}"/>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
    </AbsoluteLayout>
</customControls:BasePage.Content>
</customControls:BasePage>  

这是我的MyCar.xaml.cs

namespace OficinaDigitalX.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MyCar : ViewModel.BasePage
{

    public MyCar()
    {
        Extensions.LoadFromXaml(this, typeof(MyCar));
        BindingContext = new MyCarViewModel(Navigation);

    }

这是我的MyCarViewModel.cs

public class MyCarViewModel : ViewModelBase
{
    public MyCarViewModel()
    {
    }
    public MyCarViewModel(INavigation navigation)
    {
        this.Navigation = navigation;
        this.SelectedCar = null;
        GetClientCars();
    }

    private List<CarInfo> _CarList;

    public List<CarInfo> CarList
    {
        get
        {
            return _CarList;
        }

        set
        {
            _CarList = value;
            OnPropertyChanged("CarList");
        }
    }

    private CarInfo _SelectedCar;

    public CarInfo SelectedCar
    {
        get
        {
            return _SelectedCar;
        }

        set
        {
            _SelectedCar = value;
            OnPropertyChanged("SelectedCar");

            if (_SelectedCar != null)
                ChangeWindow(_SelectedCar);
        }
    }

    public INavigation Navigation { get; set; }

    private void ChangeWindow(CarInfo car)
    {

        Navigation.PushAsync(new Interactions(car));
        this.SelectedCar = null;

    }

    public void GetClientCars()
    {
        string command = "asdasd";
        HttpWebRequest request = (HttpWebRequest)WebRequest.Create(string.Format(MainPage.server + command));
        request.ContentType = "application/json";
        request.Method = "POST";
        //request.ContentLength = 999999;

        using (var stream = new StreamWriter(request.GetRequestStream()))
        {
            string postData = JsonConvert.SerializeObject(command);

            //stream.Write(postData);
            stream.Flush();
            stream.Close();
        }

        HttpWebResponse response = null;

        try
        {
            response = (HttpWebResponse)request.GetResponse();
            using (var responseString = new StreamReader(response.GetResponseStream()))
            {
                CarList = JsonConvert.DeserializeObject<List<CarInfo>>(responseString.ReadToEnd());
            }
        }
        catch (WebException ex)
        {
            using (StreamReader reader = new StreamReader(ex.Response.GetResponseStream()))
            {

            }
            throw;
        }
    }

}
}

任何人都可以帮忙吗?

2 个答案:

答案 0 :(得分:2)

在我的知识中,这样做的正确方法是扩展内容页面:

 public class BasePage : ContentPage
 {

    public ICommand CartItemCommand { get; set; }
    public ICommand NotificationPageCommand { get; set; }
    public BasePage() : base()
    {
        CartItemCommand = new Command(async () => await GoCartItemCommand());
        NotificationPageCommand = new Command(GoNotificationPage);

        Init();
    }

    private void Init()
    {
        this.ToolbarItems.Add(new ToolbarItem()
        {
            Icon = "nav_notification_btn",
            Command = NotificationPageCommand,
        });
        this.ToolbarItems.Add(new ToolbarItem()
        {
            Icon = "nav_cart_btn",
            Command = CartItemCommand
        });
    }

    }

}

完成此操作后,只需在位置ContentPage的任何地方使用此BasePage

在您的XAML中

<customControls:Basepage xmlns="http://xamarin.com/schemas/2014/forms"
        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
        xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
        xmlns:views="clr-namespace:OficinaDigitalX.Views"
        x:Class="OficinaDigitalX.MainPage"    
        xmlns:customControls="Your Control NameSpace"
        x:Name="Main"
        NavigationPage.HasNavigationBar="True">


</customControls:Basepage> 

并在您的Xaml.cs文件中

public partial class MainPage: BasePage

请确保这两个部分类均从一个基类继承,即根据您的需要从BasePage或ContentPage继承。

并且当您不想使用NavBar控件时,只需继承XAML类 从正常的ContentPage中获取。

在查询的情况下恢复好运!

答案 1 :(得分:1)

您有两种方法可以实现此目的:

1- NavigationPage.TitleView,您可以通过Image标签在其中放置图标。

2-使用一个名为NavBarView的自定义控件,并在您的页面的ControlTemplate属性中使用该控件。 NavBarView的实现可能是这样的:

<?xml version="1.0" encoding="UTF-8" ?>
<ControlTemplate
    x:Class="YourAppName.View.Controls.NavBarView"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="46" />
            <RowDefinition Height="1" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackLayout
            Padding="10,5"
            x:DataType="vm:XeposBaseViewModel"
            BackgroundColor="{StaticResource XeposHeaderBackgroundColor}"
            BindingContext="{TemplateBinding BindingContext}"
            Orientation="Horizontal">
            <!--  YOUR NAVBAR CONTENT HERE -->
        </StackLayout>
        <BoxView Grid.Row="1" BackgroundColor="Black" />
        <ContentPresenter Grid.Row="2" />
    </Grid>
</ControlTemplate>

用法应如下:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="YourAppName.View.Sell.SomeView"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:controls="clr-namespace:YourAppName.View.Controls;assembly=YourAppName.View"
    ControlTemplate="{StaticResource NavBar}">
    <!--  Your other page data is here  -->
</ContentPage>

NavBar在App.xaml中是这样定义的,因此您可以将其与 StaticResource 一起使用:

<controls:NavBarView x:Key="NavBar" />