2023年12月6日发(作者:)

SwiftUI基础之如何让图片铺满全屏幕

假设我们有个图片希望铺满全屏该如何操作呢?

首先设置背景

import SwiftUI

struct ContentView: View {

var body: some View {

VStack{

CircleImage(imageName: "lilly")

.frame(width:160,height:160)

.padding(.top,89)

.padding(.bottom,20)

}

.background(

Image("lotus")

.resizable()

.scaledToFill()

)

}

}

效果不尽人意,没有铺开

Jietu20200129-155328@

然后将容器撑满全屏

我们的可以使用Spacer()将VStack撑开

struct ContentView: View {

var body: some View {

VStack{

CircleImage(imageName: "lilly")

.frame(width:160,height:160)

.padding(.top,89)

.padding(.bottom,20)

Spacer()

}

.background(

Image("lotus")

.resizable()

.scaledToFill()

)

}

}

效果还可以,但是刘海儿和底部还没有铺上。

Jietu20200129-155413@

使用edgesIgnoringSafeArea 铺满整个屏幕

import SwiftUI

struct ContentView: View {

var body: some View {

VStack{

CircleImage(imageName: "lilly")

.frame(width:160,height:160)

.padding(.top,89)

.padding(.bottom,20)

Spacer()

}

.background(

Image("lotus")

.resizable()

.scaledToFill()

.edgesIgnoringSafeArea(.all)

)

}

}最终效果Jietu20200129-160228@更多SwiftUI教程和代码关注专栏请关注我的专栏icloudend, SwiftUI教程与源码/c/7b3e3b671970