Property Dictionary - e2technologies/ViewCSS GitHub Wiki

Initialization

The property dictionary is what the ViewCSS manager uses to define the properties for each element. The property dictionary should be set in the app delegate's "init" method. This will make sure it is loaded before any views are loaded.

class AppDelegate: UIResponder, UIApplicationDelegate {

    override init() {
        super.init()

        let css: [String:Any] = [
            // CSS Properties
        ]
        
        ViewCSSManager.shared.setCSS(dict: css)
    }
}

The library leaves the generation of the dictionary to the developer. This removes any unnecessary dependencies from the library on the format of the file that is capturing the CSS properties.

Here are some examples of getting the file from other sources

JSON File Example

Here is an example of reading the properties from a json file in the bundle called "css.json"

class AppDelegate: UIResponder, UIApplicationDelegate {

    override init() {
        super.init()

        if let path = Bundle.main.path(forResource: "css", ofType: "json") {
            do {
                let data = try Data(contentsOf: URL(fileURLWithPath: path), options: .mappedIfSafe)
                let jsonResult = try JSONSerialization.jsonObject(with: data, options: .mutableLeaves)
                if let jsonResult = jsonResult as? Dictionary<String, AnyObject> {
                    ViewCSSManager.shared.setCSS(dict: jsonResult)
                }
            } catch {
                print(error)
            }
        }
    }
}

Variables

The attribute dictionary allows custom variables to be defined. To do this, you must define the variable in a ":root" tag of the dictionary and access the variable using the var(<variable>) method. This is shown below

    let css: [String:Any] = [
        ":root": [
            "--primary-color": "blue"
        ],
        "my_controller.label": [
            "background-color": "var(--primary-color)"
        ]
    ]

Note that the library also supports nested variables. For example

    let css: [String:Any] = [
        ":root": [
            "--main-color": "blue",
            "--primary-color": "var(--main-color)"
        ],
        "my_controller.label": [
            "background-color": "var(--primary-color)"
        ]
    ]

It will recursively search until there is no longer a variable being requested.

⚠️ **GitHub.com Fallback** ⚠️