SwiftUI 图片查看器

概述

一个使用 SwiftUI 构建的图片查看器。具有拖动关闭、捏合缩放、远程和本地图片等功能。

通过 Swift Package Manager 安装

File（文件） > Swift Packages > Add Package Dependency（添加包依赖）

https://github.com/Jake-Short/swiftui-image-viewer.git

使用方法

关于 NavigationView 的注意事项： .overlay 修饰符仅应用于它所应用的视图。因此，.overlay 修饰符必须应用于 NavigationView 才能出现在所有元素之上！如果它应用于子视图，它将出现在标题/导航按钮之下。

本地图片

image 参数在所有版本中都接受 Binding<Image>。从 1.0.20 开始，它也接受 Binding<Image?>

import ImageViewer

struct ContentView: View {
    @State var showImageViewer: Bool = true
    @State var image = Image("example-image")
	
    var body: some View {
        VStack {
            Text("Example!")
        }
	.frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewer(image: self.$image, viewerShown: self.$showImageViewer))
    }
}

远程图片

imageURL 参数接受 Binding<String>

import ImageViewerRemote

struct ContentView: View {
    @State var showImageViewer: Bool = true
    @State var imgURL: String = "https://..."
	
    var body: some View {
        VStack {
            Text("Example!")
        }
	.frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewerRemote(imageURL: self.$imgURL, viewerShown: self.$showImageViewer))
    }
}

自定义

关闭按钮位置

可用性：2.2.0 或更高版本

如果需要，可以将关闭按钮移动到右上角。 closeButtonTopRight 参数接受 bool。

示例

import ImageViewer

struct ContentView: View {
    @State var showImageViewer: Bool = true
    @State var image = Image("example-image")
    
    var body: some View {
        VStack {
            Text("Example!")
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewer(image: self.$image, viewerShown: self.$showImageViewer, closeButtonTopRight: true))
    }
}

标题

可用性：2.1.0 或更高版本

可以向图片查看器添加标题。标题将出现在图片查看器的底部附近（如果图片填充整个屏幕，则文本将出现在图片顶部）。 caption 参数接受 Text。

示例

import ImageViewer

struct ContentView: View {
    @State var showImageViewer: Bool = true
    @State var image = Image("example-image")
	
    var body: some View {
        VStack {
            Text("Example!")
        }
	.frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewer(image: self.$image, viewerShown: self.$showImageViewer, caption: Text("This is a caption!")))
    }
}

显式宽高比

可用性：1.0.21 或更高版本

可以指定显式图片宽高比，这修复了某些情况下出现的不正确拉伸的问题。 aspectRatio 参数接受 Binding<CGFloat>

示例

import ImageViewer

struct ContentView: View {
    @State var showImageViewer: Bool = true
    @State var image = Image("example-image")
	
    var body: some View {
        VStack {
            Text("Example!")
        }
	.frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewer(image: self.$image, viewerShown: self.$showImageViewer, aspectRatio: .constant(2)))
    }
}

禁用缓存

可用性：1.0.25 或更高版本

要禁用远程图片查看器上的缓存，只需将 Bool 值传递给 disableCache 参数

示例

import ImageViewerRemote

struct ContentView: View {
    @State var showImageViewer: Bool = true
	
    var body: some View {
        VStack {
            Text("Example!")
        }
	.frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewerRemote(imageURL: URL(string: "https://..."), viewerShown: self.$showImageViewer, disableCache: true))
    }
}

已弃用

HTTP Headers

可用性：1.0.15 到 1.0.25

已弃用：从 2.0.0 开始不再可用

远程图片查看器允许在 URL 请求中包含 HTTP 标头。要使用它们，请将字典传递给 httpHeaders 字段。格式应为 [Header: Value]，均为字符串。

示例

import ImageViewerRemote

struct ContentView: View {
    @State var showImageViewer: Bool = true
	
    var body: some View {
        VStack {
            Text("Example!")
        }
	.frame(maxWidth: .infinity, maxHeight: .infinity)
        .overlay(ImageViewerRemote(imageURL: URL(string: "https://..."), viewerShown: self.$showImageViewer, httpHeaders: ["X-Powered-By": "Swift!"]))
    }
}

兼容性

此软件包与 iOS 13 及更高版本兼容。

在 1.0.18 之前，此软件包使用 Swift 工具版本 5.2。如果您在尝试使用该软件包时收到错误，则您可能正在使用旧版本的 Xcode，应使用此软件包的 1.0.18 或更高版本。

从 1.0.18 及更高版本开始，此软件包使用 Swift 工具版本 5.1，从而允许与更多 Xcode 版本兼容。

许可证

本项目采用 MIT 许可证。

喜欢这个项目吗？

请考虑给它加个星标！