{"_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]","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]