Skip to content

Vertical Alignment does not work correctly #37

@Gernot

Description

@Gernot

If I try to align views using HFlow(alignment: .firstTextbaseline) it does not align correctly:

Image

Here's the code (in a Preview) and a comparison to HStack which does it correctly:

#Preview("HFlowTest") {

    let testContent = Group {
        Image(systemName: "lamp.desk")
        Image(systemName: "lightbulb.led")
            .font(.system(size: 100))
        Image(systemName: "lightbulb.led")
    }
    .overlay(alignment: .centerFirstTextBaseline) {
        Rectangle()
            .frame(height: 1)
            .foregroundStyle(.red)
    }

    VStack(alignment: .leading) {
        Text("HStack:").font(.caption).foregroundStyle(.secondary)
        HStack(alignment: .firstTextBaseline, spacing: 0) {
            testContent
        }
        Text("HFlow:").font(.caption).foregroundStyle(.secondary)
        HFlow(alignment: .firstTextBaseline, spacing: 0) {
            testContent
        }
    }
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions