Дублированная граница SwiftUI в VStack / HStack
У меня много плиток Просмотр в HStack и VStack. Каждая плитка должна иметь границу. Проблема, с которой я столкнулся, заключается в том, что я не хочу иметь пробелы в моем стеке. Однако это приводит к дублированию границ, поскольку View лежат рядом друг с другом.
Вот мой пример:
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)
}
}

Граница внизу имеет ширину 1.0. Однако везде, где есть сосед, ширина границы будет 2,0. Есть ли какое-то решение для этого? Мне нужно было бы установить границу только на специальных краях, чтобы не было дублирования. Но это невозможно по умолчанию в SwiftUI.
Ответы
Давайте перевернем наш разум ... и воспользуемся чем-то вроде следующего
Протестировано с 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.0 (или любую другую ширину вашей границы) :)
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)
}
}
}