SwiftUI-Flow:SwiftUI中的流式布局管理器支持水平和垂直排列





项目名称:SwiftUI-Flow

项目概述

SwiftUI-Flow是一个开源的SwiftUI布局库,它引入了HFlowVFlow两个视图,类似于HStackVStack,但具有更灵活的布局控制。这个库允许视图按行排列,并在视图超出边界空间时自动换行。它支持自定义行间距和项目间距,以及多种对齐方式,使得布局更加灵活和适应不同的设计需求。

功能特点

  • 水平和垂直流式布局:提供HFlowVFlow两种流式布局方式。

  • 自动换行:当元素超出边界空间时,自动切割到新的行。

  • 对齐支持:支持与HStackVStack相同的对齐方式,包括顶部、底部、中心等。

  • 间距自定义:可以分别自定义行间距和项目间距。

  • 两端对齐:通过拉伸项目或它们之间的空间或两者来实现两端对齐。

  • 均匀分布:通过最小化每行留下的空白空间,均匀分布项目。

  • 支持RTL:适应从左到右和从右到左的环境。

使用方法

以下是如何在SwiftUI中使用SwiftUI-Flow的示例:

HFlow 示例

struct Colors: View {
    let colors: [Color] = [
        .blue,
        .orange,
        .green,
        .yellow,
        .brown,
        .mint,
        .indigo,
        .cyan,
        .gray,
        .pink
    ]

    var body: some View {
        HFlow {
            ForEach(colors, id: \.description) { color in
                RoundedRectangle(cornerRadius: 10)
                    .fill(color.gradient)
                    .frame(width: .random(in: 40...60), height: 50)
            }
        }
        .frame(maxWidth: 300)
    }
}

VFlow 示例

VFlow {
    ForEach(colors, id: \.description) { color in
        RoundedRectangle(cornerRadius: 10)
            .fill(color.gradient)
            .frame(width: 50, height: .random(in: 40...60))
    }
}
.frame(maxHeight: 300)

或许喜欢

Flow:SwiftUI中的流式布局视图排列工具

Flow是一个SwiftUI布局工具,用于按流式排列视图,支持自定义对齐和间距,适用于标签集合等场景,并支持动画变换。

最近更新 2024-12-09

SwiftUICoreImage:简化Core Image在SwiftUI中的使用

SwiftUICoreImage是一个开源库,旨在简化在SwiftUI中使用Core Image进行图像处理的过程,提供链式滤镜应用和渲染到SwiftUI视图的功能。

最近更新 2024-12-10

SwiftEasyPop:轻量级SwiftUI自定义弹窗和提示库

SwiftEasyPop是一个轻量级且易于使用的SwiftUI库,用于在Swift应用中显示自定义弹窗和提示,支持iOS 14.0+,兼容暗黑和明亮模式。

最近更新 2024-12-15

热榜

Made with in Shangrao,China By 老雷

Copyright © devler.cn 1987 - Present

赣ICP备19009883号-1