为Xamarin.Forms的导航栏增加搜索功能
在使⽤NavigationPage导航的时候, 我们可以给⾥⾯添加⼀些功能按钮, 如下所⽰:
<ContentPage.ToolbarItems>
<ToolbarItem/>
<ToolbarItem/>
</ContentPage.ToolbarItems>
但是如果需要给这个控件添加⼀些其他的控件的时候, 则⽆法满⾜我们的需求, 这个时候, 我们就需要使⽤页⾯渲染器(Page Renderer)。真机效果演⽰:
实现思路:
1.添加⽤于搜索通知的接⼝ : ISearchPage
2.⾃定义搜索的渲染器 : SearchPageRender
3.添加Menu/Item Xml⽂件: l
4.添加 Nuget：Plugin.CurrentActivity
5.给需要添加搜索功能的页⾯实现 (1)的接⼝
6.为⾃定义搜索渲染器添加⽀持该功能的页⾯
7.启动项初始化 : CrossCurrentActivity.Current.Init(this, savedInstanceState)添加搜索通知接⼝
public interface ISearchPage
{
void OnSearchBarTextChanged(string text);
}
⾃定义渲染器
在Android项⽬中创建 CustomRender⽂件夹定义 SearchPageRender
SearchPageRender代码
public class SearchPageRender : PageRenderer
{
public SearchPageRender(Context context) : base(context)
{
}
protected override void OnAttachedToWindow()
{
base.OnAttachedToWindow();
if (Element is ISearchPage
&& Element is Page page
&& page.Parent is NavigationPage navigationPage)
{
//Workaround to re-add the SearchView when navigating back to an ISearchPage, because Xamarin.Forms automatically removes it
navigationPage.Popped += HandleNavigationPagePopped;
navigationPage.PoppedToRoot += HandleNavigationPagePopped;
}
}
//Adding the SearchBar in OnSizeChanged ensures the SearchBar is re-added after the device is rotated, because Xamarin.Forms automatically removes it
protected override void OnSizeChanged(int w, int h, int oldw, int oldh)
{
base.OnSizeChanged(w, h, oldw, oldh);
if (Element is ISearchPage && Element is Page page && page.Parent is NavigationPage navigationPage && navigationPage.CurrentPage is ISearchPage)
{
AddSearchToToolbar(page.Title);
}
}
protected override void Dispose(bool disposing)
{
if (GetToolbar() is Android.Support.V7.Widget.Toolbar toolBar)
toolBar.Menu?.RemoveItem(Resource.Menu.mainmenu);
base.Dispose(disposing);
}
//Workaround to re-add the SearchView when navigating back to an ISearchPage, because Xamarin.Forms automatically removes it
void HandleNavigationPagePopped(object sender, NavigationEventArgs e)
{
if (sender is NavigationPage navigationPage
&& navigationPage.CurrentPage is ISearchPage)
{
AddSearchToToolbar(navigationPage.CurrentPage.Title);
}
}导航页源码
void AddSearchToToolbar(string pageTitle)
{
if (GetToolbar() is Android.Support.V7.Widget.Toolbar toolBar
&& toolBar.Menu?.FindItem(Resource.Id.action_search)?.ActionView?.
JavaCast<Android.Support.V7.Widget.SearchView>().GetType()
!
= typeof(Android.Support.V7.Widget.SearchView))
{
toolBar.Title = pageTitle;
toolBar.InflateMenu(Resource.Menu.mainmenu);
if (toolBar.Menu?.FindItem(Resource.Id.action_search)?.ActionView?.
JavaCast<Android.Support.V7.Widget.SearchView>() is
Android.Support.V7.Widget.SearchView searchView)
{
searchView.QueryTextChange += SearchView_QueryTextChange;
searchView.ImeOptions = (int)ImeAction.Search;
searchView.InputType = (int)InputTypes.TextVariationFilter;
searchView.MaxWidth = int.MaxValue;
}
}
}
private void SearchView_QueryTextChange(object sender, Android.Support.V7.Widget.SearchView.QueryTextChangeEventArgs e)
{
if (Element is ISearchPage searchPage)
searchPage.OnSearchBarTextChanged(e.NewText);
}
private static Android.Support.V7.Widget.Toolbar GetToolbar() => (CrossCurrentActivity.Current?.Activity as MainActivity)?.FindViewById<Android.Support.V7.Widget.
Toolbar>(lbar);    }
添加Xml⽂件引⽤SearchView
创建l
在Android的Resources⽂件夹中, 创建menu⽂件夹创建l⽂件, 如下:
<?xml version="1.0" encoding="utf-8" ?>
<menu xmlns:android="schemas.android/apk/res/android"
xmlns:app="schemas.android/apk/res-auto">
<item android:id="@+id/action_search"
android:title="Search"
android:icon="@android:drawable/ic_menu_search"
app:showAsAction="always|collapseActionView"
app:actionViewClass="android.support.v7.widget.SearchView"/>
</menu>
添加NuGet:Plugin.CurrentActivity
在Android项⽬中, 添加NuGet包: Plugin.CurrentActivity , 并且在SearchPageRender 中引⽤它。页⾯实现接⼝ ISearchPage
渲染器添加实现页
如下图所⽰, 第⼀个typeof 指向的就是实现搜索内容页的Page
MainActivity初始化
在MainActivity的 OnCreate 中, 添加初始化的代码, 如下:
以上步骤完整之后, 通过导航页打开的页⾯即可⾃带搜索功能。
到此这篇关于为Xamarin.Forms的导航栏增加搜索功能的⽂章就介绍到这了。希望对⼤家的学习有所帮助，也希望⼤家多多⽀持。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。