返回

自定义气泡效果更强的 iOS Popover

IOS

当构建一个功能复杂的iOS应用程序时,可能会需要在某一视图中显示额外的信息或选项。为此,可以选择使用Popover气泡组件,它会从另一个视图中弹出,展示详细信息。

Popover非常灵活,能够在内容、大小、外观以及内容布局方面进行自定义,为用户带来良好的视觉效果和使用体验。本文将详细介绍如何创建Popover,对其进行定制,并将其作为应用程序中的一部分进行使用。

基本Popover创建

1. 实例化一个Popover控制器

想要创建Popover,首先要创建一个Popover控制器(UIPopoverController)对象。它将管理Popover的显示和隐藏。

let popoverController = UIPopoverController(contentViewController: UIViewController())

2. 设置Popover的内容

接下来,需设置Popover的内容。这可以通过将一个视图控制器指定给Popover的contentViewController属性来实现。此视图控制器将包含Popover的内容。

popoverController.contentViewController = MyContentViewController()

3. 设置Popover的尺寸

Popover的默认尺寸为320 x 480像素。可以设置Popover的preferredContentSize属性来修改其尺寸。

popoverController.preferredContentSize = CGSize(width: 200, height: 250)

4. 显示Popover

最后,使用present(_:animated:permittedArrowDirections:animated:)方法来显示Popover。这个方法需要传入一个视图控制器,箭头方向以及是否使用动画显示Popover。

popoverController.present(from: barButtonItem, animated: true, permittedArrowDirections: .any, animated: true)

自定义Popover外观

默认情况下,Popover有一个简单的蓝色背景和一个标准的箭头。我们可以通过popoverBackgroundViewClass属性来自定义Popover的背景。此属性需要被指定为一个UIView子类的名称,该子类将用于创建Popover的背景视图。

popoverController.popoverBackgroundViewClass = MyCustomPopoverBackgroundView.self

也可以通过设置backgroundColor属性来更改Popover的背景颜色。

popoverController.backgroundColor = UIColor.green

添加关闭按钮

要为Popover添加一个关闭按钮,可以在Popover视图控制器(即contentViewController)的navigationItem属性中创建一个UIBarButtonItem,并将其指定给rightBarButtonItem属性。

let closeButton = UIBarButtonItem(title: "Close", style: .plain, target: self, action: #selector(closePopover))
self.navigationItem.rightBarButtonItem = closeButton

@objc func closePopover() {
    popoverController.dismiss(animated: true)
}

使用Popover

Popover可以用来显示各种类型的附加信息,比如详细说明、选项列表、甚至是整个视图控制器。它是一种非常灵活的UI组件,可以用来创建美观的用户界面。