강의

멘토링

커뮤니티

Inflearn コミュニティ Q&A

olaaivl5974 のプロフィール画像
olaaivl5974

投稿した質問数

SwiftUI - iOS14パーフェクトガイド

2 Network Image

Network Image

作成

·

209

0

가르쳐  주시는대로 따라 만들고  있는데

user의 이름부분의 데이터는 잘 가져오는데   

Image load 부분에서 이미지가 오지않는경우는 어떻게 해야하나여? .resume도 하고.. 제가 봤을때는 아무 문제 없어 보이는데..  

혹시 파일 따로  받을수는 없나요?

iosSwiftUI

回答 2

1

강의에 나오는 url을 그대로 사용하면 사진이 로드되지않네요 
mockapi에서 새로 url 생성해서 사용하면 이미지 로드가 됩니다 ㅎㅎ

0

enilv0529님의 프로필 이미지
enilv0529
インストラクター

안녕하세요

파일은 따로 준비되어 있지 않습니다.

안되는 부분 올려주시면 한번 확인해 보겠습니다.

Tae hyun Kim님의 프로필 이미지
Tae hyun Kim
質問者

user 정보는 불러와 지는데 

avatar 이미지 불러오기는 안되는 상황입니다. 

어떻게 올려야할지를 모르겠어요 

enilv0529님의 프로필 이미지
enilv0529
インストラクター

이미지쪽 소스코드 긁어서 여기에 복사 붙여넣기 하시면 될 것 같습니다.

Tae hyun Kim님의 프로필 이미지
Tae hyun Kim
質問者

// Image

class ImageLoader: ObservableObject {

    

    // Fields

    @Published var image : UIImage?

    

    var urlString : String

    

    

    init(urlString: String) {

        self.urlString = urlString

        // URL 가져온후 function 호출

        self.loadImageFromURL()

    }

    

    

    func loadImageFromURL(){

        

        guard let url = URL(string: urlString) else {

            return

        }

        

        URLSession.shared.dataTask(with: url) { (data, response, error) in

            

            guard let hasData = data else {

                return

            }

            

            guard let loadImage = UIImage(data: hasData)else{

                return

            }

            

            // Background Thread 로 되면 안되서. 비동기 방식으로 해야함 _> self.image = loadImage 이거만 적으면 안됨.

            DispatchQueue.main.async {

                self.image = loadImage

                

            }

        }.resume()

       

    }

    

}

    

// Protocol

struct URLImage: View {

    

    @ObservedObject var loader: ImageLoader

    

    // 위의 function을 쓸려면 View에서 URL넣는게 강제사항이 되버리는 경우다.

    init(urlString : String) {

        self.loader = ImageLoader(urlString: urlString)

        

    }

    

    

    

    var body: some View{

        

        // image data를 받아오기전에 실패 해버렸을 경우 Optional

        Image(uiImage: loader.image ?? UIImage(named: "placeholderImage")! )

            .resizable()

            .aspectRatio(contentMode: .fit)

       

    }

}// Image

class ImageLoader: ObservableObject {

    

    // Fields

    @Published var image : UIImage?

    

    var urlString : String

    

    

    init(urlString: String) {

        self.urlString = urlString

        // URL 가져온후 function 호출

        self.loadImageFromURL()

    }

    

    

    func loadImageFromURL(){

        

        guard let url = URL(string: urlString) else {

            return

        }

        

        URLSession.shared.dataTask(with: url) { (data, response, error) in

            

            guard let hasData = data else {

                return

            }

            

            guard let loadImage = UIImage(data: hasData)else{

                return

            }

            

            // Background Thread 로 되면 안되서. 비동기 방식으로 해야함 _> self.image = loadImage 이거만 적으면 안됨.

            DispatchQueue.main.async {

                self.image = loadImage

                

            }

        }.resume()

       

    }

    

}

    

// Protocol

struct URLImage: View {

    

    @ObservedObject var loader: ImageLoader

    

    // 위의 function을 쓸려면 View에서 URL넣는게 강제사항이 되버리는 경우다.

    init(urlString : String) {

        self.loader = ImageLoader(urlString: urlString)

        

    }

    

    

    

    var body: some View{

        

        // image data를 받아오기전에 실패 해버렸을 경우 Optional

        Image(uiImage: loader.image ?? UIImage(named: "placeholderImage")! )

            .resizable()

            .aspectRatio(contentMode: .fit)

       

    }

}// Image

class ImageLoader: ObservableObject {

    

    // Fields

    @Published var image : UIImage?

    

    var urlString : String

    

    

    init(urlString: String) {

        self.urlString = urlString

        // URL 가져온후 function 호출

        self.loadImageFromURL()

    }

    

    

    func loadImageFromURL(){

        

        guard let url = URL(string: urlString) else {

            return

        }

        

        URLSession.shared.dataTask(with: url) { (data, response, error) in

            

            guard let hasData = data else {

                return

            }

            

            guard let loadImage = UIImage(data: hasData)else{

                return

            }

            

            // Background Thread 로 되면 안되서. 비동기 방식으로 해야함 _> self.image = loadImage 이거만 적으면 안됨.

            DispatchQueue.main.async {

                self.image = loadImage

                

            }

        }.resume()

       

    }

    

}

    

// Protocol

struct URLImage: View {

    

    @ObservedObject var loader: ImageLoader

    

    // 위의 function을 쓸려면 View에서 URL넣는게 강제사항이 되버리는 경우다.

    init(urlString : String) {

        self.loader = ImageLoader(urlString: urlString)

        

    }

    

    

    

    var body: some View{

        

        // image data를 받아오기전에 실패 해버렸을 경우 Optional

        Image(uiImage: loader.image ?? UIImage(named: "placeholderImage")! )

            .resizable()

            .aspectRatio(contentMode: .fit)

       

    }

}

////-----////-----////-----////-----////-----////-----////-----////-----////-----////-----

                                    ContentView

////-----////-----////-----////-----////-----////-----////-----////-----////-----////----

NavigationLink(

                                destination:

                                    UserDetailView(user: user),

                                label: {

                                    HStack

                                    {

                                        URLImage(urlString: user.avatar)

                                            .frame(width: /*@START_MENU_TOKEN@*/100/*@END_MENU_TOKEN@*/, height: /*@START_MENU_TOKEN@*/100/*@END_MENU_TOKEN@*/)

                                        

                                        Text("\(user.name)")

                                        Spacer()NavigationLink(

                                destination:

                                    UserDetailView(user: user),

                                label: {

                                    HStack

                                    {

                                        URLImage(urlString: user.avatar)

                                            .frame(width: /*@START_MENU_TOKEN@*/100/*@END_MENU_TOKEN@*/, height: /*@START_MENU_TOKEN@*/100/*@END_MENU_TOKEN@*/)

                                        

                                        Text("\(user.name)")

                                        Spacer()

enilv0529님의 프로필 이미지
enilv0529
インストラクター

안녕하세요

좀 확인을 해봤는데 제가 강의 예시로 든 mockapi 사이트의 image url이 제대로 나오질 않네요.

mockapi사이트를 무료로 테스트하면서 제한이 있는건가 싶네요.

코드상에서는 문제는 없는걸로 보입니다.

olaaivl5974 のプロフィール画像
olaaivl5974

投稿した質問数

質問する