Xamarin表单中具有多行标题的导航栏?

嗨,我想在导航栏中实现多行标题。如何以xamarin形式进行操作。

我尝试了使用newline属性,但这不起作用。

Title="Morning \n 9.30 Am";

我想要这样的标题

早晨

9.30 am

xiaoqingqiu22 回答:Xamarin表单中具有多行标题的导航栏?

如果要在页面中自定义导航栏,

例如,您要向其中添加“标签”或“条目”。

您可以在 Xamarin.Forms v3.2或更高版本

中执行此操作

XForms引入了一个名为 NavigationPage.TitleView 的新标签。

使用此标签,您可以自定义导航栏并将任何控件添加到导航栏

这是将多行标签添加到导航栏中的示例代码。

以xaml

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
         x:Class="TestApp.MainPage">
<NavigationPage.TitleView>
    <StackLayout>
        <Label x:Name="Label" 
               TextColor="Red" 
               FontSize="Medium"
               HorizontalTextAlignment="Center" />
    </StackLayout>
</NavigationPage.TitleView>

在CS中

 public MainPage()
    {
        InitializeComponent();
        Label.Text = "Line1\nLine2";
    }

enter image description here 参考

,

如果要将标题设置为多行。您可以设置titleView的样式。我已经实现了此功能,可以查看here

首先,我们可以创建ContentPage(BaseContentPage)的子类

(在Android中,您只需设置TitleView的样式)

  [XamlCompilation(XamlCompilationOptions.Compile)]
  public partial class BaseContentPage : ContentPage
{
    public BaseContentPage ()
    {
        InitializeComponent ();

        if (Device.RuntimePlatform == "Android")
        {
            NavigationPage.SetHasBackButton(this,false);
            NavigationPage.SetTitleView(this,SetTitleView("Morning \n 9.30 Am"));
        }
        else
        {
            Title = "Morning \n 9.30 Am";
        }
    }

    StackLayout SetTitleView(string title)
    {
        Button button = new Button()
        {
            Text = "Back",TextColor = Color.White,FontAttributes = FontAttributes.None,BackgroundColor = Color.Transparent,};
        button.Clicked += Button_Clicked;
        StackLayout TitleView = new StackLayout()
        {
            Margin = new Thickness(-20,0),Orientation = StackOrientation.Horizontal,VerticalOptions = LayoutOptions.CenterAndExpand,HorizontalOptions = LayoutOptions.Start,Children = {
                button,new Label(){
                    Text = title,HorizontalTextAlignment = TextAlignment.Center,WidthRequest = 200,}
            }
        };
        return TitleView;
    }

    private void Button_Clicked(object sender,EventArgs e)
    {
        Navigation.PopAsync();
    }
}

因为此方法仅适用于Android。因此,您应该在iOS上做更多的事情。

在iOS项目中。创建BaseContentPage的自定义呈现器。并设置导航栏的样式。

 using Foundation;
 using UIKit;
 using Xamarin.Forms.Platform.iOS;
 using Xamarin.Forms;
 using xxx.iOS;
 using CoreGraphics;
 using xxx;
 using ObjCRuntime;
 [assembly: ExportRenderer(typeof(BaseContentPage),typeof(MyPageRenderer))]
 namespace xxx.iOS
 {
public class MyPageRenderer: PageRenderer
{
    public override void ViewWillAppear(bool animated)
    {
        base.ViewWillAppear(animated);
        var page = Element as Page1;
        NavigationController.NavigationBar.Hidden = true;
        double height = IsiphoneX();
        UIView backView = new UIView()
        {
            BackgroundColor = UIColor.White,Frame = new CGRect(0,20,UIScreen.MainScreen.Bounds.Width,height),};
        UIButton backBtn = new UIButton() {
            Frame = new CGRect(20,height-44,40,44),Font = UIFont.SystemFontOfSize(18),} ;
        backBtn.SetTitle("Back",UIControlState.Normal);
        backBtn.SetTitleColor(UIColor.Blue,UIControlState.Normal);
        backBtn.AddTarget(this,new Selector("GoBack"),UIControlEvent.TouchUpInside);
        UILabel titleLabel = new UILabel() {
            Frame=new CGRect(UIScreen.MainScreen.Bounds.Width/2-75,150,Font = UIFont.SystemFontOfSize(20),Text = page.Title,TextColor = UIColor.Black,Lines = 0,};
        UILabel line = new UILabel() {
            Frame = new CGRect(0,height,0.5),BackgroundColor = UIColor.Black,};

        backView.AddSubview(backBtn);
        backView.AddSubview(titleLabel);
        backView.AddSubview(line);
        View.AddSubview(backView);
    }
     double IsiphoneX()
    {
        double height = 44;
        if (UIDevice.CurrentDevice.CheckSystemVersion(11,0))
        {
            if (UIApplication.SharedApplication.Delegate.GetWindow().SafeAreaInsets.Bottom > 0.0)
            {
                height = 64;
            }
        }
        return height;
    }
    [Export("GoBack")]
    void GoBack()
    {
        NavigationController.PopViewController(true);
    }
    public override void ViewWillDisappear(bool animated)
    {
        base.ViewWillDisappear(animated);

        NavigationController.NavigationBar.Hidden = false;
    }
  }
 }

结果是:

Android:

enter image description here

iOS:

enter image description here

本文链接:https://www.f2er.com/2958855.html

大家都在问