GetSocial UI on iOS¶

Prerequisites¶

Finished Getting Started with GetSocial iOS SDK guide.
Have GetSocialUI.framework added to your dependencies.

Show GetSocial UI View¶

To create GetSocial View you have to build it first of all. All GetSocial Views extend from GetSocialUIView class.

```objc tab=”Objective-C”
GetSocialUIView *view = …;//create view here

BOOL wasShown = [view show];
//or
//BOOL wasShown = [GetSocialUI showView:view];

```swift tab="Swift"
let view = ... // create view here
let wasShown = view.show()
// or
// let wasShown = GetSocialUI.show(view)

Both of the methods will show GetSocial View on top of the current activity and return YES if the view was shown, or NO otherwise. You can find an error, why GetSocial View was not shown in your Xcode console.

Let’s create Smart Invites View as an example:

```objc tab=”Objective-C”
GetSocialUIView *view = [GetSocialUI createInvitesView];

```swift tab="Swift"
let view = GetSocialUI.createInvitesView()

Custom Titles¶

All GetSocial Views have default localized titles, but you can easily set a custom one as well. In this case, you’ll need to handle localization on your own. Here’s how you can set a title for Smart Invites View:

```objc tab=”Objective-C”
GetSocialUIView *view = [GetSocialUI createInvitesView];
view.windowTitle = @”Share with Friends!”;
[view show];

```swift tab="Swift"
let view = GetSocialUI.createInvitesView()
view.windowTitle = "Share with Friends!"
view.show()

And voi la - your window now has a new title. To handle localization, you can use [GetSocial language] method to get the current language, all supported language codes are placed in GetSocialConstants.h with GetSocial_Languages_ prefix. Read more about Localization here.

Control GetSocial View State¶

GetSocial UI provides you with all the instruments to control the state of its views. You have already read how to show GetSocial View. Now let’s try closing it. Do this with:

```objc tab=”Objective-C”
BOOL saveState = NO;
[GetSocialUI closeView:saveState];

```swift tab="Swift"
let saveState = false
GetSocialUI.closeView(saveState)

It will close current visible GetSocial View or do nothing if there is no GetSocial View.

If you want to close GetSocial View saving its current state and restore it later, pass YES as saveState parameter:

```objc tab=”Objective-C”
// close and save
BOOL saveState = YES;
[GetSocialUI closeView:saveState];

// and restore
[GetSocialUI restoreView];

```swift tab="Swift"
// close and save
let saveState = true
GetSocialUI.closeView(saveState)

// and restore
GetSocialUI.restoreView()

Warning

If you want to show new GetSocial view after you closed other with saving state, your saved state will be lost, and the view will be opened as usual. Calling restoreView after that will not affect anything.

View State Events¶

If you want to be notified about onOpen and onClose events of GetSocial View, you can set handlers to a view before showing it.

```objc tab=”Objective-C”
GetSocialUIView *view = [GetSocialUI createInvitesView];
[view setHandlerForViewOpen:^{
// GetSocial View was opened
} close:^{
// GetSocial View was closed
}];
[view show];

```swift tab="Swift"
view.setHandlerForViewOpen({
    // GetSocial View was opened
}) {
    // GetSocial View was closed
}
view.show()

GetSocial UI does all the job of communicating with the underlying GetSocial Data API for you. However, sometimes, you may want to customize the behavior of GetSocial UI and have more control over user’s actions. That is why we introduced GetSocialUIActionHandler. When you create GetSocial View, you can set a listener to be notified about user’s events, track them, allow or disallow, etc.:

```objc tab=”Objective-C”
GetSocialUIActivityFeedView *view = [GetSocialUI createGlobalActivityFeedView];
[view setUiActionHandler:^(GetSocialUIActionType actionType, GetSocialUIPendingAction pendingAction) {
[self trackAnalytics:actionType];
[self checkIfAllowed:actionType onAllowed:^() {
pendingAction();
}];
}];
[view show];

```swift tab="Swift"
let view = GetSocialUI.createGlobalActivityFeedView()
view.setUiActionHandler { (actionType: GetSocialUIActionType, pendingAction: GetSocialUIPendingAction?) in
    self.trackAnalytics(actionType)
    self.checkIfAllowed(actionType, onAllowed: {
        pendingAction()
    })
})
view.show()

All possible events are listed in GetSocialUIActionType enumeration.

Warning

If you did not set a GetSocialUIActionHandler, all actions are executed as usual, but if you set it, you have to call pendingAction() block each time when you want to execute an action. Otherwise, it will not be performed.

For example, if the user is not authorized, you could prompt him to log in with Facebook and add an identity in your checkIfAllowed:onAllowed: method, and in case of success - proceed with an action. Proceeding can be done asynchronously.

Also, you can track events using your internal analytics.

Note

If you have some problems showing an alert or view while GetSocial UI View is opened, call [GetSocialUI closeView:YES]. Later, after your view is closed, call [GetSocialUI restoreView] and pendingAction() if you want to perform an action, or just [GetSocialUI restoreView] to get back to GetSocial UI View.

Load UI Configuration¶

To customize GetSocial UI you have to provide custom assets (drawables, fonts) and JSON configuration file. The easiest way to start, is to download one of the included themes (Default, Dark or Light) and do small tweaks on the JSON configuration (see the reference) or resources.

On iOS, all assets, as well as UI configuration JSON, should be located inside the main bundle under the Resources/ folder.

For instance, to make GetSocial UI wider for landscape orientation you have to:

Create a UI configuration file, e.g. Resources/getsocial/ui-landscape.json with the following content:

{
    "base-design": {
        "scale-mode": "scale-with-screen-size",
        "width": 640,
        "height": 320,
        "ppi": 72
    },
    "elements": {
        "window": {
            "width": 500,
            "height": 320
        }
    }
}

Load UI Configuration.
- If you are using GetSocial iOS Installer Script you have to add ui-config parameter to getsocial.sh in the Xcode project Build Phases section:
```
getsocial.sh --app-id=[GetSocial App Id] --ui-config="getsocial/ui-landscape.json"
```
- If you are not using iOS Installer script check how to load UI Configuration in the Manual Integration Guide.
- Or if you want to load UI Configuration dynamically from the code:
  
```objc tab=”Objective-C”
NSString *configPath = [[NSBundle mainBundle] pathForResource:@”ui-landscape” ofType:@”json” inDirectory:@”getsocial”];

BOOL wasLoaded = [GetSocialUI loadConfiguration:configPath];
NSLog(@”UI configuration was loaded successfully: %d”, wasLoaded);
```
```swift tab="Swift"
let configPath = Bundle.main.path(forResource: "ui-landscape", ofType: "json", inDirectory: "getsocial")
if let path = configPath {
    let wasLoaded = GetSocialUI.loadConfiguration(path)
}
print("UI configuration was loaded successfully: \(wasLoaded)")
```
  [GetSocialUI loadConfiguration:…] is Deprecated
  
  Loading UI Configuration from code has the limitation: you have to load it on every entry point to the app, e.g., when the user opens the app from push notification.
  When you provide the path to UI Configuration in the .plist file we handle UI Configuration loading automatically.

Next Steps¶

Customize GetSocial UI

Give us your feedback! Was this article helpful?

😀 🙁