{"_id":"563337539c607719001b85dd","githubsync":"","user":"54aa7f3f9bb00c0b00cb899b","version":{"_id":"55781fe25129590d003ff4f7","project":"54aa7f773b56130b0056c86e","forked_from":"54aa7f773b56130b0056c871","__v":8,"createdAt":"2015-06-10T11:30:42.700Z","releaseDate":"2015-06-10T11:30:42.700Z","categories":["55781fe35129590d003ff4f8","55781fe35129590d003ff4f9","55781fe35129590d003ff4fa","55781fe35129590d003ff4fb","55781fe35129590d003ff4fc","55781fe35129590d003ff4fd","55781fe35129590d003ff4fe","564bbc7e8841060d00abb2ee","565b66c446118c0d00dcb0bb","56898269f8dc340d00308c13","582318b23b961a0f009516a1","594a848c9f4771001a43c959","5c73dd27e8fdc000572a206a","5c77ac5af94a920045cb80ca"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"Developers","version_clean":"2.0.0","version":"2.0"},"parentDoc":null,"__v":10,"category":{"_id":"55781fe35129590d003ff4fb","version":"55781fe25129590d003ff4f7","__v":11,"pages":["55781fe45129590d003ff517","55781fe45129590d003ff518","55781fe45129590d003ff519","55781fe45129590d003ff51a","55781fe45129590d003ff51b","55781fe45129590d003ff51c","55781fe45129590d003ff51d","55781fe45129590d003ff51e","55781fe45129590d003ff51f","55781fe45129590d003ff520","55781fe45129590d003ff521","55781fe45129590d003ff522","5579ab5fc7fb3f2100096fad","55f7de1660cc850d008a7a22","55f7e1fbe32e9b0d00a2d4d0","561f72bacec1a50d00979598","561f764f61c0521700acc428","563337539c607719001b85dd","564318f1f49bfa0d002f5566","564f03454f000617007bd670","565ee80a23fd5f0d00a129f9","56793cd73473bc0d008e141b"],"project":"54aa7f773b56130b0056c86e","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-01-05T12:43:51.897Z","from_sync":false,"order":3,"slug":"ios-sdk","title":"iOS SDK"},"project":"54aa7f773b56130b0056c86e","updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-10-30T09:24:35.768Z","link_external":false,"link_url":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":9,"body":"You can very easily customise the appearance of all Pulsate SDK's UI so it fits your needs. You can change colors of all elements and the content of texts.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Pulsate Configuration JSON\"\n}\n[/block]\nThe *pulsateConfiguration.json* file can be found the *PULPulsateBasic.bundle*. The easiest way to find the file is just to type it's name into XCode's explorer.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/OjrMnXEsTH2j270cUktP_config2.png\",\n        \"config2.png\",\n        \"604\",\n        \"1290\",\n        \"#36576c\",\n        \"\"\n      ],\n      \"caption\": \"\"\n    }\n  ]\n}\n[/block]\nIf you want to use a custom color, just put a hexadecimal color in the element you want to change. If you want to color the navigation bar to yellow just put a hexadecimal number in the corresponding element *\"pulsate_top_nav_bar_background_color\" : \"#ffde17\"*\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/be9897a-docs_01.jpg\",\n        \"docs_01.jpg\",\n        1700,\n        1867,\n        \"#2f5472\"\n      ],\n      \"sizing\": \"full\"\n    }\n  ]\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/d0127bc-docs_02.jpg\",\n        \"docs_02.jpg\",\n        1700,\n        1867,\n        \"#767a89\"\n      ],\n      \"sizing\": \"full\"\n    }\n  ]\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/91a6cce-docs_03.jpg\",\n        \"docs_03.jpg\",\n        1700,\n        1867,\n        \"#23518a\"\n      ],\n      \"sizing\": \"full\"\n    }\n  ]\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/1936f10-docs_04.jpg\",\n        \"docs_04.jpg\",\n        1700,\n        1519,\n        \"#e5e5ea\"\n      ],\n      \"sizing\": \"full\"\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"title\": \"Pulsate Toolbar Customization\"\n}\n[/block]\nWith the release of version 2.14.12 Developers can now add an additional button in the Pulsate Feed. The button will appear in the main Feed Toolbar in the right corner.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/c246073-IMG_0025.PNG\",\n        \"IMG_0025.PNG\",\n        750,\n        1334,\n        \"#d8cebc\"\n      ]\n    }\n  ]\n}\n[/block]\nTo add this button you need to call the new *setInboxRightButton* method and pass an *UIBarButtonItem* that you want to show. This should be done in the AppDelegate under *didFinishLaunchingWithOptions*.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"UIButton* _helpButton = [UIButton buttonWithType:UIButtonTypeSystem];\\n[_helpButton setTitle::::at:::\\\"Help\\\" forState:UIControlStateNormal];\\n[_helpButton sizeToFit];\\n[_helpButton addTarget:self action:@selector(helpPressed) forControlEvents:UIControlEventTouchUpInside];\\nUIBarButtonItem* helpItem = [[UIBarButtonItem alloc] initWithCustomView:_helpButton];\\n[pulsateManager setInboxRightButton:helpItem];\\n\\n-(void) helpPressed {\\n\\n}\",\n      \"language\": \"objectivec\"\n    }\n  ]\n}\n[/block]\n\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"let helpButton = UIBarButtonItem(\\n  title: \\\"Help\\\",\\n  style: .plain,\\n  target: self,\\n  action: #selector(helpPressed(sender:))\\n)\\npulsateManager.setInboxRightButton(helpButton)\\n    \\n@objc func helpPressed(sender: UIBarButtonItem) {\\n\\n}\",\n      \"language\": \"swift\"\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"title\": \"User Avatar Customization\"\n}\n[/block]\nThe user avatar by default is set to use the user initials when possible, when not available the user avatar will be an anonymous icon. With the release of version 2.14.12 Developers can now disable showing initials as the user avatar, this will cause the avatar to be the anonymous icon even if FirstName and LatName are set. This can be done by calling the new *useInitialsForUserAvatar* method. This should be done in the AppDelegate under *didFinishLaunchingWithOptions*.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"[pulsateManager useInitialsForUserAvatar:NO];\",\n      \"language\": \"objectivec\"\n    }\n  ]\n}\n[/block]\n\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"pulsateManager.useInitials(forUserAvatar: false)\",\n      \"language\": \"swift\"\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"title\": \"Font Customization\"\n}\n[/block]\nTo change the fonts that are used in the Pulsate Inbox Developers can override the UIFont class and set default fonts for UITextField and UILabel in their AppDelegate. \n\nPlease create the following files in your project - UIFont+SystemFontOverride.h and UIFont+SystemFontOverride.m. The font we will use in this Demo is called \"PartyLetPlain\", change this font to any other you want to use.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"//  UIFont+SystemFontOverride.h\\n\\n#import <UIKit/UIKit.h>\\n\\n@interface UIFont (SystemFontOverride)\\n@end\",\n      \"language\": \"objectivec\",\n      \"name\": \"UIFont+SystemFontOverride.h\"\n    }\n  ]\n}\n[/block]\n\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"//  UIFont+SystemFontOverride.m\\n\\n#import <objc/runtime.h>\\n#import \\\"UIFont+SystemFontOverride.h\\\"\\n\\nNSString *const FORegularFontName = @\\\"PartyLetPlain\\\";\\nNSString *const FOBoldFontName = @\\\"PartyLetPlain\\\";\\nNSString *const FOItalicFontName = @\\\"PartyLetPlain\\\";\\n\\n@implementation UIFont (SystemFontOverride)\\n\\n#pragma clang diagnostic push\\n#pragma clang diagnostic ignored \\\"-Wobjc-protocol-method-implementation\\\"\\n+ (void)replaceClassSelector:(SEL)originalSelector withSelector:(SEL)modifiedSelector {\\n    Method originalMethod = class_getClassMethod(self, originalSelector);\\n    Method modifiedMethod = class_getClassMethod(self, modifiedSelector);\\n    method_exchangeImplementations(originalMethod, modifiedMethod);\\n}\\n\\n+ (void)replaceInstanceSelector:(SEL)originalSelector withSelector:(SEL)modifiedSelector {\\n    Method originalDecoderMethod = class_getInstanceMethod(self, originalSelector);\\n    Method modifiedDecoderMethod = class_getInstanceMethod(self, modifiedSelector);\\n    method_exchangeImplementations(originalDecoderMethod, modifiedDecoderMethod);\\n}\\n\\n+ (UIFont *)regularFontWithSize:(CGFloat)size\\n{\\n    return [UIFont fontWithName:FORegularFontName size:size];\\n}\\n\\n+ (UIFont *)boldFontWithSize:(CGFloat)size\\n{\\n    return [UIFont fontWithName:FOBoldFontName size:size];\\n}\\n\\n+ (UIFont *)italicFontOfSize:(CGFloat)fontSize\\n{\\n    return [UIFont fontWithName:FOItalicFontName size:fontSize];\\n}\\n\\n- (id)initCustomWithCoder:(NSCoder *)aDecoder {\\n    BOOL result = [aDecoder containsValueForKey:@\\\"UIFontDescriptor\\\"];\\n    \\n    if (result) {\\n        UIFontDescriptor *descriptor = [aDecoder decodeObjectForKey:@\\\"UIFontDescriptor\\\"];\\n        \\n        NSString *fontName;\\n        if ([descriptor.fontAttributes[@\\\"NSCTFontUIUsageAttribute\\\"] isEqualToString:@\\\"CTFontRegularUsage\\\"]) {\\n            fontName = FORegularFontName;\\n        }\\n        else if ([descriptor.fontAttributes[@\\\"NSCTFontUIUsageAttribute\\\"] isEqualToString:@\\\"CTFontEmphasizedUsage\\\"]) {\\n            fontName = FOBoldFontName;\\n        }\\n        else if ([descriptor.fontAttributes[@\\\"NSCTFontUIUsageAttribute\\\"] isEqualToString:@\\\"CTFontObliqueUsage\\\"]) {\\n            fontName = FOItalicFontName;\\n        }\\n        else {\\n            fontName = descriptor.fontAttributes[@\\\"NSFontNameAttribute\\\"];\\n        }\\n        \\n        return [UIFont fontWithName:fontName size:descriptor.pointSize];\\n    }\\n    \\n    self = [self initCustomWithCoder:aDecoder];\\n    \\n    return self;\\n}\\n\\n+ (void)load\\n{\\n    [self replaceClassSelector:@selector(systemFontOfSize:) withSelector:@selector(regularFontWithSize:)];\\n    [self replaceClassSelector:@selector(boldSystemFontOfSize:) withSelector:@selector(boldFontWithSize:)];\\n    [self replaceClassSelector:@selector(italicSystemFontOfSize:) withSelector:@selector(italicFontOfSize:)];\\n    \\n    [self replaceInstanceSelector:@selector(initWithCoder:) withSelector:@selector(initCustomWithCoder:)];\\n}\\n#pragma clang diagnostic pop\\n@end\",\n      \"language\": \"objectivec\",\n      \"name\": \"UIFont+SystemFontOverride.m\"\n    }\n  ]\n}\n[/block]","excerpt":"","slug":"custom-theming-the-feed","type":"basic","title":"Custom Theming the Pulsate SDK"}

Custom Theming the Pulsate SDK


You can very easily customise the appearance of all Pulsate SDK's UI so it fits your needs. You can change colors of all elements and the content of texts. [block:api-header] { "type": "basic", "title": "Pulsate Configuration JSON" } [/block] The *pulsateConfiguration.json* file can be found the *PULPulsateBasic.bundle*. The easiest way to find the file is just to type it's name into XCode's explorer. [block:image] { "images": [ { "image": [ "https://files.readme.io/OjrMnXEsTH2j270cUktP_config2.png", "config2.png", "604", "1290", "#36576c", "" ], "caption": "" } ] } [/block] If you want to use a custom color, just put a hexadecimal color in the element you want to change. If you want to color the navigation bar to yellow just put a hexadecimal number in the corresponding element *"pulsate_top_nav_bar_background_color" : "#ffde17"* [block:image] { "images": [ { "image": [ "https://files.readme.io/be9897a-docs_01.jpg", "docs_01.jpg", 1700, 1867, "#2f5472" ], "sizing": "full" } ] } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/d0127bc-docs_02.jpg", "docs_02.jpg", 1700, 1867, "#767a89" ], "sizing": "full" } ] } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/91a6cce-docs_03.jpg", "docs_03.jpg", 1700, 1867, "#23518a" ], "sizing": "full" } ] } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/1936f10-docs_04.jpg", "docs_04.jpg", 1700, 1519, "#e5e5ea" ], "sizing": "full" } ] } [/block] [block:api-header] { "title": "Pulsate Toolbar Customization" } [/block] With the release of version 2.14.12 Developers can now add an additional button in the Pulsate Feed. The button will appear in the main Feed Toolbar in the right corner. [block:image] { "images": [ { "image": [ "https://files.readme.io/c246073-IMG_0025.PNG", "IMG_0025.PNG", 750, 1334, "#d8cebc" ] } ] } [/block] To add this button you need to call the new *setInboxRightButton* method and pass an *UIBarButtonItem* that you want to show. This should be done in the AppDelegate under *didFinishLaunchingWithOptions*. [block:code] { "codes": [ { "code": "UIButton* _helpButton = [UIButton buttonWithType:UIButtonTypeSystem];\n[_helpButton setTitle:@\"Help\" forState:UIControlStateNormal];\n[_helpButton sizeToFit];\n[_helpButton addTarget:self action:@selector(helpPressed) forControlEvents:UIControlEventTouchUpInside];\nUIBarButtonItem* helpItem = [[UIBarButtonItem alloc] initWithCustomView:_helpButton];\n[pulsateManager setInboxRightButton:helpItem];\n\n-(void) helpPressed {\n\n}", "language": "objectivec" } ] } [/block] [block:code] { "codes": [ { "code": "let helpButton = UIBarButtonItem(\n title: \"Help\",\n style: .plain,\n target: self,\n action: #selector(helpPressed(sender:))\n)\npulsateManager.setInboxRightButton(helpButton)\n \n@objc func helpPressed(sender: UIBarButtonItem) {\n\n}", "language": "swift" } ] } [/block] [block:api-header] { "title": "User Avatar Customization" } [/block] The user avatar by default is set to use the user initials when possible, when not available the user avatar will be an anonymous icon. With the release of version 2.14.12 Developers can now disable showing initials as the user avatar, this will cause the avatar to be the anonymous icon even if FirstName and LatName are set. This can be done by calling the new *useInitialsForUserAvatar* method. This should be done in the AppDelegate under *didFinishLaunchingWithOptions*. [block:code] { "codes": [ { "code": "[pulsateManager useInitialsForUserAvatar:NO];", "language": "objectivec" } ] } [/block] [block:code] { "codes": [ { "code": "pulsateManager.useInitials(forUserAvatar: false)", "language": "swift" } ] } [/block] [block:api-header] { "title": "Font Customization" } [/block] To change the fonts that are used in the Pulsate Inbox Developers can override the UIFont class and set default fonts for UITextField and UILabel in their AppDelegate. Please create the following files in your project - UIFont+SystemFontOverride.h and UIFont+SystemFontOverride.m. The font we will use in this Demo is called "PartyLetPlain", change this font to any other you want to use. [block:code] { "codes": [ { "code": "// UIFont+SystemFontOverride.h\n\n#import <UIKit/UIKit.h>\n\n@interface UIFont (SystemFontOverride)\n@end", "language": "objectivec", "name": "UIFont+SystemFontOverride.h" } ] } [/block] [block:code] { "codes": [ { "code": "// UIFont+SystemFontOverride.m\n\n#import <objc/runtime.h>\n#import \"UIFont+SystemFontOverride.h\"\n\nNSString *const FORegularFontName = @\"PartyLetPlain\";\nNSString *const FOBoldFontName = @\"PartyLetPlain\";\nNSString *const FOItalicFontName = @\"PartyLetPlain\";\n\n@implementation UIFont (SystemFontOverride)\n\n#pragma clang diagnostic push\n#pragma clang diagnostic ignored \"-Wobjc-protocol-method-implementation\"\n+ (void)replaceClassSelector:(SEL)originalSelector withSelector:(SEL)modifiedSelector {\n Method originalMethod = class_getClassMethod(self, originalSelector);\n Method modifiedMethod = class_getClassMethod(self, modifiedSelector);\n method_exchangeImplementations(originalMethod, modifiedMethod);\n}\n\n+ (void)replaceInstanceSelector:(SEL)originalSelector withSelector:(SEL)modifiedSelector {\n Method originalDecoderMethod = class_getInstanceMethod(self, originalSelector);\n Method modifiedDecoderMethod = class_getInstanceMethod(self, modifiedSelector);\n method_exchangeImplementations(originalDecoderMethod, modifiedDecoderMethod);\n}\n\n+ (UIFont *)regularFontWithSize:(CGFloat)size\n{\n return [UIFont fontWithName:FORegularFontName size:size];\n}\n\n+ (UIFont *)boldFontWithSize:(CGFloat)size\n{\n return [UIFont fontWithName:FOBoldFontName size:size];\n}\n\n+ (UIFont *)italicFontOfSize:(CGFloat)fontSize\n{\n return [UIFont fontWithName:FOItalicFontName size:fontSize];\n}\n\n- (id)initCustomWithCoder:(NSCoder *)aDecoder {\n BOOL result = [aDecoder containsValueForKey:@\"UIFontDescriptor\"];\n \n if (result) {\n UIFontDescriptor *descriptor = [aDecoder decodeObjectForKey:@\"UIFontDescriptor\"];\n \n NSString *fontName;\n if ([descriptor.fontAttributes[@\"NSCTFontUIUsageAttribute\"] isEqualToString:@\"CTFontRegularUsage\"]) {\n fontName = FORegularFontName;\n }\n else if ([descriptor.fontAttributes[@\"NSCTFontUIUsageAttribute\"] isEqualToString:@\"CTFontEmphasizedUsage\"]) {\n fontName = FOBoldFontName;\n }\n else if ([descriptor.fontAttributes[@\"NSCTFontUIUsageAttribute\"] isEqualToString:@\"CTFontObliqueUsage\"]) {\n fontName = FOItalicFontName;\n }\n else {\n fontName = descriptor.fontAttributes[@\"NSFontNameAttribute\"];\n }\n \n return [UIFont fontWithName:fontName size:descriptor.pointSize];\n }\n \n self = [self initCustomWithCoder:aDecoder];\n \n return self;\n}\n\n+ (void)load\n{\n [self replaceClassSelector:@selector(systemFontOfSize:) withSelector:@selector(regularFontWithSize:)];\n [self replaceClassSelector:@selector(boldSystemFontOfSize:) withSelector:@selector(boldFontWithSize:)];\n [self replaceClassSelector:@selector(italicSystemFontOfSize:) withSelector:@selector(italicFontOfSize:)];\n \n [self replaceInstanceSelector:@selector(initWithCoder:) withSelector:@selector(initCustomWithCoder:)];\n}\n#pragma clang diagnostic pop\n@end", "language": "objectivec", "name": "UIFont+SystemFontOverride.m" } ] } [/block]