🔮 The Orb - SwiftUI

一个漂亮且高度可定制的动画 Orb 组件，使用 SwiftUI 构建。创建具有发光效果、粒子效果和动态动画的迷人、交互式 Orb。

DefaultPreview.mov

(灵感来源于 Apple 的 Siri 动画，以及 Oğuz's Tweet!)

安装

Swift 包管理器

通过 Xcode 将 Orb 添加为项目的依赖项

前往 File > Add Package Dependencies
输入仓库 URL: https://github.com/metasidd/Orb.git
点击 Add Package

或将其添加到你的 Package.swift 文件中

dependencies: [
    .package(url: "https://github.com/yourusername/Orb.git", from: "1.0.0")
]

用法

基本实现

import Orb
import SwiftUI

struct ContentView: View {
    var body: some View {
        OrbView()
            .frame(width: 200, height: 200)
    }
}

高度可定制

OrbView 可以使用 OrbConfiguration 进行定制

let configuration = OrbConfiguration(
    backgroundColors: [.purple, .blue, .pink], // Custom gradient colors
    glowColor: .white,                         // Glow effect color
    particleColor: .white,                     // Particle effect color
    coreGlowIntensity: 1.2,                   // Intensity of the core glow
    showBackground: true,                      // Toggle background visibility
    showWavyBlobs: true,                      // Toggle organic movement elements
    showParticles: true,                      // Toggle particle effects
    showGlowEffects: true,                    // Toggle glow effects
    showShadow: true,                         // Toggle shadow effects
    speed: 60                                 // Animation speed
)

OrbView(configuration: configuration)
    .frame(width: 200, height: 200)

可用配置选项

属性	类型	默认值	描述
`backgroundColors`	`[Color]`	`[.green, .blue, .pink]`	用于渐变背景的颜色
`glowColor`	`Color`	`.white`	发光效果的颜色
`particleColor`	`Color`	`.white`	粒子效果的颜色
`coreGlowIntensity`	`Double`	`1.0`	核心发光效果的强度 (数值越高 = 越亮)
`showBackground`	`Bool`	`true`	显示/隐藏渐变背景
`showWavyBlobs`	`Bool`	`true`	显示/隐藏有机运动元素
`showParticles`	`Bool`	`true`	显示/隐藏粒子效果
`showGlowEffects`	`Bool`	`true`	显示/隐藏发光效果
`showShadow`	`Bool`	`true`	显示/隐藏阴影效果
`speed`	`Double`	`60`	动画速度 (数值越高 = 越快)

预设配置

探索这些精美的配置，看看你能实现什么。复制以下任何预设以在您自己的项目中使用，并随意自定义它们以匹配您的愿景。

// Mystic
let mysticOrb = OrbConfiguration(
    backgroundColors: [.purple, .blue, .indigo],
    glowColor: .purple,
    coreGlowIntensity: 1.2
)

// Nature
let natureOrb = OrbConfiguration(
    backgroundColors: [.green, .mint, .teal],
    glowColor: .green,
    speed: 45
)

// Sunset
let sunsetOrb = OrbConfiguration(
    backgroundColors: [.orange, .red, .pink],
    glowColor: .orange,
    coreGlowIntensity: 0.8
)

// Ocean
let oceanOrb = OrbConfiguration(
    backgroundColors: [.blue, .cyan, .teal],
    glowColor: .cyan,
    speed: 75
)

// Minimal
let minimalOrb = OrbConfiguration(
    backgroundColors: [.gray, .white],
    glowColor: .white,
    showWavyBlobs: false,
    showParticles: false,
    speed: 30
)

// Cosmic
let cosmicOrb = OrbConfiguration(
    backgroundColors: [.purple, .pink, .blue],
    glowColor: .white,
    coreGlowIntensity: 1.5,
    speed: 90
)

// Fire
let fireOrb = OrbConfiguration(
    backgroundColors: [.red, .orange, .yellow],
    glowColor: .orange,
    coreGlowIntensity: 1.3,
    speed: 80
)

// Arctic
let arcticOrb = OrbConfiguration(
    backgroundColors: [.cyan, .white, .blue],
    glowColor: .white,
    coreGlowIntensity: 0.75,
    showParticles: true,
    speed: 40
)

// Shadow
let shadowOrb = OrbConfiguration(
    backgroundColors: [.black, .gray],
    glowColor: .gray,
    coreGlowIntensity: 0.7,
    showParticles: false
)

系统要求

iOS 17.0+
macOS 14.0+
tvOS 17.0+
watchOS 10.0+
visionOS 1.0+
Swift 5.9+

贡献

欢迎贡献! 请随时提交 Pull Request。

许可证

本项目根据 MIT 许可证授权 - 有关详细信息，请参阅 LICENSE 文件。