Grid icon indicating copy to clipboard operation
Grid copied to clipboard

Nested grid issue with rowspan

Open t9mike opened this issue 4 years ago • 1 comments

I am using two Grids inside another grid. Seems OK, except when I try to use rowspan inside of one of the inner grids. Here is general layout:

image

Here is the code:

import SwiftUI
import ExyteGrid

struct GridIssue1View: View
{
    
    var body: some View
    {
        let dials_view = Color.purple

        Grid(tracks: [
            .fr(0.5), // dials
            .fr(0.5), // grid with times
        ], flow:.columns, spacing: 0)
        {
            // Grid2
            Grid(tracks: [
                .fr(1), // purple
                .fit, // label
                .fit, // value
            ], spacing: 3)
            {
                dials_view
                    .aspectRatio(1, contentMode: .fit)
                    .gridStart(column: 0, row:0)
//                    .gridSpan(row: 3)
                
                Text("G2.1")
                    .gridStart(column: 1, row:1)
                Text("A")
                    .gridStart(column: 2, row:1)

                Text("G2.2")
                    .gridStart(column: 1, row:1)
                Text("B")
                    .gridStart(column: 2, row:1)
                
                Text("G2.3")
                    .gridStart(column: 1, row:2)
                Text("C")
                    .gridStart(column: 2, row:2)
             }
            .background(Color.yellow)

            // Grid3
            Grid(tracks: [
                .fit, // +1
                .fit, // rise
                .fit, // 0,3,6,9
                .fit, // set
                .fit // +1
            ], spacing: 3)
            {
                GridGroup
                {
                    Text("+")
                    Text("1")
                    Text(" 0°")
                    Text("2")
                    Text("+")

                }

                GridGroup
                {
                    Text("+")
                    Text("3")
                    Text(" 0°")
                    Text("4")
                    Text("+")
                }

                GridGroup
                {
                    Text("+")
                    Text("5")
                    Text(" 0°")
                    Text("6")
                    Text("+")
                }
                
                GridGroup
                {
                    Text("+")
                    Text("7")
                    Text(" 0°")
                    Text("8")
                    Text("+")
                }
            }
        }
        .background(Color.gray)
        .padding(8)

    }
}

struct GridIssue1View_Previews: PreviewProvider {
    static var previews: some View {
        GridIssue1View()
    }
}

With gridSpan commented out, the purple block is OK and just taking up one row since I don't have the rowspan active:

image

But when I add the rowspan, the layout in the outer grid shifts to being 2x1:

image

I would have expected:

image

This just may not be supported but I wanted to check in. Thanks so much.

t9mike avatar Dec 13 '20 22:12 t9mike

I confirm the bug. Looks like preferences (GridPreferenceKey) leak from the inner Grid to the external one.

denis-obukhov avatar Dec 15 '20 07:12 denis-obukhov