减少部分 SwiftUI 之间的表单间距

Posted 2023-02-24

【中文标题】减少部分 SwiftUI 之间的表单间距

【英文标题】：Reduce Form spacing between sections SwiftUI

【发布时间】：2020-06-03 19:55:39

【问题描述】：

我正在尝试使用 SwiftUI 制作一个笔记应用程序，我想显示类似于 Apollo Reddit app 的笔记。

它显示帖子的方式并没有什么特别之处，它只是使用类似于GroupedListStyle() 列表的界面来显示帖子，但各部分之间的间距较小。

我尝试了很多技巧来减小这个间距，但似乎都没有效果。

TL;DR

我有这个：

我想要这个：

感谢任何帮助。提前致谢！

这是我的代码：

import SwiftUI

struct NotesView: View 

    let array = [
        Note(title: "Mi pana miguel letra", content:
        """
        [Intro: Keyan JRN & Producer Tag]
        El pana Miguel, yah, ey
        El pana Miguel, yah, ey (Snorkatje)
        Mi pana, mi pana, yeah
        Mi pana, mi pana, yeah
        Mi pana, mi pana, yeah, eh-eh
        Uh-uh-uh-uh-uh-uh

        [Estribillo]
        Ha-ha-hace un rato conocí al pana Miguel
        No-no voy a mentir, se ve bastante fresco
        (Ey, tío, ¿conoces a IlloJuan?) ¿Quién?
        (IlloJuan) No, que quién te ha preguntado (No-oh)
        Ha-hace un rato conocí al pana Miguel (Pana Miguel)
        No voy a mentir, se ve bastante fresco (Bastante fresco)
        Y el desgraciado de Matías que se vaya ya (Uh-uh, uh, uh)
        Prefiero quedarme aquí con mi pana, sentado
        """
        ),
        Note(title: "Note 02", content: "This is a test note."),
        Note(title: "Note 03", content: "This is a test note that is supposed to be longer than just 3 lines to test the note preview. Since I cba to write...")
    ]

    @ObservedObject var searchBar: SearchBar = SearchBar()

    var body: some View 

        NavigationView 

            List 

                if array.count > 0 
                    ForEach(
                        array.filter
                        
                            searchBar.text.isEmpty ||
                                $0.id.localizedStandardContains(searchBar.text)
                        ,
                        id: \.self
                    )  eachNote in

                        Section 
                            NoteView(note: eachNote)
                        .buttonStyle(PlainButtonStyle())

                    
                 else 

                    NavigationLink(destination: NotesTextEditor()) 
                        Text("Create a new post")
                    

                


            
            .listStyle(GroupedListStyle())

            .add(self.searchBar)

        

    

【参考方案1】：

可能的解决方案是使用自定义的 a-la 组分隔符，而不是标准。

在一些复制代码上使用 Xcode 11.4 / ios 13.4 进行测试。

List 
    ForEach(array.indices, id: \.self)  i in
        VStack(spacing: 0) 
            Text(self.array[i].title)
                .padding(.horizontal)
            Text(self.array[i].content)
                .padding(.horizontal)

            if i != self.array.count - 1  // don't show for last
                Rectangle().fill(Color(UIColor.systemGroupedBackground))
                   .frame(height: 16) // << fit as you need
            
        .listRowInsets(EdgeInsets()) // << avoid extra space
    
.listStyle(GroupedListStyle())