Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Nested grid issue with rowspan #16

Open
t9mike opened this issue Dec 13, 2020 · 1 comment
Open

Nested grid issue with rowspan #16

t9mike opened this issue Dec 13, 2020 · 1 comment
Labels
bug Something isn't working confirmed

Comments

@t9mike
Copy link

t9mike commented Dec 13, 2020

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.

@denis-obukhov denis-obukhov added the bug Something isn't working label Dec 14, 2020
@denis-obukhov
Copy link
Collaborator

denis-obukhov commented Dec 15, 2020

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

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
bug Something isn't working confirmed
Projects
None yet
Development

No branches or pull requests

2 participants