SSSwiftUISideMenu
SwiftUI 包，用于创建自定义侧边菜单，具有动画和灵活的设计，可根据您的选择定制。
使用此库创建的自定义侧边菜单示例
关于 SSSwiftUISideMenu
SSSwiftUISideMenu 是一款高度可定制且易于使用的侧边菜单控件，适用于 iOS 应用程序。它支持从左侧/右侧面板执行 SideMenu 操作。用户可以通过添加到 SideMenu 的菜单项来浏览容器视图。它允许用户自定义 UI 和他们选择的动画样式。
先决条件
- iOS 13.0+
- Xcode 11.0+
- CocoaPods
示例
- 要运行示例项目，请克隆仓库，然后首先从示例目录中运行
pod install。
安装
CocoaPods
-
您可以使用CocoaPods通过将其添加到Podfile中来安装
SSSwiftUISideMenuuse_frameworks! pod 'SSSwiftUISideMenu' -
在您的文件中导入SSSwiftUISideMenu
import SSSwiftUISideMenu
手动安装
- 下载并将SSSwiftUISideMenu/Sources文件夹拖放到您的项目中。
- 给自己准备一杯冰爽的🍺。
Swift Package Manager (SPM)
-
当使用Xcode 11或更高版本时，您可以通过转到项目设置 >
Swift Packages来通过提供GitHub URL添加存储库安装SSSwiftUISideMenu。或者，您可以选择文件>Swift Packages>添加包依赖...dependencies: [ .package(url: "https://github.com/mobile-simformsolutions/SSSwiftUISideMenu.git", from: "1.0.0") ]
用法示例
- 在要使用它的文件中导入包
import SSSwiftUISideMenu
- 该库共享一个视图，您可以将其用作带有许多自定义选项（如UI、动画、方向等）的侧边菜单。基本示例
@State private var openSideMenu: Bool = false
@State private var selectedIndex: Int = 0
private var menuItems = [
MenuItem(title: "item_1", icon: "icon_1"),
MenuItem(title: "item_2", icon: "icon_2"),
MenuItem(title: "item_3", icon: "icon_3"),
MenuItem(title: "item_4", icon: "icon_4")
]
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems)
}从侧边菜单项的任何交互都会在声明的selectedIndex状态变量中可用。此外，侧边菜单打开/关闭切换值将在openSideMenu状态变量中可用。
自定义内容
- 您几乎可以在这个库中的所有主要事项上进行自定义。
- 对于自定义，您需要在调用SSSwiftUISideMenu时提供一个额外的
menuConfig值。这个menuConfig参数也是可选的，就像SSMenuConfig中的每一个参数也是可选的一样。因此，您只需要添加您想要自定义的参数。以下是一些示例：
样式变更示例
样式自定义的示例
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems,
menuConfig: SSMenuConfig(titleColor: .black,
selectedTitleColor: .secondary,
backgroundColor: .white))
}更改侧边菜单方向 - 左 / 右
更改侧边菜单方向的示例。默认为左方向。
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems,
menuConfig: SSMenuConfig(menuDirection: .right))
}为侧边菜单添加动画
应用动画类型到侧边菜单的示例
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems,
menuConfig: SSMenuConfig(animationType: .easeOut))
}其他自定义
侧边菜单宽度
您可以使用menuWidth参数更改您选择的菜单宽度。默认为'280'。
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems,
menuConfig: SSMenuConfig(menuWidth: MENU_SIZE))
}图标颜色和自定义
- 您可以通过添加leftIconPadding参数来更改侧边菜单视图左侧的图标填充。
- 您可以通过添加imageToTitlePadding参数来添加图标和标题之间的填充。
- 您可以通过添加iconTintColor参数来更改您选择的图标着色颜色。
- 您可以通过添加iconHeight和iconWidth参数来更改行图标的大小。
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems,
menuConfig: SSMenuConfig(leftIconPadding: 20,
imageToTitlePadding: 15,
iconTintColor: .black,
iconHeight: 30,
iconWidth: 30))
}显示应用版本
在侧边菜单底部显示应用版本的一个示例。您可以配置其样式和颜色。所有设置都是可选的。
- 添加showAppVersion参数以配置是否显示应用版本。默认值是false。
- 添加versionText参数以添加传递的文本版本号。
- 添加versionTitleColor、versionAlignment或versionFont参数以更改版本字符串的字体样式和颜色。
var body: some Scene {
SSSwiftUISideMenu(openSideMenu: $openSideMenu, selectedIndex: $selectedIndex, menuItems: menuItems,
menuConfig: SSMenuConfig(showAppVersion: true,
versionText: "1.0.0",
versionTitleColor: .gray,
versionAlignment: .center))
}即将推出
- 将自定义视图直接传递到侧边菜单以创建您选择的侧边菜单。
提供建议。给出更多功能和自定义化的建议。
🤝 如何贡献
无论您是在帮助我们修复错误，改进文档，还是有功能请求，我们都非常希望您能加入我们！💪
查看我们的 贡献指南 了解如何贡献。
觉得这个示例很有用吗？ ❤️
如果这个项目帮助了您，请给它点个 ⭐️！
查看我们的其他库
🗂 Simform Solutions Libraries→
MIT 许可证
本项目采用 MIT 许可证 -详情请参阅 LICENSE 文件。