在 Xamarin.Forms 中复制下拉 ToolbarItem "More"
Replicating the drop-down ToolbarItem "More" in Xamarin.Forms
当 ToolbarItem
的订单设置为 Secondary
for [=76= 时,我正在努力如何从 Xamarin.Forms
复制下拉菜单 ToolbarItem
],以便它看起来像 Android.
这里有一些图片可以更好地解释我在寻找什么:
如何在 Android 上运行:
- 代码:
ToolbarItem toolbarItem = new ToolbarItem()
{
Text = "ToolbarItem",
Order = ToolbarItemOrder.Secondary
};
- 关于它在 Android 上的外观的图像:
显示 "More" 图标的图片
显示 "More" 图标的图片已展开以显示更多工具栏项目
在iOS中将Order
设置为Secondary
时,工具栏上没有默认的"More"图标。取而代之的是,在导航栏下方创建了一个栏,其中包括所有工具栏项——这是我不希望我的应用程序拥有的东西。
这是之前在 IOS:
上如何实现的示例
我从实现此功能的一个应用程序中截取的屏幕截图
效果
在原生iOS中,您可以使用UIPopoverController来实现您的效果。但请注意,此控件只能在iPad.
中使用
由于您使用的是 Xamarin.Forms,我们可以在 iOS 平台中创建一个自定义渲染器来获取它。
首先,创建一个页面渲染器来显示UIPopoverController
。我们可以根据您的要求从 UIBarButtonItem 或 UIView 显示它。在这里我使用 UIBarButtonItem 像:
//I defined the navigateItem in the method ViewWillAppear
public override void ViewWillAppear(bool animated)
{
base.ViewWillAppear(animated);
rightItem = new UIBarButtonItem("More", UIBarButtonItemStyle.Plain, (sender, args) =>
{
UIPopoverController popView = new UIPopoverController(new ContentViewController());
popView.PopoverContentSize = new CGSize(200, 300);
popView.PresentFromBarButtonItem(rightItem, UIPopoverArrowDirection.Any, true);
});
NavigationController.TopViewController.NavigationItem.SetRightBarButtonItem(leftItem, true);
}
其次,在UIPopoverController中构建内容ViewController(就像android中的二级列表):
public class ContentViewController : UIViewController
{
public override void ViewDidLoad()
{
base.ViewDidLoad();
UITableView tableView = new UITableView(new CGRect(0, 0, 200, 300));
tableView.Source = new MyTableViewSource();
View.AddSubview(tableView);
}
}
public class MyTableViewSource : UITableViewSource
{
public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)
{
UITableViewCell cell = tableView.DequeueReusableCell(new NSString("Cell"));
if (cell == null)
{
cell = new UITableViewCell(UITableViewCellStyle.Default, new NSString("Cell"));
}
cell.TextLabel.Text = "Item" + indexPath.Row;
return cell;
}
public override nint RowsInSection(UITableView tableview, nint section)
{
return 10;
}
}
最后我们可以通过调用 PresentFromBarButtonItem
.
在屏幕上显示它
当 ToolbarItem
的订单设置为 Secondary
for [=76= 时,我正在努力如何从 Xamarin.Forms
复制下拉菜单 ToolbarItem
],以便它看起来像 Android.
这里有一些图片可以更好地解释我在寻找什么:
如何在 Android 上运行:
- 代码:
ToolbarItem toolbarItem = new ToolbarItem()
{
Text = "ToolbarItem",
Order = ToolbarItemOrder.Secondary
};
- 关于它在 Android 上的外观的图像:
显示 "More" 图标的图片
显示 "More" 图标的图片已展开以显示更多工具栏项目
在iOS中将Order
设置为Secondary
时,工具栏上没有默认的"More"图标。取而代之的是,在导航栏下方创建了一个栏,其中包括所有工具栏项——这是我不希望我的应用程序拥有的东西。
这是之前在 IOS:
上如何实现的示例我从实现此功能的一个应用程序中截取的屏幕截图 效果
在原生iOS中,您可以使用UIPopoverController来实现您的效果。但请注意,此控件只能在iPad.
中使用由于您使用的是 Xamarin.Forms,我们可以在 iOS 平台中创建一个自定义渲染器来获取它。
首先,创建一个页面渲染器来显示UIPopoverController
。我们可以根据您的要求从 UIBarButtonItem 或 UIView 显示它。在这里我使用 UIBarButtonItem 像:
//I defined the navigateItem in the method ViewWillAppear
public override void ViewWillAppear(bool animated)
{
base.ViewWillAppear(animated);
rightItem = new UIBarButtonItem("More", UIBarButtonItemStyle.Plain, (sender, args) =>
{
UIPopoverController popView = new UIPopoverController(new ContentViewController());
popView.PopoverContentSize = new CGSize(200, 300);
popView.PresentFromBarButtonItem(rightItem, UIPopoverArrowDirection.Any, true);
});
NavigationController.TopViewController.NavigationItem.SetRightBarButtonItem(leftItem, true);
}
其次,在UIPopoverController中构建内容ViewController(就像android中的二级列表):
public class ContentViewController : UIViewController
{
public override void ViewDidLoad()
{
base.ViewDidLoad();
UITableView tableView = new UITableView(new CGRect(0, 0, 200, 300));
tableView.Source = new MyTableViewSource();
View.AddSubview(tableView);
}
}
public class MyTableViewSource : UITableViewSource
{
public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)
{
UITableViewCell cell = tableView.DequeueReusableCell(new NSString("Cell"));
if (cell == null)
{
cell = new UITableViewCell(UITableViewCellStyle.Default, new NSString("Cell"));
}
cell.TextLabel.Text = "Item" + indexPath.Row;
return cell;
}
public override nint RowsInSection(UITableView tableview, nint section)
{
return 10;
}
}
最后我们可以通过调用 PresentFromBarButtonItem
.