Skip to content

Configurable HUD (heads up display) SwiftUI component.

License

Notifications You must be signed in to change notification settings

airappsco/AirHUD

Repository files navigation

Static Badge Static Badge Static Badge

AirHUD_Project Banner_Github 2

HUD component written using SwiftUI for iOS 15 and later

🌟 Features

  • 3 different layouts 📐:
    • Icon and Title 🏷️
    • Icon, Title and Button 🖲️
    • Icon, Title and Subtitle 📄
  • Customizable Fonts, Colors, Alignments and more 🎨
  • Dynamic Type support 🔠
  • Compatible with Dark Mode by default 🌙
  • Swift Package Manager support 📦

📋 Requirements

  • iOS 12 ((if you use only UIKit)
  • iOS 15.0+ (if you use it in SwiftUI)
  • Swift 5.8+ (Xcode 14.3+).

🔧 Installation

AirHUD is distributed via Swift Package Manager 📦.

To install AirHUD, please add the following line to the dependencies: section in your Package.swift file:

.package(url: "https://github.com/airappsco/AirHUD.git", .upToNextMinor(from: "1.0.0")),

🚀 Usage

Import module in the file which will be used in

import AirHUD

Call related airHUD function after a SwiftUI View that takes up the whole screen with a bindable boolean and necessary information.

struct ContentView: View {
    
    @State var isPresented: Bool = false

    var body: some View {
        VStack {
            Spacer()
            Button("Show HUD") {
                isPresented = true
            }
            Spacer()
        }
        .airHud(isPresented: $isPresented,
                iconImage: Image(systemName: "doc.on.doc"),
                iconColor: Color(uiColor: .systemBlue),
                title: "Text Copied")
    }
}

There are 4 different airHUD functions. 3 of them provides ease of use for 3 different layouts with default UI customization. Last one provides customization over HUD elements such as fonts, colors, alignments and more.

🏷️ Icon and Title

        .airHud(isPresented: $isPresented,
                iconImage: Image(systemName: "doc.on.doc"),
                iconColor: Color(uiColor: .systemBlue),
                title: "Text Copied")

🖲️ Icon, Title and Button

        .airHud(isPresented: $isPresented,
                iconImage: Image(systemName: "trash"),
                iconColor: Color(uiColor: .systemRed),
                title: "Conversation Deleted",
                buttonTitle: "Undo",
                buttonAction: nil)

📄 Icon, Title and Subtitle

        .airHud(isPresented: $isPresented,
                iconImage: Image(systemName: "folder"),
                iconColor: Color(uiColor: .systemBlue),
                title: "Moved",
                subtitle: "File moved to \"Personal\"")

⚙️ With Configuration

    var hudConfiguration: AirHUDConfiguration {
        let iconConfiguration = IconConfiguration(image: .init(systemName: "star"),
                                                  color: .white,
                                                  position: .trailing,
                                                  size: Constant.customIconSize)
        let titleConfiguration = TitleConfiguration(text: "Added to Favorites",
                                                    color: .purple,
                                                    font: .headline.italic())
        let subtitleConfiguration = SubtitleConfiguration(text: "You can change your favorites at any time from favorites section",
                                                          color: .blue,
                                                          font: .callout)
        let dismissConfiguration = DismissConfiguration(autoDismiss: true)
        let generalConfiguration = GeneralConfiguration(backgroundColor: .orange,
                                                        horizontalAlingment: .center,
                                                        verticalAlignment: .bottom)
        let mode: AirHUDMode = .iconTitleAndSubtitle(icon: iconConfiguration,
                                                     title: titleConfiguration,
                                                     subtitle: subtitleConfiguration,
                                                     dismiss: dismissConfiguration,
                                                     general: generalConfiguration)
        return AirHUDConfiguration(mode: mode)
    }
        .airHud(isPresented: $isPresented,
                configuration: hudConfiguration)

🏗️ Using AirHUD with UIKit

AirHUD also supports UIKit using a wrapper, though the underlying views utilize SwiftUI. You can achieve the same 4 configurations as presented above. However, due to the dependency on SwiftUI, the setup process slightly differs.

Note: To use AirHUD with UIKit, you will need to switch to the feature/ios-12-support branch.

The steps to use AirHUD with UIKit are as follows:

  1. Import the AirHUD module. Initiate AirHUDUIKitProvider in the file where it's needed.
import AirHUD
private let hudProvider = AirHUDUIKitProvider()
  1. Set up the type of HUD that suits your requirement.

For this, you need to provide an ID of type String and the target UIViewController where the HUD should be displayed.

override public func viewDidLoad() {
    super.viewDidLoad()
    setupIconAndTitleHUD()
}

Here is an example setup of an IconAndTitle HUD:

@objc func setupIconAndTitleHUD() {
    hudProvider.setupAirHUD(
        hudID: "1",
        hudType: .iconAndTitle(
            Image(systemName: "doc.on.doc"),
            .blue,
            "Text Copied"
        ),
        in: self
    )
}
  1. Present the HUD.

This can be executed from your trigger function by providing the HUD's ID:

@objc func didTapButtonStateIconAndTitle() {
    hudProvider.toggleAirHUD(hudID: "1")
}

You can check out the Example project in the workspace for both SwiftUI and UIKit's detailed usage.

Validation

This framework has been validated and tested through integration into our app Translate Now.

Contributing to Air Apps

Want to contribute to Air Apps? Please refer to the following guide here.

About Air Apps

Air Apps is a leading mobile application publisher dedicated to creating practical solutions for everyday challenges. With a portfolio of over 30 mobile applications spanning Fitness, Productivity, Creative, and Learning, we aim to simplify lives. Our unique approach includes a fully remote work environment, allowing our diverse team to collaborate from around the world. As an AI-first company, we stay up-to-date with technology trends, integrating them into our products to enhance user experiences. Our ongoing mission is to provide value to both our users and our team, fostering continuous improvement and a commitment to making life easier.

Learn more about us in the following links:

Website: airapps.co
Our Apps: View on App Store
Careers: airapps.co/careers
Linkedin: linkedin.com/company/airapps
Blog: blog.airapps.co
Instagram: @airappsco
Twitter: @airappsco
Facebook: facebook.com/airappsco
Youtube: Youtube @airapps

License

MIT License

Copyright (c) 2023 Air Apps (Air Apps, Inc. and Affiliates)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.