I have a bunch of high resolution images which come with the app.
Due to app’s size restrictions, I am providing a single image, instead of @3, @2, @1 images.
When I render them using
<code>VStack{
if let imageName = item.filename,
let bundlePath = Bundle.main.path(forResource: imageName, ofType: "jpg"),
let uiImage = UIImage(contentsOfFile: bundlePath) {
Image(uiImage:uiImage)
.resizable()
.cornerRadius(20)
.padding(.horizontal, 10)
.aspectRatio(contentMode: .fit)
Text("bla bla bla")
}
</code>
<code>VStack{
if let imageName = item.filename,
let bundlePath = Bundle.main.path(forResource: imageName, ofType: "jpg"),
let uiImage = UIImage(contentsOfFile: bundlePath) {
Image(uiImage:uiImage)
.resizable()
.cornerRadius(20)
.padding(.horizontal, 10)
.aspectRatio(contentMode: .fit)
Text("bla bla bla")
}
</code>
VStack{
if let imageName = item.filename,
let bundlePath = Bundle.main.path(forResource: imageName, ofType: "jpg"),
let uiImage = UIImage(contentsOfFile: bundlePath) {
Image(uiImage:uiImage)
.resizable()
.cornerRadius(20)
.padding(.horizontal, 10)
.aspectRatio(contentMode: .fit)
Text("bla bla bla")
}
the image is rendered with 1/3 of the screen width, even when its original resolution is enough to fit the whole screen.
I have also tried to pack the images inside an .xcassets
file and use
<code>VStack{
if let imageName = item.filename,
Image(imageName)
.resizable()
.cornerRadius(20)
.padding(.horizontal, 10)
.aspectRatio(contentMode: .fit)
Text("bla bla bla")
}
</code>
<code>VStack{
if let imageName = item.filename,
Image(imageName)
.resizable()
.cornerRadius(20)
.padding(.horizontal, 10)
.aspectRatio(contentMode: .fit)
Text("bla bla bla")
}
</code>
VStack{
if let imageName = item.filename,
Image(imageName)
.resizable()
.cornerRadius(20)
.padding(.horizontal, 10)
.aspectRatio(contentMode: .fit)
Text("bla bla bla")
}
I want to show the image to fill the entire width, minus 10 pt of margin on each side, proportional.
What seems to be the problem?