SwiftUI – How to completely remove the horizontal “ghost lines” inside List with Section and custom rows?

Hi everyone, I’m working on a screen that uses a single SwiftUI List composed of:

  1. a top block (statistics, month picker, year selector, total, Entrata/Uscita picker).
  2. a list of transactions grouped by day, each group inside its own Section.
  3. each row is a fully custom card with rounded corners (RoundedCornerShape)

I’m correctly removing all separators using:

.listRowSeparator(.hidden)
.listSectionSeparator(.hidden)
.scrollContentBackground(.hidden)
.listStyle(.plain)

Each row is rendered like this:

TransazioneSwipeRowView(...)
.listRowInsets(EdgeInsets(top: 0, leading: 16, bottom: 0, trailing: 16))
.listRowBackground(Color.clear)

However, I still see thin horizontal lines appearing between:

  • the search bar and the top block
  • the top block and the start of the list
  • between rows inside the grouped section
  • sometimes at the bottom of a Section

These lines are NOT:

  • Divider()
  • system separators
  • backgrounds
  • row borders

They seem to be “ghost lines” automatically generated by SwiftUI’s List when multiple consecutive rows or sections are present.

Goal

I want to remove these lines completely while keeping:

  • native SwiftUI List
  • native scroll behavior
  • swipe-to-delete support
  • grouping by Section
  • custom card-like rows with rounded corners
  • transparent backgrounds

What I already tried

  • .plain, .grouped, .insetGrouped list styles
  • .listRowSeparator(.hidden) and .listSectionSeparator(.hidden)
  • .scrollContentBackground(.hidden)
  • clearing all backgrounds
  • adjusting/removing all padding and insets
  • Spacer(minLength: 0) experiments
  • rebuilding the layout using ScrollView + LazyVStack

(works perfectly — no lines — BUT loses native swipe-to-delete)

There are no Divider() calls anywhere, and no background colors producing borders.

Question

Is this a built-in behavior of SwiftUI’s List in .plain style when using multiple custom rows, or is there an officially supported way to eliminate these lines entirely?

Is there a recommended combination of modifiers to achieve:

  • a List with grouped Sections
  • fully custom rows with rounded backgrounds
  • absolutely no horizontal separators, even in the empty spaces between sections?

Any guidance, documented workarounds, WWDC references, or official recommendations would be greatly appreciated.

Thanks in advance!

Answered by darkpaw in 867713022

.listRowSeparator(.hidden) applies to a List's rows not the List itself.

Every row in the List you want to hide has to have .listRowSeparator(.hidden) on it. It's granular; it allows you to decide which rows do and do not have a separator on them.

Accepted Answer

.listRowSeparator(.hidden) applies to a List's rows not the List itself.

Every row in the List you want to hide has to have .listRowSeparator(.hidden) on it. It's granular; it allows you to decide which rows do and do not have a separator on them.

Thank you! Your explanation about .listRowSeparator(.hidden) being row-specific (and not global to the entire List) was exactly what I needed.

I was only applying:

.listRowSeparator(.hidden)
.listSectionSeparator(.hidden)

to the List itself, assuming it would hide all separators automatically — but as you pointed out, SwiftUI requires the modifier to be applied on every row.

What I did to fix it

I added:

.listRowSeparator(.hidden)

directly to each transaction row inside my custom content view:

ForEach(...) { ... }
    .listRowSeparator(.hidden)

Then I also added it to:

  • the header Section for each day
  • the top block inside ReportMensileView (statistics + month picker + total + picker)

This ensured that every row rendered by the List has the separator explicitly hidden.

Result

All the “mysterious horizontal lines” immediately disappeared, without breaking:

  • native List scrolling
  • swipe-to-delete
  • custom rounded card backgrounds
  • grouped Sections

Everything now renders perfectly clean.

Thanks again for pointing me in the right directio

Happy to help!

SwiftUI – How to completely remove the horizontal “ghost lines” inside List with Section and custom rows?
 
 
Q