SwiftUI loading indicator placeholder hiding my list rows

Question

When my loading indicator placeholder LoadingPlaceholderView comes to view, it hides the whole list until it disappears. I want the list to be always visible during the LoadingPlaceholderView is in view. The LoadingPlaceholderView is in the correct position right now.

screenshot

var body: some View {
            VStack {
                List {
                    if viewModel.isLoading {
                        // Loading indicator view
                        LoadingPlaceholderView()
                            .frame(maxWidth: .infinity, maxHeight: .infinity)
                    } else {

                        ForEach(viewModel.posts) { post in
                            HStack(alignment: .top) {

                                displayImageView(for: post)
                                    .frame(width: 100, height: 100)
                                    .cornerRadius(10)

                                VStack(alignment: .leading, spacing: 4) {
                                    HStack {
                                        profilePictureView(for: post)
                                            .frame(width: 20, height: 20)

                                        Text(post.username)
                                            .font(.system(size: 12))
                                    }

                                    Text(post.caption)
                                        .font(.system(size: 10))
                                        .lineLimit(6)
                                        .truncationMode(.tail)
                                }
                            }
                            .onTapGesture {
                                self.selectedPost = post
                                self.isSheetPresented = true
                            }
                        }
                    }
                }
                .onAppear {
                    viewModel.checkClipboardAndUpdateContent()
                    NotificationCenter.default.addObserver(
                        forName: UIApplication.willEnterForegroundNotification,
                        object: nil,
                        queue: .main
                    ) { [weak viewModel] _ in
                        viewModel?.checkClipboardAndUpdateContent()
                    }
                }
            .sheet(isPresented: $isSheetPresented) {
                MediaPreviewSheet(post: $selectedPost)
                    .presentationBackground(.ultraThinMaterial)
                    .presentationDragIndicator(.visible)
                    .presentationCornerRadius(20)
                
            }
            .onAppear {
             viewModel.isLoading = true
             }
        }
    }

Any idea how to fix it? I tried moving it around the stack but can't seem to place it properly.

Answer 1

Right now your code is setup to show the LoadingPlaceholderView or the ForEach.

To show the LoadingPlaceholderView and the ForEach just remove the else.

The only thing that will be conditional is the LoadingPlaceholderView.