### Configure Adaptive and Fixed Line Counts

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Shows how to use MasonryLines to control column counts with fixed, adaptive minimum/maximum width, or integer shorthand.

```swift
import SwiftUI
import SwiftUIMasonry

struct AdaptiveGridView: View {
    var body: some View {
        VStack(spacing: 20) {
            // Fixed 2 columns - always exactly 2 columns
            Text("Fixed 2 Columns")
            ScrollView(.vertical) {
                VMasonry(columns: .fixed(2), spacing: 8) {
                    sampleContent
                }
            }
            .frame(height: 200)

            // Adaptive with minimum width - columns are at least 100pt wide
            Text("Adaptive (min 100pt)")
            ScrollView(.vertical) {
                VMasonry(columns: .adaptive(minLength: 100), spacing: 8) {
                    sampleContent
                }
            }
            .frame(height: 200)

            // Adaptive with maximum width - columns are at most 150pt wide
            Text("Adaptive (max 150pt)")
            ScrollView(.vertical) {
                VMasonry(columns: .adaptive(maxLength: 150), spacing: 8) {
                    sampleContent
                }
            }
            .frame(height: 200)

            // Integer literal syntax (shorthand for .fixed)
            Text("Integer Literal (3 columns)")
            ScrollView(.vertical) {
                VMasonry(columns: 3, spacing: 8) {
                    sampleContent
                }
            }
            .frame(height: 200)
        }
        .padding()
    }

    @ViewBuilder
    var sampleContent: some View {
        ForEach(0..<12, id: \.self) { index in
            RoundedRectangle(cornerRadius: 8)
                .fill(Color.purple.opacity(0.3 + Double(index) * 0.05))
                .frame(height: CGFloat(60 + index * 10))
        }
    }
}
```

--------------------------------

### Create Flexible Axis Masonry Layout

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Demonstrates a responsive Masonry view that toggles between horizontal and vertical orientations.

```swift
import SwiftUI
import SwiftUIMasonry

struct FlexibleGalleryView: View {
    @State private var isVertical = true

    var body: some View {
        VStack {
            Toggle("Vertical Layout", isOn: $isVertical)
                .padding()

            ScrollView(isVertical ? .vertical : .horizontal) {
                Masonry(
                    isVertical ? .vertical : .horizontal,
                    lines: 3,
                    horizontalSpacing: 10,
                    verticalSpacing: 10
                ) {
                    ForEach(0..<15, id: \.self) { index in
                        RoundedRectangle(cornerRadius: 12)
                            .fill(Color.blue.opacity(Double(index + 5) / 20))
                            .frame(
                                width: isVertical ? nil : CGFloat.random(in: 60...120),
                                height: isVertical ? CGFloat.random(in: 60...120) : nil
                            )
                    }
                }
                .padding()
            }
        }
    }
}
```

--------------------------------

### Basic VMasonry Vertical Layout

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Demonstrates a basic vertical masonry layout using VMasonry with a fixed number of columns and spacing. Ensure child views have defined heights for proper layout.

```swift
import SwiftUI
import SwiftUIMasonry

struct PhotoGalleryView: View {
    let photos = [
        Photo(id: 1, height: 200, color: .red),
        Photo(id: 2, height: 150, color: .blue),
        Photo(id: 3, height: 250, color: .green),
        Photo(id: 4, height: 180, color: .orange),
        Photo(id: 5, height: 220, color: .purple),
        Photo(id: 6, height: 160, color: .pink)
    ]

    var body: some View {
        ScrollView(.vertical) {
            VMasonry(columns: 3, spacing: 8) {
                ForEach(photos) {
                    photo in
                    RoundedRectangle(cornerRadius: 8)
                        .fill(photo.color)
                        .frame(height: photo.height)
                }
            }
            .padding()
        }
    }
}

struct Photo: Identifiable {
    let id: Int
    let height: CGFloat
    let color: Color
}
```

--------------------------------

### Implement Masonry

Source: https://github.com/ciaranrobrien/swiftuimasonry/blob/main/README.md

Arranges children in a masonry layout with a specified axis and number of lines.

```swift
ScrollView(.vertical) {
    Masonry(.vertical, lines: 2) {
        //Masonry content
    }
}
```

--------------------------------

### Control Masonry Item Placement Mode

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Use the `.masonryPlacementMode` modifier to switch between `.fill` (default, optimal packing) and `.order` (strict view tree order) placement strategies. This is useful for controlling the visual flow and density of items.

```swift
import SwiftUI
import SwiftUIMasonry

struct PlacementModeDemo: View {
    @State private var useFillMode = true

    var body: some View {
        VStack {
            Toggle("Fill Mode", isOn: $useFillMode)
                .padding()

            Text(useFillMode ? "Items fill available space" : "Items follow strict order")
                .font(.caption)
                .foregroundColor(.secondary)

            ScrollView(.vertical) {
                VMasonry(columns: 3, spacing: 8) {
                    ForEach(0..<10, id: \.self) {
                        index in
                        VStack {
                            Text("\(index + 1)")
                                .font(.headline)
                        }
                        .frame(maxWidth: .infinity)
                        .frame(height: CGFloat(80 + (index % 3) * 40))
                        .background(Color.blue.opacity(0.2 + Double(index) * 0.08))
                        .cornerRadius(8)
                    }
                }
                .masonryPlacementMode(useFillMode ? .fill : .order)
                .padding()
            }
        }
    }
}
```

--------------------------------

### VMasonry with Data Source and Column Span

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Shows how to use VMasonry directly with a data collection and implement column spanning for featured items. This requires the data items to conform to Identifiable.

```swift
import SwiftUI
import SwiftUIMasonry

struct ProductGridView: View {
    let products: [Product] = [
        Product(id: "1", name: "Featured Item", isFeatured: true),
        Product(id: "2", name: "Regular Item", isFeatured: false),
        Product(id: "3", name: "Regular Item", isFeatured: false),
        Product(id: "4", name: "Featured Item", isFeatured: true),
        Product(id: "5", name: "Regular Item", isFeatured: false)
    ]

    var body: some View {
        ScrollView(.vertical) {
            VMasonry(
                columns: 3,
                horizontalSpacing: 12,
                verticalSpacing: 16,
                data: products
            ) {
                product in
                ProductCard(product: product)
            } columnSpan: {
                product in
                // Featured products span 2 columns
                product.isFeatured ? .fixed(2) : .fixed(1)
            }
            .padding()
        }
    }
}

struct Product: Identifiable {
    let id: String
    let name: String
    let isFeatured: Bool
}

struct ProductCard: View {
    let product: Product

    var body: some View {
        VStack {
            RoundedRectangle(cornerRadius: 12)
                .fill(product.isFeatured ? Color.blue : Color.gray)
                .frame(height: product.isFeatured ? 200 : 120)
            Text(product.name)
                .font(.caption)
        }
    }
}
```

--------------------------------

### Configure Custom Horizontal and Vertical Spacing

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Customize the gaps between masonry items by providing distinct `horizontalSpacing` and `verticalSpacing` values to the VMasonry initializer. This allows for precise control over the layout's visual density.

```swift
import SwiftUI
import SwiftUIMasonry

struct CustomSpacingView: View {
    var body: some View {
        ScrollView(.vertical) {
            VMasonry(
                columns: 3,
                horizontalSpacing: 4,   // Tight horizontal gaps
                verticalSpacing: 16     // Generous vertical gaps
            ) {
                ForEach(0..<15, id: \.self) {
                    index in
                    VStack {
                        Image(systemName: "photo")
                            .font(.largeTitle)
                        Text("Item \(index + 1)")
                            .font(.caption)
                    }
                    .frame(maxWidth: .infinity)
                    .frame(height: CGFloat.random(in: 100...180))
                    .background(Color.gray.opacity(0.2))
                    .cornerRadius(8)
                }
            }
            .padding()
        }
    }
}
```

--------------------------------

### Data-Driven Masonry with Identifiable Types

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Use Identifiable data types with VMasonry for automatic ID usage, simplifying initialization and enabling efficient diffing for animations. Featured articles can span multiple columns.

```swift
import SwiftUI
import SwiftUIMasonry

struct ArticleFeedView: View {
    @State private var articles: [Article] = [
        Article(title: "Breaking News", category: .featured, imageHeight: 200),
        Article(title: "Tech Update", category: .tech, imageHeight: 120),
        Article(title: "Sports Highlights", category: .sports, imageHeight: 150),
        Article(title: "Special Report", category: .featured, imageHeight: 180),
        Article(title: "Weather Forecast", category: .general, imageHeight: 100),
        Article(title: "Market Analysis", category: .tech, imageHeight: 140)
    ]

    var body: some View {
        ScrollView(.vertical) {
            VMasonry(
                columns: .adaptive(minLength: 150),
                spacing: 12,
                data: articles
            ) { article in
                ArticleCard(article: article)
            } columnSpan: { article in
                // Featured articles span 2 columns
                article.category == .featured ? 2 : 1
            }
            .padding()
        }
    }
}

struct Article: Identifiable {
    let id = UUID()
    let title: String
    let category: Category
    let imageHeight: CGFloat

    enum Category {
        case featured, tech, sports, general
    }
}

struct ArticleCard: View {
    let article: Article

    var body: some View {
        VStack(alignment: .leading, spacing: 8) {
            RoundedRectangle(cornerRadius: 8)
                .fill(cardColor)
                .frame(height: article.imageHeight)

            Text(article.title)
                .font(.headline)
                .lineLimit(2)

            Text(article.category.description)
                .font(.caption)
                .foregroundColor(.secondary)
        }
        .padding(8)
        .background(Color(.systemBackground))
        .cornerRadius(12)
        .shadow(radius: 2)
    }

    var cardColor: Color {
        switch article.category {
        case .featured: return .orange
        case .tech: return .blue
        case .sports: return .green
        case .general: return .gray
        }
    }
}

extension Article.Category: CustomStringConvertible {
    var description: String {
        switch self {
        case .featured: return "Featured"
        case .tech: return "Technology"
        case .sports: return "Sports"
        case .general: return "General"
        }
    }
}

```

--------------------------------

### Implement VMasonry

Source: https://github.com/ciaranrobrien/swiftuimasonry/blob/main/README.md

Arranges children in a vertical masonry layout within a vertical ScrollView.

```swift
ScrollView(.vertical) {
    VMasonry(columns: 2) {
        //Masonry content
    }
}
```

--------------------------------

### VMasonry View

Source: https://github.com/ciaranrobrien/swiftuimasonry/blob/main/README.md

Arranges child views in a vertical masonry layout.

```APIDOC
## VMasonry

### Description
A view that arranges its children in a vertical masonry.

### Parameters
- **columns** (Int) - Required - The number of columns in the masonry.
- **spacing** (CGFloat?) - Optional - The distance between adjacent subviews.
- **content** (ViewBuilder) - Required - The content of the masonry.
```

--------------------------------

### Implement HMasonry

Source: https://github.com/ciaranrobrien/swiftuimasonry/blob/main/README.md

Arranges children in a horizontal masonry layout within a horizontal ScrollView.

```swift
ScrollView(.horizontal) {
    HMasonry(rows: 2) {
        //Masonry content
    }
}
```

--------------------------------

### HMasonry View

Source: https://github.com/ciaranrobrien/swiftuimasonry/blob/main/README.md

Arranges child views in a horizontal masonry layout.

```APIDOC
## HMasonry

### Description
A view that arranges its children in a horizontal masonry.

### Parameters
- **rows** (Int) - Required - The number of rows in the masonry.
- **spacing** (CGFloat?) - Optional - The distance between adjacent subviews.
- **content** (ViewBuilder) - Required - The content of the masonry.
```

--------------------------------

### Masonry View

Source: https://github.com/ciaranrobrien/swiftuimasonry/blob/main/README.md

A flexible view that arranges its children in a masonry based on a specified axis.

```APIDOC
## Masonry

### Description
A view that arranges its children in a masonry.

### Parameters
- **axis** (Axis) - Required - The layout axis of this masonry.
- **lines** (Int) - Required - The number of lines in the masonry.
- **spacing** (CGFloat?) - Optional - The distance between adjacent subviews.
- **content** (ViewBuilder) - Required - The content of the masonry.
```

--------------------------------

### HMasonry Horizontal Layout

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Illustrates a basic horizontal masonry layout using HMasonry with a specified number of rows and spacing. This is suitable for horizontal carousels or timelines.

```swift
import SwiftUI
import SwiftUIMasonry

struct HorizontalGalleryView: View {
    var body: some View {
        ScrollView(.horizontal, showsIndicators: false) {
            HMasonry(rows: 2, spacing: 10) {
                ForEach(0..<20, id: \.self) {
                    index in
                    RoundedRectangle(cornerRadius: 8)
                        .fill(Color(hue: Double(index) / 20, saturation: 0.7, brightness: 0.9))
                        .frame(width: CGFloat.random(in: 80...160))
                        .frame(height: 100)
                }
            }
            .padding()
        }
    }
}
```

--------------------------------

### Implement HMasonry with Data and Row Spanning

Source: https://context7.com/ciaranrobrien/swiftuimasonry/llms.txt

Uses HMasonry to display data in a horizontal layout, with the rowSpan closure allowing specific items to span multiple rows.

```swift
import SwiftUI
import SwiftUIMasonry

struct TimelineView: View {
    let events: [Event] = [
        Event(id: 1, title: "Major Launch", isImportant: true),
        Event(id: 2, title: "Update 1.1", isImportant: false),
        Event(id: 3, title: "Update 1.2", isImportant: false),
        Event(id: 4, title: "Version 2.0", isImportant: true),
        Event(id: 5, title: "Hotfix", isImportant: false)
    ]

    var body: some View {
        ScrollView(.horizontal) {
            HMasonry(
                rows: 3,
                horizontalSpacing: 8,
                verticalSpacing: 8,
                data: events
            ) { event in
                EventCard(event: event)
            } rowSpan: { event in
                // Important events span all 3 rows
                event.isImportant ? .fixed(3) : .fixed(1)
            }
            .padding()
        }
        .frame(height: 300)
    }
}

struct Event: Identifiable {
    let id: Int
    let title: String
    let isImportant: Bool
}

struct EventCard: View {
    let event: Event

    var body: some View {
        Text(event.title)
            .padding()
            .background(event.isImportant ? Color.orange : Color.secondary.opacity(0.2))
            .cornerRadius(8)
    }
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.