通过 StoryBoard 在滚动视图中平移大图像

Posted 2023-03-29

【中文标题】通过 StoryBoard 在滚动视图中平移大图像

【英文标题】：Pan Large Image in Scrollview through StoryBoard

【发布时间】：2020-08-30 07:07:44

【问题描述】：

我正在构建一个应用程序，我想显示一个平面图，其中图像为 2952x3600，大于我的视图控制器的大小。我希望用户能够平移图像并放大和缩小，类似于地图在 Mapview 中的行为。

我能够使用以下代码以编程方式获得所需的结果。但是，我希望能够向图像添加按钮，并且在情节提要中这样做会更容易。如何在 Storyboard 中实现相同的结果？

class ViewController: UIViewController, UIScrollViewDelegate 
    var scrollView: UIScrollView!
    var imageView: UIImageView!

    override func viewDidLoad() 
        super.viewDidLoad()
        imageView = UIImageView(image: UIImage(named: "TorontoPATHNetworkMap_v.2018.08.pdf"))
        scrollView = UIScrollView(frame: view.bounds)
        scrollView.contentSize = imageView.bounds.size
        scrollView.addSubview(imageView)
        scrollView.delegate = self
        scrollView.minimumZoomScale = 0.3
        scrollView.maximumZoomScale = 5
        view.addSubview(scrollView)
    

    func viewForZooming(in scrollView: UIScrollView) -> UIView? 
        return imageView
    

【问题讨论】：

"...给图片添加按钮..." 用什么方法？您想要在缩放和移动图像时缩放和移动的按钮吗？还是您希望它们“浮动”在滚动视图框架内（如“+ - 缩放控件”）？而且，为什么您认为在 Storyboard 中添加按钮会更容易？

我想要在缩放和移动图像时缩放和移动的按钮。我认为这会更容易，因为我有大量按钮可以添加到比我的视图控制器大的图像中。

【参考方案1】：

如果您想添加其他 UI 元素（按钮、标签、子视图等）并在滚动视图内容缩放时让它们缩放和移动，您有几个选择：

1) 在代码中添加按钮作为图像视图的子视图。它们将随着图像视图移动/调整大小。

2) 如果您发现在视觉上布局按钮更容易，您可以在 Storyboard / Interface Builder 中进行布局。但是，在 IB 中，您不能将子视图添加到 UIImageView，因此您需要将图像视图和按钮嵌入“容器”UIView。然后在你的控制器类中从viewForZooming返回container view

---

编辑

这是在 Storyboard / IB 中设置视图的示例：https://github.com/DonMag/PDFImagePanZoom

【讨论】：

我想直观地布局我的按钮。使用我当前的代码，图像不会显示在情节提要上，因此我看不到要放置按钮的位置。当我将相同的图像添加到情节提要中的图像视图时，它会作为副本显示在我的代码中的图像视图下方。

@Sal - 您可以发布指向您的“TorontoPATHNetworkMap_v.2018.08.pdf”文件的链接吗？我可以告诉你如何做你想做的事。

太棒了！这是文件的链接-torontofinancialdistrict.com/wp-content/uploads/2018/12/…

@Sal - 在你的问题中，你说 "display a floor plan where the image is 1260 x 1000" ...但你提供的链接给了我一个 pdf 文件加载到2952 x 3600?

抱歉，我已经更新了问题。我无意中保留了占位符大小。