如何在 swift 中居中弹出概览
how to center a popoverview in swift
我有以下代码来显示没有箭头的弹出视图(对话框),效果很好。唯一的问题是,对话框显示在左上角 (IPad)。我想让视图在屏幕上居中。
要在我的以下代码中更改或添加什么? :
func show_help(){
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let controller = storyboard.instantiateViewControllerWithIdentifier("Help") as! UIViewController
controller.modalPresentationStyle = UIModalPresentationStyle.popover
let popoverPresentationController = controller.popoverPresentationController
// result is an optional (but should not be nil if modalPresentationStyle is popover)
if let _popoverPresentationController = popoverPresentationController {
// set the view from which to pop up
_popoverPresentationController.sourceView = self.view;
_popoverPresentationController.permittedArrowDirections = UIPopoverArrowDirection.allZeros;
// present (id iPhone it is a modal automatic full screen)
self.presentViewController(controller, animated: true, completion: nil)
}
}
附加信息
在我看来,这与我的 viewcontroller 相关联,我这样设置首选尺寸:
override func viewDidLoad() {
let dialogheigth:CGFloat = self.view.frame.height * 0.5;
let dialogwidth:CGFloat = self.view.frame.width * 0.5;
self.preferredContentSize = CGSizeMake(dialogwidth,dialogheigth);
}
在iOS8中,您不需要使用self.view.frame
来计算宽度和高度。
您可以使用以下方式设置对话框的高度和宽度:
override func viewDidLoad() {
var frameSize: CGPoint = CGPointMake(UIScreen.mainScreen().bounds.size.width*0.5, UIScreen.mainScreen().bounds.size.height*0.5)
self.preferredContentSize = CGSizeMake(frameSize.x,frameSize.y);
}
已编辑:
您也可以设置contentSizeForViewInPopover
如下:
self.contentSizeForViewInPopover = CGSizeMake(320.0, 360.0)
让我知道这有帮助吗?
您需要为弹出窗口提供源矩形。
来自 Apple 文档:源矩形是指定视图中用于锚定弹出框的矩形。将此 属性 与 sourceView 属性 结合使用以指定弹出窗口的锚点位置。
在你的情况下,
_popoverPresentationController.sourceView = self.view;
添加:
_popoverPresentationController.sourceRect = CGRectMake(CGRectGetMidX(self.view.bounds), CGRectGetMidY(self.view.bounds),0,0)
它会成功的!
基本上包括三个步骤(iOS 8):
1.- Present the view:
比方说,您想显示一个自定义视图以请求用户评论。这里的函数 loadNibForRate()
returns 是从其 nib 加载的 RateDialog
的一个实例, 但您可以在此处使用任何您希望找到 UIViewController
的方式
private static func presentCustomDialog(parent: RateDialogParent) -> Bool {
/// Loads the rateDialog from its xib, handled this way for further customization if desired
if let rateDialog = loadNibForRate() {
rateDialog.modalPresentationStyle = UIModalPresentationStyle.Popover
rateDialog.modalTransitionStyle = UIModalTransitionStyle.CrossDissolve
let x = parent.view.center
let sourceRectX : CGFloat
//Here we check for the orientation of the device, just to know if we are on an iPad
let maximumDim = max(UIScreen.mainScreen().bounds.height, UIScreen.mainScreen().bounds.width)
if maximumDim == 1024 { //iPad
sourceRectX = x.x
}else {
sourceRectX = 0
}
rateDialog.popoverPresentationController?.sourceView = parent.view
rateDialog.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection.allZeros
rateDialog.popoverPresentationController?.sourceRect = CGRectMake(sourceRectX, x.y, 0, 0)
rateDialog.popoverPresentationController?.popoverLayoutMargins = UIEdgeInsetsMake(0, 0, 0, 0)
rateDialog.popoverPresentationController?.delegate = parent
rateDialogParent = parent
callFunctionAsync() {
parent.presentViewController(rateDialog, animated: true, completion: nil)
}
return true
}
return false
}
2.- If we rotate our device, then the popover will not know where to reposition itself, unless we have this on the parent
RateDialogParent
public class RateDialogParent: UIViewController, UIPopoverPresentationControllerDelegate {
/**
This function guarantees that the RateDialog is alwas centered at parent, it locates the RateDialog's view by searching for its tag (-555)
*/
public func popoverPresentationController(popoverPresentationController: UIPopoverPresentationController, willRepositionPopoverToRect rect: UnsafeMutablePointer<CGRect>, inView view: AutoreleasingUnsafeMutablePointer<UIView?>) {
if popoverPresentationController.presentedViewController.view.tag == RateDialog.thisViewTag {
let x = popoverPresentationController.presentingViewController.view.center
let newRect = CGRectMake(x.x, x.y, 0, 0)
rect.initialize(newRect)
}
}
}
3.- Your RateDialog
should have a tag setted, this is just to avoid relocating unwanted popovers if there is more that one presented
from your RateDialogParent
class RateDialog: UIViewController {
@IBOutlet weak var reviewTitle: UILabel!
@IBOutlet weak var reviewMessage : UILabel!
@IBOutlet weak var cancelButtonTitle: UIButton!
@IBOutlet weak var remindButtonTitle : UIButton!
@IBOutlet weak var rateButtonTitle : UIButton!
/// For being able to locate this view
static let thisViewTag = -555
override func viewDidLoad() {
super.viewDidLoad()
//sets the tag to identify this view
self.view.tag = RateDialog.thisViewTag
}
}
这是一个使用 Swift 3
的实现
let popover = storyboard?.instantiateViewController(withIdentifier: "popover") as! PopoverVC
popover.modalPresentationStyle = UIModalPresentationStyle.popover
popover.popoverPresentationController?.backgroundColor = UIColor.green
popover.popoverPresentationController?.delegate = self
popover.popoverPresentationController?.sourceView = self.view
popover.popoverPresentationController?.sourceRect = CGRect(x: self.view.bounds.midX, y: self.view.bounds.midY, width: 0, height: 0)
popover.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
self.present(popover, animated: true)
基于伊斯特万的
Swift 3 (Xcode 8, iOS 9) 的另一种方式是这样的:
从某处调用:
self.performSegue(withIdentifier: "showPopupSegue", sender: yourButton)
在触发 segue 之前调用的函数:
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if let popoverPresentationController = segue.destination.popoverPresentationController {
let controller = popoverPresentationController
controller.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
controller.sourceView = self.view
controller.sourceRect = CGRect(x: UIScreen.main.bounds.width * 0.5 - 200, y: UIScreen.main.bounds.height * 0.5 - 100, width: 400, height: 200)
segue.destination.preferredContentSize=CGSize(width: 400, height: 200)
}
}
记得将故事板 segue 的 Kind 属性设置为 "Present as Popover" 并将 Anchor 属性设置为您之前的视图控制器中的任何视图。
Swift 4 实施:
popover.popoverPresentationController?.sourceRect = CGRect(x: view.center.x, y: view.center.y, width: 0, height: 0)
popover.popoverPresentationController?.sourceView = view
popover.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
如果对任何人有帮助,我已经在 UIViewController 上创建了一个扩展
extension UIViewController{
func configureAsPopoverAndPosition(withWidthRatio widthRatio:CGFloat,
heightRatio:CGFloat){
modalPresentationStyle = .popover
let screenWidth = UIScreen.main.bounds.width
let screenHeight = UIScreen.main.bounds.height
let popover = popoverPresentationController
popover?.sourceView = self.view
popover?.permittedArrowDirections = [UIPopoverArrowDirection(rawValue: 0)]
preferredContentSize = CGSize(width: (screenWidth * widthRatio),
height: (screenHeight * heightRatio))
popover?.sourceRect = CGRect(x: view.center.x,
y: view.center.y,
width: 0,
height: 0)
}
}
用法:
if UIDevice.current.userInterfaceIdiom == .pad{
yourViewController.configureAsPopoverAndPosition(withWidthRatio: 0.7 /*Make view controller width 70 % of screen width*/,
heightRatio: 0.7/*Make view controller height 70 % of screen height*/)
}
这将在屏幕中央显示弹出窗口。
Swift 中心 Popover 控制器的 4 个实现
let navigationController = UINavigationController(rootViewController: controller)
navigationController.modalPresentationStyle = .popover
navigationController.modalPresentationStyle = UIModalPresentationStyle.popover
let popover = navigationController.popoverPresentationController
controller.preferredContentSize = CGSize(width:500,height:600) //manage according to Device like iPad/iPhone
popover?.delegate = self
popover?.sourceView = self.view
popover?.sourceRect = CGRect(x: view.center.x, y: view. .y, width: 0, height: 0)
popover?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
self.present(navigationController, animated: true, completion: nil)
Swift 4.1
这是简单的解决方案:
取一个public变量var popover
var popover: UIPopoverPresentationController?
将 YourViewController
作为弹出窗口,使用下面提到的 popover?.sourceRect
。
let storyboard: UIStoryboard = UIStoryboard(name: "YOUR_STORYBOARD", bundle: nil)
let vc = storyboard.instantiateViewController(withIdentifier: "YOUR_IDENTIFIER") as! YourViewController
let navController = UINavigationController(rootViewController: vc)
navController.modalPresentationStyle = UIModalPresentationStyle.popover
popover = yourController.popoverPresentationController!
popover?.sourceRect = CGRect(x: UIScreen.main.bounds.midX, y: UIScreen.main.bounds.midY, width: 0, height: 0)
popover?.sourceView = self.view
popover?.delegate = self
popover?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
vc.preferredContentSize = CGSize(width: width, height: height)
self.present(navController, animated: true, completion: nil)
使用 viewWillTransition
进行横向和纵向视图转换。
override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
popover?.sourceRect = CGRect(x: UIScreen.main.bounds.midX, y: UIScreen.main.bounds.midY, width: 0, height: 0)
}
这将使您的弹出窗口在横向和纵向屏幕上都居中对齐。 iPad.
使用拆分视图时更加灵活
添加下面提到的代码行使其居中。
popoverController.popoverPresentationController?.sourceView = view
popoverController.popoverPresentationController?.sourceRect = view.bounds
我有以下代码来显示没有箭头的弹出视图(对话框),效果很好。唯一的问题是,对话框显示在左上角 (IPad)。我想让视图在屏幕上居中。
要在我的以下代码中更改或添加什么? :
func show_help(){
let storyboard = UIStoryboard(name: "Main", bundle: nil)
let controller = storyboard.instantiateViewControllerWithIdentifier("Help") as! UIViewController
controller.modalPresentationStyle = UIModalPresentationStyle.popover
let popoverPresentationController = controller.popoverPresentationController
// result is an optional (but should not be nil if modalPresentationStyle is popover)
if let _popoverPresentationController = popoverPresentationController {
// set the view from which to pop up
_popoverPresentationController.sourceView = self.view;
_popoverPresentationController.permittedArrowDirections = UIPopoverArrowDirection.allZeros;
// present (id iPhone it is a modal automatic full screen)
self.presentViewController(controller, animated: true, completion: nil)
}
}
附加信息
在我看来,这与我的 viewcontroller 相关联,我这样设置首选尺寸:
override func viewDidLoad() {
let dialogheigth:CGFloat = self.view.frame.height * 0.5;
let dialogwidth:CGFloat = self.view.frame.width * 0.5;
self.preferredContentSize = CGSizeMake(dialogwidth,dialogheigth);
}
在iOS8中,您不需要使用self.view.frame
来计算宽度和高度。
您可以使用以下方式设置对话框的高度和宽度:
override func viewDidLoad() {
var frameSize: CGPoint = CGPointMake(UIScreen.mainScreen().bounds.size.width*0.5, UIScreen.mainScreen().bounds.size.height*0.5)
self.preferredContentSize = CGSizeMake(frameSize.x,frameSize.y);
}
已编辑:
您也可以设置contentSizeForViewInPopover
如下:
self.contentSizeForViewInPopover = CGSizeMake(320.0, 360.0)
让我知道这有帮助吗?
您需要为弹出窗口提供源矩形。
来自 Apple 文档:源矩形是指定视图中用于锚定弹出框的矩形。将此 属性 与 sourceView 属性 结合使用以指定弹出窗口的锚点位置。
在你的情况下,
_popoverPresentationController.sourceView = self.view;
添加:
_popoverPresentationController.sourceRect = CGRectMake(CGRectGetMidX(self.view.bounds), CGRectGetMidY(self.view.bounds),0,0)
它会成功的!
基本上包括三个步骤(iOS 8):
1.- Present the view:
比方说,您想显示一个自定义视图以请求用户评论。这里的函数 loadNibForRate()
returns 是从其 nib 加载的 RateDialog
的一个实例, 但您可以在此处使用任何您希望找到 UIViewController
private static func presentCustomDialog(parent: RateDialogParent) -> Bool {
/// Loads the rateDialog from its xib, handled this way for further customization if desired
if let rateDialog = loadNibForRate() {
rateDialog.modalPresentationStyle = UIModalPresentationStyle.Popover
rateDialog.modalTransitionStyle = UIModalTransitionStyle.CrossDissolve
let x = parent.view.center
let sourceRectX : CGFloat
//Here we check for the orientation of the device, just to know if we are on an iPad
let maximumDim = max(UIScreen.mainScreen().bounds.height, UIScreen.mainScreen().bounds.width)
if maximumDim == 1024 { //iPad
sourceRectX = x.x
}else {
sourceRectX = 0
}
rateDialog.popoverPresentationController?.sourceView = parent.view
rateDialog.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection.allZeros
rateDialog.popoverPresentationController?.sourceRect = CGRectMake(sourceRectX, x.y, 0, 0)
rateDialog.popoverPresentationController?.popoverLayoutMargins = UIEdgeInsetsMake(0, 0, 0, 0)
rateDialog.popoverPresentationController?.delegate = parent
rateDialogParent = parent
callFunctionAsync() {
parent.presentViewController(rateDialog, animated: true, completion: nil)
}
return true
}
return false
}
2.- If we rotate our device, then the popover will not know where to reposition itself, unless we have this on the parent
RateDialogParent
public class RateDialogParent: UIViewController, UIPopoverPresentationControllerDelegate {
/**
This function guarantees that the RateDialog is alwas centered at parent, it locates the RateDialog's view by searching for its tag (-555)
*/
public func popoverPresentationController(popoverPresentationController: UIPopoverPresentationController, willRepositionPopoverToRect rect: UnsafeMutablePointer<CGRect>, inView view: AutoreleasingUnsafeMutablePointer<UIView?>) {
if popoverPresentationController.presentedViewController.view.tag == RateDialog.thisViewTag {
let x = popoverPresentationController.presentingViewController.view.center
let newRect = CGRectMake(x.x, x.y, 0, 0)
rect.initialize(newRect)
}
}
}
3.- Your
RateDialog
should have a tag setted, this is just to avoid relocating unwanted popovers if there is more that one presented from yourRateDialogParent
class RateDialog: UIViewController {
@IBOutlet weak var reviewTitle: UILabel!
@IBOutlet weak var reviewMessage : UILabel!
@IBOutlet weak var cancelButtonTitle: UIButton!
@IBOutlet weak var remindButtonTitle : UIButton!
@IBOutlet weak var rateButtonTitle : UIButton!
/// For being able to locate this view
static let thisViewTag = -555
override func viewDidLoad() {
super.viewDidLoad()
//sets the tag to identify this view
self.view.tag = RateDialog.thisViewTag
}
}
这是一个使用 Swift 3
的实现let popover = storyboard?.instantiateViewController(withIdentifier: "popover") as! PopoverVC
popover.modalPresentationStyle = UIModalPresentationStyle.popover
popover.popoverPresentationController?.backgroundColor = UIColor.green
popover.popoverPresentationController?.delegate = self
popover.popoverPresentationController?.sourceView = self.view
popover.popoverPresentationController?.sourceRect = CGRect(x: self.view.bounds.midX, y: self.view.bounds.midY, width: 0, height: 0)
popover.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
self.present(popover, animated: true)
基于伊斯特万的
Swift 3 (Xcode 8, iOS 9) 的另一种方式是这样的:
从某处调用:
self.performSegue(withIdentifier: "showPopupSegue", sender: yourButton)
在触发 segue 之前调用的函数:
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if let popoverPresentationController = segue.destination.popoverPresentationController {
let controller = popoverPresentationController
controller.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
controller.sourceView = self.view
controller.sourceRect = CGRect(x: UIScreen.main.bounds.width * 0.5 - 200, y: UIScreen.main.bounds.height * 0.5 - 100, width: 400, height: 200)
segue.destination.preferredContentSize=CGSize(width: 400, height: 200)
}
}
记得将故事板 segue 的 Kind 属性设置为 "Present as Popover" 并将 Anchor 属性设置为您之前的视图控制器中的任何视图。
Swift 4 实施:
popover.popoverPresentationController?.sourceRect = CGRect(x: view.center.x, y: view.center.y, width: 0, height: 0)
popover.popoverPresentationController?.sourceView = view
popover.popoverPresentationController?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
如果对任何人有帮助,我已经在 UIViewController 上创建了一个扩展
extension UIViewController{
func configureAsPopoverAndPosition(withWidthRatio widthRatio:CGFloat,
heightRatio:CGFloat){
modalPresentationStyle = .popover
let screenWidth = UIScreen.main.bounds.width
let screenHeight = UIScreen.main.bounds.height
let popover = popoverPresentationController
popover?.sourceView = self.view
popover?.permittedArrowDirections = [UIPopoverArrowDirection(rawValue: 0)]
preferredContentSize = CGSize(width: (screenWidth * widthRatio),
height: (screenHeight * heightRatio))
popover?.sourceRect = CGRect(x: view.center.x,
y: view.center.y,
width: 0,
height: 0)
}
}
用法:
if UIDevice.current.userInterfaceIdiom == .pad{
yourViewController.configureAsPopoverAndPosition(withWidthRatio: 0.7 /*Make view controller width 70 % of screen width*/,
heightRatio: 0.7/*Make view controller height 70 % of screen height*/)
}
这将在屏幕中央显示弹出窗口。
Swift 中心 Popover 控制器的 4 个实现
let navigationController = UINavigationController(rootViewController: controller)
navigationController.modalPresentationStyle = .popover
navigationController.modalPresentationStyle = UIModalPresentationStyle.popover
let popover = navigationController.popoverPresentationController
controller.preferredContentSize = CGSize(width:500,height:600) //manage according to Device like iPad/iPhone
popover?.delegate = self
popover?.sourceView = self.view
popover?.sourceRect = CGRect(x: view.center.x, y: view. .y, width: 0, height: 0)
popover?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
self.present(navigationController, animated: true, completion: nil)
Swift 4.1
这是简单的解决方案:
取一个public变量var popover
var popover: UIPopoverPresentationController?
将 YourViewController
作为弹出窗口,使用下面提到的 popover?.sourceRect
。
let storyboard: UIStoryboard = UIStoryboard(name: "YOUR_STORYBOARD", bundle: nil)
let vc = storyboard.instantiateViewController(withIdentifier: "YOUR_IDENTIFIER") as! YourViewController
let navController = UINavigationController(rootViewController: vc)
navController.modalPresentationStyle = UIModalPresentationStyle.popover
popover = yourController.popoverPresentationController!
popover?.sourceRect = CGRect(x: UIScreen.main.bounds.midX, y: UIScreen.main.bounds.midY, width: 0, height: 0)
popover?.sourceView = self.view
popover?.delegate = self
popover?.permittedArrowDirections = UIPopoverArrowDirection(rawValue: 0)
vc.preferredContentSize = CGSize(width: width, height: height)
self.present(navController, animated: true, completion: nil)
使用 viewWillTransition
进行横向和纵向视图转换。
override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to: size, with: coordinator)
popover?.sourceRect = CGRect(x: UIScreen.main.bounds.midX, y: UIScreen.main.bounds.midY, width: 0, height: 0)
}
这将使您的弹出窗口在横向和纵向屏幕上都居中对齐。 iPad.
使用拆分视图时更加灵活添加下面提到的代码行使其居中。
popoverController.popoverPresentationController?.sourceView = view
popoverController.popoverPresentationController?.sourceRect = view.bounds