Perbatasan duplikat SwiftUI di VStack / HStack

Aug 18 2020

Saya memiliki banyak ubin Lihat di HStack dan VStack. Setiap ubin harus memiliki batas di sekelilingnya. Masalah yang saya hadapi adalah, saya tidak ingin ada spasi di Stack saya. Namun, hal itu menghasilkan batas duplikat saat Tampilan diletakkan di samping satu sama lain.

Inilah contoh saya:

struct TileMain: View {
    
    var body: some View {

        VStack
        {
            HStack(spacing: 0.0)
            {
                Tile()
                    .border(Color.red, width: 1.0)
                Tile()
                    .border(Color.red, width: 1.0)
                Tile()
                    .border(Color.red, width: 1.0)
            }
            HStack(spacing: 0.0)
            {
                Tile()
                .border(Color.red, width: 1.0)

                Tile()
                    .border(Color.red, width: 1.0)
                
                Tile()
                    .border(Color.red, width: 1.0)
            }
            .padding(.bottom, 15)
        }
    }
}
struct Tile : View
{
    var body: some View
    {
        VStack
        {
            Spacer()
            Text("Test")
            Spacer()
        }.frame(width: 150, height: 150)
    }
}

Perbatasan di bagian bawah memiliki lebar 1,0. Namun, di mana pun ada tetangga, batasnya akan menjadi 2,0 lebar. Apakah ada solusi untuk itu? Saya perlu mengatur batas hanya pada tepi khusus, jadi saya tidak mendapatkan duplikasi apa pun. Tapi itu tidak mungkin default saya di SwiftUI.

Jawaban

1 Asperi Aug 18 2020 at 15:32

Mari kita jungkir balikkan pikiran kita ... dan gunakan sesuatu seperti berikut ini

Diuji dengan Xcode 11.4 / macOS 10.15.6

struct TileMain: View {

    var body: some View {

        VStack(spacing: 1)
        {
            HStack(spacing: 1)
            {
                Tile()
                Tile()
                Tile()
            }
            HStack(spacing: 1)
            {
                Tile()
                Tile()
                Tile()
            }
        }
        .padding(1)
        .background(Color.red)
    }
}
struct Tile : View
{
    var body: some View
    {
        VStack
        {
            Spacer()
            Text("Test")
            Spacer()
        }.frame(width: 150, height: 150)
        .background(Color(NSColor.windowBackgroundColor))
    }
}
1 lvollmer Aug 19 2020 at 14:34

Anda dapat menggunakan spasi: -1.0 (atau berapapun lebar bingkai Anda) :)

struct TileMain: View {
  var body: some View {
    VStack(spacing: -1.0)
    {
      HStack(spacing: -1.0)
      {
        Tile()
          .border(Color.red, width: 1.0)
        Tile()
          .border(Color.red, width: 1.0)
        Tile()
          .border(Color.red, width: 1.0)
      }
      HStack(spacing: -1.0)
      {
        Tile()
        .border(Color.red, width: 1.0)
        Tile()
          .border(Color.red, width: 1.0)
        Tile()
          .border(Color.red, width: 1.0)
      }
      .padding(.bottom, 15)
    }
  }

}