SDK instalation
There are a Package provided that can be found clicking here
Add the wave-ios-sdk into your project and then follow the initialization step.
Disclamer: SDK only supports Swift Package Manager.
If your application supports scanning code via camera, make sure you have enabled NSCameraUsageDescription and NSPhotoLibraryUsageDescription in your project’s Info.plist.
Initialization
First, import the following frameworks to your AppDelagate file.
And then, add the following code inside didFinishLaunchingWithOptions’s AppDelegate
Wave.shared.setup(apiKey: "your_api_key")
api_keyprovided by Wave.
Language
The default language is English, to change the language you can use the language parameter and choose one of the supported languages: EN, PT or MX.
Example:
Wave.shared.setup(apiKey: "your_api_key", language: .MX)
Customizations
Thera are actually two types of customizations, colors and typography.
Wave.shared.theming(colorSet:typography:)
Colors
To customize colors, it’s necessary add the following code just bellow the Wave.shared.setup(environment:oAuth:delegate:) statement
Wave.shared.theming(colorSet: colorSet)
ColorSet struct, initilize both main and base parameters with the desired colors, like the following example:
let colorSet = ColorSet(
main: .init(
brand01: .init(red: 6/255, green: 46/255, blue: 254/255),
brand02: .init(red: 48/255, green: 103/255, blue: 255/255),
brand03: .init(red: 87/255, green: 145/255, blue: 255/255),
brand04: .init(red: 179/255, green: 216/255, blue: 255/255),
brand05: .init(red: 232/255, green: 244/255, blue: 255/255)
),
base: .init(
base01: .init(red: 124/255, green: 124/255, blue: 124/255),
base02: .init(red: 152/255, green: 152/255, blue: 152/255),
base03: .init(red: 189/255, green: 189/255, blue: 189/255),
base04: .init(red: 220/255, green: 220/255, blue: 220/255),
base05: .init(red: 243/255, green: 244/255, blue: 246/255)
)
)
Typography
To customize the fonts, you need to create a new struct and conform with the CompositeTypography protocol and then inject the struct into the Wave.shared.theming(typography:) previously instantiated.
Example:
public struct MyCustomTypography: CompositeTypography {}
public extension MyCustomTypography {
func headlineLarge() -> Font {
.system(size: 48.0, weight: .medium)
}
func headlineMedium() -> Font {
.system(size: 42.0, weight: .medium)
}
func headlineSmall() -> Font {
.system(size: 34.0, weight: .medium)
}
func titleLarge() -> Font {
.system(size: 28.0, weight: .medium)
}
func titleSmall() -> Font {
.system(size: 22.0, weight: .medium)
}
func subtitleLarge() -> Font {
.system(size: 20.0, weight: .medium)
}
func subtitleSmallMedium() -> Font {
.system(size: 18.0, weight: .medium)
}
func subtitleSmallRegular() -> Font {
.system(size: 18.0, weight: .regular)
}
func buttonText() -> Font {
.system(size: 16.0, weight: .medium)
}
func bodyLargeMedium() -> Font {
.system(size: 16.0, weight: .medium)
}
func bodyLargeRegular() -> Font {
.system(size: 16.0, weight: .regular)
}
func bodySmallMedium() -> Font {
.system(size: 14.0, weight: .medium)
}
func bodySmallRegular() -> Font {
.system(size: 14.0, weight: .regular)
}
func bodySmallRegularUIKit() -> UIFont {
.system(size: 14.0, weight: .regular)
}
func chipTextMedium() -> Font {
.system(size: 14.0, weight: .medium)
}
func chipTextRegular() -> Font {
.system(size: 12.0, weight: .regular)
}
}
Activation
You can start the activation by adding the following code.
First, import the WaveActivation
Then, instantiate the simcard activation flow with the delegates:
let activation = Wave.shared.simCardActivation()
activation.helpDelegate = self
activation.successDelegate = self
present(activation.rootViewController, animated: true)
externalCode to simCardActivation that is used to identify each customer, if you don’t provide an external code, the first screen of the activation flow will ask for the full iccid, otherwise it’ll ask for the last digits of the iccid.
Both helpDelegate and successDelegate delegates are responsibles for handle the Help screen content and the success screen contents.
extension YourViewController: WaveSuccessActivationDelegate {
func waveSuccessNavigationListItems() -> [WaveNavigationItem] {
[
WaveNavigationItem(
image: .repeat,
title: "First card title",
text: WaveText([
WaveStyledText(
text: "Card text with a custom text ",
font: .bodySmallRegular(),
foregroundColor: ThemeManager.shared.color.text.text03
),
WaveStyledText(
text: "another text with a custom font and color ",
font: .bodySmallMedium(),
foregroundColor: ThemeManager.shared.color.text.text03
),
]),
link: .init(
title: "Button title",
action: {
// Action
}
)
),
WaveNavigationItem(
image: .simCard,
title: "Second card title",
text: .init(
"Simple text",
foregroundColor: ThemeManager.shared.color.text.text03
),
link: .init(
title: "Button title",
action: {
// Action
}
)
),
]
}
}
extension YourViewController: WaveHelpActivationDelegate {
func waveHelpListItems() -> [WaveNavigationDisclosureItem] {
[
WaveNavigationDisclosureItem(
image: .chat,
title: "First card title",
text: .init(
"Card text",
foregroundColor: ThemeManager.shared.color.text.text03
),
link: .init(
action: {
// Action
}
)
),
WaveNavigationDisclosureItem(
image: .questionMark,
title: "Second card title",
text: .init(
"Card text",
foregroundColor: ThemeManager.shared.color.text.text03
),
link: .init(
action: {
// Action
}
)
),
]
}
}
