Socialize Action Bar

Introduction

The Socialize Action Bar is a prebuilt control that exposes some core Socialize functionality. It is a relatively simple drop-in component and can quickly be added to any app that might benefit from additional social features. The Action Bar is customizable, so you can pick and choose which components you’d like displayed.

images/action_bar_default.png

Note

If you have been using the Socialize Action Bar from previous releases, you should note that the new action bar (SZActionBar) is incompatible with the old (SocializeActionBar). To upgrade from the old action bar to the new, you will have to update your code. The main difference is that the new action bar is a UIView subclass.

Displaying the Action Bar

Simple Display

The simplest way to use the action bar is just by calling showActionBarInViewController:entity:options: on the SZActionBarUtils class.

// Store the action bar in a property on your view controller

#import <Socialize/Socialize.h>

@interface CreateActionBarViewController : UIViewController
@property (nonatomic, retain) SZActionBar *actionBar;
@property (nonatomic, retain) id<SZEntity> entity;
@end
// Implementation

// Instantiate the action bar in your view controller

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];

    if (self.actionBar == nil) {
        self.entity = [SZEntity entityWithKey:@"some_entity" name:@"Some Entity"];
        self.actionBar = [SZActionBarUtils showActionBarWithViewController:self entity:self.entity options:nil];
        
        SZShareOptions *shareOptions = [SZShareUtils userShareOptions];
        shareOptions.dontShareLocation = YES;
        
        shareOptions.willAttemptPostingToSocialNetworkBlock = ^(SZSocialNetwork network, SZSocialNetworkPostData *postData) {
            if (network == SZSocialNetworkTwitter) {
                NSString *entityURL = [[postData.propagationInfo objectForKey:@"twitter"] objectForKey:@"entity_url"];
                NSString *displayName = [postData.entity displayName];
                NSString *customStatus = [NSString stringWithFormat:@"Custom status for %@ with url %@", displayName, entityURL];
                
                [postData.params setObject:customStatus forKey:@"status"];
                
            } else if (network == SZSocialNetworkFacebook) {
                NSString *entityURL = [[postData.propagationInfo objectForKey:@"facebook"] objectForKey:@"entity_url"];
                NSString *displayName = [postData.entity displayName];
                NSString *customMessage = [NSString stringWithFormat:@"Custom status for %@ ", displayName];
                
                [postData.params setObject:customMessage forKey:@"message"];
                [postData.params setObject:entityURL forKey:@"link"];
                [postData.params setObject:@"A caption" forKey:@"caption"];
                [postData.params setObject:@"Custom Name" forKey:@"name"];
                [postData.params setObject:@"A Site" forKey:@"description"];
            }
        };
        
        self.actionBar.shareOptions = shareOptions;
    }
}

@end

Manual Display

Since the action bar is just a UIView subclass, you can instantiate one yourself If you initialize the view with a frame of CGRectNull (or if SZActionBarUtils is used), the Action Bar will automatically place itself at the bottom of its superview and adjust to rotation.

// Implementation

// Instantiate the action bar in your view controller

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    if (self.actionBar == nil) {
        self.entity = [SZEntity entityWithKey:@"some_entity" name:@"Some Entity"];
        self.actionBar = [SZActionBar defaultActionBarWithFrame:CGRectNull entity:self.entity viewController:self];
        [self.view addSubview:self.actionBar];
    }
}

Manual Display with Custom Frame

If you’d like the bar to appear somewhere else, you can initialize the bar with a custom frame.

If you do this, you should note that the default autoresizing mask for the action bar is UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleTopMargin, which is suitable for a bar that hugs the buttom of a view. If you wish to display the bar somewhere else, you should adjust the autoresizing mask accordingly, as below.

// Implementation

// Instantiate the action bar in your view controller

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    if (self.actionBar == nil) {
        self.entity = [SZEntity entityWithKey:@"some_entity" name:@"Some Entity"];
        self.actionBar = [SZActionBar defaultActionBarWithFrame:CGRectZero entity:self.entity viewController:self];
        self.actionBar.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin;
        [self.view addSubview:self.actionBar];
    }
}

Manual Display with Custom Buttons

If you don’t like the default buttons on the bar, or if you’d like to add your own, you can do so by changing the itemsLeft and itemsRight properties. If you change these properties, you should specify an NSArray with elements of type UIView. You can also take advantage of the SZActionButton class, which allows you to specify both an actionBlock and an entityConfigurationBlock. The following example shows how you might add both an email and a panic button to the action bar.

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    if (self.actionBar == nil) {
        self.entity = [SZEntity entityWithKey:@"some_entity" name:@"Some Entity"];
        self.actionBar = [SZActionBar defaultActionBarWithFrame:CGRectNull entity:self.entity viewController:self];
        
        SZActionButton *panicButton = [SZActionButton actionButtonWithIcon:nil title:@"Panic"];
        panicButton.actionBlock = ^(SZActionButton *button, SZActionBar *bar) {
            UIAlertView *alertView = [[UIAlertView alloc] initWithTitle:@"Oh no!" message:nil delegate:nil cancelButtonTitle:nil otherButtonTitles:@"OK", nil];
            [alertView show];
        };
        self.actionBar.itemsRight = [NSArray arrayWithObjects:panicButton, [SZActionButton commentButton], nil];
        
        UIButton *likeButton = [[UIButton alloc] initWithFrame:CGRectZero];
        UIImage *backgroundImage = [[UIImage imageNamed:@"action-bar-button-red-ios7.png"] stretchableImageWithLeftCapWidth:0 topCapHeight:0];
        UIImage *buttonImage = [UIImage imageNamed:@"action-bar-icon-liked.png"];
        [likeButton setBackgroundImage:backgroundImage forState:UIControlStateNormal];
        [likeButton setImage:buttonImage forState:UIControlStateNormal];
        [likeButton sizeToFit];
        [likeButton addTarget:self action:@selector(likeButtonPressed:) forControlEvents:UIControlEventTouchUpInside];
        self.actionBar.itemsLeft = [NSArray arrayWithObjects:[SZActionButton viewsButton], likeButton, nil];
        
        [self.view addSubview:self.actionBar];
    }
}

- (void)likeButtonPressed:(id)sender {
    //code for like button goes here
}
images/action_bar_custom_buttons.png

Custom Background

For iOS 6 and earlier, you can change the background image and transparency of the bar image. For iOS 7 and later, you can customize the “flatter” look by changing the background color and transparency of the bar itself:

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    if (self.actionBar == nil) {
        self.entity = [SZEntity entityWithKey:@"some_entity" name:@"Some Entity"];
        self.actionBar = [SZActionBar defaultActionBarWithFrame:CGRectNull entity:self.entity viewController:self];
        
        //iOS 6 and earlier
        UIImage *customBackground = [[UIImage imageNamed:@"action-bar-bg.png"] stretchableImageWithLeftCapWidth:0.5 topCapHeight:0.5];
        self.actionBar.backgroundImageView.image = customBackground;
        self.actionBar.backgroundImageView.alpha = 0.3f;

        //iOS 7 and later
        [self.actionBar setBackgroundColor:[UIColor blueColor]];
        [self.actionBar setAlpha:0.5f];
        
        [self.view addSubview:self.actionBar];
    }
}

NOTE: iOS 7 introduced a range of new design principles and standards you should consider when designing apps for iOS 7 and later. Apple’s guidelines can be found here.