Creation Screen Setup
Scenario 1 - From Scratch (just REST API calls?)
Scenario 2 - Use our default view controllers, launch them from custom UI
- In the ‘VoucherCreationFlowDelegate’, implement:
objc - (UIViewController<VoucherCreationViewControllerProtocol> \*)customCreationViewController;
to instantiate your custom creation view controller.
(Note: When you launch the creation flow, the ‘VoucherCreationFlowCoordinator’, will assign itself a creation view controller. It will use the default creation view controller if you do not implement the above method.)
- Your creation view controller should adopt the ‘VoucherCreationViewControllerProtocol’.
The following is a sample implementation of an initializer:
+ (instancetype)voucherCreationViewControllerWithVoucherCreationManager:(VoucherCreationManager \*)createManager
createFlowDelegate:(id<VoucherCreationFlowDelegate>)createFlowDelegate
vouchrTheme:(VouchrTheme \*)vouchrTheme
personalizationOptions:(NSArray<PersonalizationOption \*> \*)personalizationOptions {
NSBundle \*bundle = [NSBundle bundleForClass:[VoucherCreationViewController class]];
VoucherCreationViewController \*viewController = [[VoucherCreationViewController alloc] initWithNibName:NSStringFromClass([VoucherCreationViewController class]) bundle:bundle];
viewController.createManager = createManager;
viewController.createFlowDelegate = createFlowDelegate;
viewController.vouchrTheme = vouchrTheme;
viewController.personalizationOptions = personalizationOptions;
viewController.mutableVoucher = createManager.mutableVoucher;
viewController.creationItems = [NSMutableArray new];
return viewController;
}
(Note: assign the mutableVoucher property of the ‘VoucherCreationManager’ to the mutableVoucher property of your creation view controller. You may also want to initialize your array of creationItems here, or you can lazily load them, etc. )
- Your creation view controller is responsible for setting up the UI to select and launch the various personalization options it was initialized with in step 2.
The following is a sample implementation using a collection view to present the personalization options:
- (NSInteger)collectionView:(UICollectionView \*)collectionView numberOfItemsInSection:(NSInteger)section {
return self.personalizationOptions.count;
}
- (void)collectionView:(UICollectionView \*)collectionView didSelectItemAtIndexPath:(NSIndexPath \*)indexPath {
[collectionView deselectItemAtIndexPath:indexPath animated:YES];
PersonalizationOption \*personalizationOption = self.personalizationOptions[indexPath.item];
[self.delegate personalizationViewControllerForPersonalizationOption:personalizationOption];
}
(Note: self.delegate refers to the ‘VoucherCreationFlowCoordinator’ instance that assigned itself as the ‘VoucherCreationFlowDelegate’ of your voucher creation view controller. It assigned itself when it launched the creation view controller.)
(Note 2: personalizationViewControllerForPersonalizationOption: returns a view controller if personalizationViewControllerForPersonalizationOption: was implemented by the ‘VoucherCreationFlowDelegate’ in step 1. Otherwise it launches the default view controller associated with the personalization option.)
- The creation flow coordinator will take care of updating the voucher when users add a personalization. When a personalization is added, you can receive its ‘CreationItemImageView’ to display or animate for users. To update the screen after a new personalization is added, implement:
objc - (void)didUpdateVoucherWithCreationItemImageView:(nullable CreationItemImageView \*)creationItemImageView withCompletion:(nullable void (^)(void))completion;
Scenario 2 (optional) - Send, Edit, Preview Reveal Animation, Prepopulate
You will generally want a reference the ‘VoucherCreationFlowCoordinator’ initialized during setup. You will call methods on the ‘VoucherCreationFlowCoordinator’ instance to send, edit, and preview the reveal animation of the voucher.
SENDING
To send a voucher using our default send voucher view controller, your button or other event handling UI element should implement the following when a user taps on it:
- (void)sendButtonPressed:(UIButton \*)sender {
[self.creationFlowCoordinator launchSendVoucherScreenFromCreationViewControllerWithCreationItems:self.creationItems];
}
EDITING
To start the edit voucher flow, your Edit button should implement the following:
- (IBAction)editButtonPressed:(UIButton \*)sender {
[self.creationFlowCoordinator launchEditScreenFromCreationViewControllerWithCreationItems:self.creationItems];
}
(NOTE: editing currently still goes through the surpriise flow: Preview Screen -> Creation Screen -> Personalization View Controller; TODO: launch personalization screens directly?)
delegate callbacks
The default editing flow allows for rearranging, and deleting creation items. You can receive updated creation items through the following two methods. Implement them to, for example, update your creation view controller’s creation items array after editing:
- (void)didEditVoucherWithRearrangedCreationItems:(NSMutableArray<CreationItemImageView \*> \*)creationItems;
- (void)didEditVoucherWithDeletedCreationItems:(NSMutableArray<CreationItemImageView \*> \*)creationItems;
PREVIEWING REVEAL ANIMATION
To preview the reveal animation from your creation view controller, implement a variation of the following:
- (IBAction)previewButtonPressed:(UIButton \*)sender {
[self.creationFlowCoordinator launchRevealScreenFromCreationViewControllerWithVoucher:self.mutableVoucher];
}
PREPOPULATE
You can prepopulate a voucher with contents from an ‘Occasion’ loaded from the ‘VoucherDiscoverViewController’.
In your setup class, launch the flow through the discover screen by calling:
- (void)launchDiscoverScreenOnViewController:(UIViewController \*)viewController
personalizationOptions:(nullable NSArray <PersonalizationOption \*> \*)personalizationOptions
discoverBuilder:(void (^)(DiscoverScreenBuilder \*builder))builderBlock;
In the flow, a user selects an ‘Occasion’, and proceeds to the ‘PreviewVoucherContentsViewController’. Next, the user taps the Use It
button to initiate prepopulation. One by one, each personalization is added to the voucher, and each time a callback is made to the following method:
- (void)didUpdateVoucherWithCreationItemImageView:(nullable CreationItemImageView \*)creationItemImageView withCompletion:(nullable void (^)(void))completion {
[self.creationItems addObject:creationItem];
[self.tableView reloadData];
}
This example implementation adds a creationItemImageView to the view controller’s creationItems array, and reloads the tableView. Your implementation will be specific to your custom creation view controller.
Scenario 3 - Use default creation view controller