VerticalSplit：垂直堆叠两个视图的容器，且可以上下调节视图大小

编辑

跳转Github地址

预估时长 1 min read

项目名称：VerticalSplit

项目概述

VerticalSplit是一个开源的SwiftUI库，它提供了一个垂直分屏布局的实现，灵感来源于Amie iOS应用的分屏功能。该库允许开发者在SwiftUI应用中轻松创建和管理垂直分割的视图，支持拖动调整分割比例，并提供了迷你覆盖层和自定义配件按钮的功能。

功能特点

垂直分屏：创建上下两个视图区域，可以拖动中间的分隔条来调整比例。
迷你覆盖层：当顶部或底部视图缩小到最小时，可以显示自定义的迷你覆盖层内容。
分割绑定：使用绑定来控制顶部和底部视图之间的分割比例。
配件按钮：在拖动区域添加领先的配件和菜单配件按钮，用于执行特定操作。
背景颜色：设置顶部和底部视图容器以及菜单按钮的背景颜色。
调试日志：开启或关闭调试日志，以便于开发过程中的问题排查。

使用方法

以下是如何在SwiftUI中使用VerticalSplit的示例：

import VerticalSplit

VerticalSplit(
    topTitle: "Top View",
    bottomTitle: "Bottom View",
    topView: {
        // Top Content
    },
    bottomView: {
        // Bottom Content
    }
)

Mini Overlays

当顶部或底部视图处于最小尺寸时，添加自定义内容显示。

VerticalSplit(
    topTitle: "Top View",
    bottomTitle: "Bottom View",
    topView: {
        // Top Content
    },
    bottomView: {
        // Bottom Content
    },
    topMiniOverlay: {
        // Shown instead of the Top Content when Top View is minimised
    },
    bottomMiniOverlay: {
        // Shown instead of the Bottom Content when Bottom View is minimised
    }
)

SplitDetent Binding

使用绑定来控制顶部和底部视图之间的分割。

@State var currentDetent: SplitDetent.fraction(0.5)

VerticalSplit(
    detent: $currentDetent
    topTitle: "Top View",
    bottomTitle: "Bottom View",
    ...
)

Accessories

使用 leadingAccessories 和 trailingAccessories 修改器在拖动区域添加按钮。

VerticalSplit(...)
    .leadingAccessories([
        SplitAccessory(systemName: "plus.circle.fill") {
            // Perform action
        },
        SplitAccessory(systemName: "minus.circle.fill") {
            // Perform action
        }
    ])

使用 menuAccessories 修改器在拖动区域添加一个弹出菜单中的按钮。

VerticalSplit(...)
    .menuAccessories([
        MenuAccessory(title: "Plus", systemName: "plus.circle.fill", color: .green) {
            // Perform action
        },
        MenuAccessory(title: "Minus", systemName: "minus.circle.fill", color: .red) {
            // Perform action
        }
    ])

Background Color

为顶部和底部视图容器以及菜单按钮设置背景颜色。

VerticalSplit(...)
    .backgroundColor(.gray)

Debugging

控制是否为调试创建日志。

VerticalSplit(...)
    .debug(true)

PartialSheet：自定义SwiftUI部分模态弹窗

PartialSheet是一个基于SwiftUI的自定义组件，用于展示基于内容大小的部分模态弹窗，支持滑动、自定义颜色和键盘兼容性，适用于iOS和MacOS。

最近更新 2024-12-31

AxisRatingBar：SwiftUI开发的iOS/macOS评分控件

AxisRatingBar是一个用SwiftUI开发的iOS和macOS平台的评分控件，支持水平和垂直方向显示评分，用户交互评分，适用于任何符合View协议的视图。

最近更新 2024-12-09

SwiftUIPager：SwiftUI原生组件构建的分页器

SwiftUIPager是一个用SwiftUI构建的分页器组件，支持垂直和水平分页，视图回收，自定义UI和动画效果，适用于iOS和macOS应用。

最近更新 2024-12-10

独立开发者

独立开发者