如何在 Xamarin Forms 的 NavigationBar 中包含视图? [英] How to include view in NavigationBar of Xamarin Forms?

问题描述

我需要你的帮助！

我从事跨平台的移动开发项目.我将 Visual Studio 与 Xamarin Forms 一起使用.我有一个 SearchBar(Xamarin.Forms 类)，但是，我的问题是将它包含在 NavigationBar 中.

目前，我有一个 MasterDetailPage，我用 new NavigationPage(new customPage()) 初始化 this.Detail.我也有一个 SearchBar 渲染器.所以，我需要原始的 NavigationBar(我想保留返回按钮)但我想在里面添加我的 SearchBar.

如果您知道一种特别是对 android 执行此操作的方法，我将不胜感激.提前谢谢你！

解决方案

你需要创建一个自定义的 NavigationRenderer 并将你自己的 UISearchBar 插入到 UIToolbar 或 SearchView 进入 ViewGroup:

Xamarin 表单:

注意:为了保持解耦，使用 MessagingCenter 允许您在自定义渲染器中没有任何硬编码事件依赖性的情况下泵送消息.

[assembly:ExportRenderer (typeof(NavigationPage), typeof(SeachBarNavigationRender))]命名空间 Forms.Life.Cycle.iOS{公共类 SeachBarNavigationRender : NavigationRenderer{公共 SeachBarNavigationRender () : base(){}public override void PushViewController (UIViewController viewController, bool animation){base.PushViewController (viewController, 动画);列表toolbarItem = new List();foreach(TopViewController.NavigationItem.RightBarButtonItems 中的 UIBarButtonItem barButtonItem){如果(barButtonItem.Title.Contains(搜索")){UISearchBar search = new UISearchBar (new CGRect (0, 0, 200, 25));search.BackgroundColor = UIColor.LightGray;search.SearchBarStyle = UISearchBarStyle.Prominent;search.TextChanged += (object sender, UISearchBarTextChangedEventArgs e) =>{D.WriteLine(e.SearchText);MessagingCenter.Send(this, "SearchText", e.SearchText);};barButtonItem.CustomView = 搜索；}toolbarItem.Add(barButtonItem);}TopViewController.NavigationItem.RightBarButtonItems = toolbarItem.ToArray();}}}

I need your help !

I work on a mobile development project, cross-platform. I use Visual Studio with Xamarin Forms. I have a SearchBar (Xamarin.Forms class), but, my problem is to include this into the NavigationBar.

Currently, I have a MasterDetailPage and I init this.Detail with new NavigationPage(new customPage()). I have a SearchBar renderer, too. So, I need original NavigationBar (I want to keep the return button) but I would like to add my SearchBar inside.

I would be very grateful if you know of a way to do this especially to android. Thank you in advance !

解决方案

You need to create a custom NavigationRenderer and insert your own UISearchBar into the UIToolbar or SearchView into the ViewGroup:

Xamarin Forms : Renderer Base Classes and Native Controls

As an example of inserting a iOS UISearchBar into the nav bar via a custom NavigationRenderer:

Note: In order to keep things decoupled, using the MessagingCenter allows you to pump messages around without any hardcoding event dependancies within the custom renderer.

[assembly:ExportRenderer (typeof(NavigationPage), typeof(SeachBarNavigationRender))]
namespace Forms.Life.Cycle.iOS
{
    public class SeachBarNavigationRender : NavigationRenderer
    {
        public SeachBarNavigationRender () : base()
        {
        }

        public override void PushViewController (UIViewController viewController, bool animated)
        {
            base.PushViewController (viewController, animated);
            List<UIBarButtonItem> toolbarItem = new List<UIBarButtonItem> ();
            foreach (UIBarButtonItem barButtonItem in TopViewController.NavigationItem.RightBarButtonItems) {
                if ( barButtonItem.Title.Contains( "search")) {
                    UISearchBar search = new UISearchBar (new CGRect (0, 0, 200, 25));
                    search.BackgroundColor = UIColor.LightGray;
                    search.SearchBarStyle = UISearchBarStyle.Prominent;
                    search.TextChanged += (object sender, UISearchBarTextChangedEventArgs e) => {
                        D.WriteLine(e.SearchText);
                        MessagingCenter.Send<object, string> (this, "SearchText", e.SearchText);
                    };
                    barButtonItem.CustomView = search;
                }
                toolbarItem.Add (barButtonItem);
            }
            TopViewController.NavigationItem.RightBarButtonItems = toolbarItem.ToArray ();
        }
    }
}

这篇关于如何在 Xamarin Forms 的 NavigationBar 中包含视图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！