Appearance

This documentation assumes that you are already familiar with Swift programing language, and basic iOS development.

Customize your app to stand out

This documentation assumes that you are already familiar with Swift programing language, and basic iOS development.

How to get started and prepare your project for DSKit can be found here

Customizing your app UI as easy as setting a color to UIView. Using DSAppearance single tone class, you can set your custom appearance or use one provided by DSKit and customize it, changing only aspects you need.

To set an appearance theme to the current app, UI/UX will automatically adapt to new margins, spaces and colors.

DSAppearance.shared.main = DSSystemOrangeAppearance()

To get the list of all available DSKit appearances, use:

DSAppearance.allAppearances()

Each DSKit appearance can be initialized with a brand color, which will represent your brand color.

let myAppearance = DSFlowerStoreAppearance(brandColor: appearance.semanticGreenColor)
DSAppearance.shared.main = myAppearance

You can easily customize any color of any DSDesignable protocol

let myAppearance = DSFlowerStoreAppearance(brandColor: appearance.semanticGreenColor)

//Change primary view background color
myAppearance.primaryView.background = UIColor.yellow

//Change secondary view button background color
myAppearance.secondaryView.button.background = UIColor.systemBlue

//Set new appearance
DSAppearance.shared.main = myAppearance

Or you can create you completly custom appearance by customizing all parameters in your own appearance class which sould implement DSDesignable protocol

public protocol DSDesignable {
    
    /// Appearance title
    var title: String { get set }
    
    /// Brand color
    var brandColor: UIColor { get set }
    
    /// Primary view colors
    var primaryView: DSDesignableViewColors { get set }
    
    /// Secondary view colors
    var secondaryView: DSDesignableViewColors { get set }
    
    /// Status bar
    var statusBarStyleForDarkUserInterfaceStyle: UIStatusBarStyle { get set }
    var statusBarStyleForLightUserInterfaceStyle: UIStatusBarStyle { get set }
    
    /// Margins and spaces
    var margins: CGFloat { get set }
    var groupMargins: CGFloat { get set }
    var interItemSpacing: CGFloat { get set }
    
    /// Tabbar colors
    var tabBar: DSDesignableTabbarColor { get set }
    
    /// Navigation Bar colors
    var navigationBar: DSDesignableNavigationBarColor { get set }
    
    /// Text fields color
    var textFieldColor: DSDesignableTextFieldColor { get set }
    
    /// Currency color and amount color
    var currency: DSDesignablePriceColor { get set }
    
    /// Fonts
    var fonts: DSDesignableFonts { get set }
    
    /// Do we prefer large titles on screens?
    var prefersLargeTitles: Bool { get set }
    
    /// Buttons height
    var buttonsHeight: CGFloat { get set }
}

Dark Mode

In iOS 13.0 and later, people can choose to adopt a dark system-wide appearance called Dark Mode. In Dark Mode, the system uses a darker color palette for all screens, views, menus, and controls, and it uses more vibrancy to make foreground content stand out against the darker backgrounds. Dark Mode supports all accessibility features.

By default, DSKit uses the system UIUserInterfaceStyle, which is guided by user settings. It can be light or dark, or it depends on the time of the day, you can change the app appearace by just calling

// Override system settings and set to dark
DSAppearance.shared.userInterfaceStyle = .dark

// Override system settings and set to light
DSAppearance.shared.userInterfaceStyle = .light

// Set back to system settings
DSAppearance.shared.userInterfaceStyle = .unspecified

Comply with the appearance mode people choose in Settings. If you offer an app-specific appearance mode option, you create more work for people because they have to adjust to more than one setting. Worse, they may think your app is broken because it doesn't respond to their systemwide appearance choice.