我在Assets.xcassets中有一个大图像。如何用SwiftUI调整这张图片的大小使它变小?

我试着设置框架,但它不起作用:

Image(room.thumbnailImage)
    .frame(width: 32.0, height: 32.0)

当前回答

您可以使用resized()属性,但请记住,您不能在普通修饰符中使用resized,因此您必须使用Image扩展来实现它。

extension Image {
    func customModifier() -> some View {
        self
            .resizable()
            .aspectRatio(contentMode: .fit)
    }

其他回答

默认情况下,图像视图会自动根据其内容调整自身大小,这可能会使它们超出屏幕。如果你添加了resized()修饰符,那么图像将自动调整大小,以填充所有可用空间:

Image("example-image")
    .resizable()

然而,这也可能导致图像的原始纵横比被扭曲,因为它将在所有维度上被拉伸,无论拉伸的量是多少,以填充空间。

如果你想保持它的纵横比,你应该添加一个aspectRatio修饰符,使用.fill或.fit,就像这样:

Image("example-image")
    .resizable()
    .aspectRatio(contentMode: .fit)

另一种方法是使用scaleEffect修饰符:

Image(room.thumbnailImage)
    .resizable()
    .scaleEffect(0.5)

在对图像应用任何大小修改之前,应该使用. resized()。

Image(room.thumbnailImage)
    .resizable()
    .frame(width: 32.0, height: 32.0)

您可以使用resized()属性,但请记住,您不能在普通修饰符中使用resized,因此您必须使用Image扩展来实现它。

extension Image {
    func customModifier() -> some View {
        self
            .resizable()
            .aspectRatio(contentMode: .fit)
    }

建议使用以下代码来匹配多个屏幕尺寸:

Image("dog")
    .resizable()
    .frame(minWidth: 200, idealWidth: 400, maxWidth: 600, minHeight: 100, idealHeight: 200, maxHeight: 300, alignment: .center)