Customize the appearance of the player (iOS)

An engaging app experience is not driven solely by media and player functionality. In many use cases, you have added a video player to enhance the user's experience of your app -- not to showcase the video player.

Through the iOS SDK's customization options, you can add a video player that seamlessly blends with the aesthetic of your app and strengthens your brand.

Player Skin

To customize the player's skin you must set a JWPlayerSkin instance to your instance of JWPlayerViewController.

let skinStylingBuilder = JWPlayerSkinBuilder()
// Call methods on the builder to create your desired style.
let skinStyling = try? skinStylingBuilder.build()
controller.styling = skinStyling

JWPlayerSkinBuilder *skinStylingBuilder = [JWPlayerSkinBuilder new];
// Call methods on the builder to create your desired style.
JWPlayerSkin *skinStyling = [skinStylingBuilder build];
controller.styling = skinStyling;

Color Customization

Using JWPlayerSkin you can edit the color of the elements contained in the controlbar, timeslider, and menus.

let controlBarStyleBuilder = JWControlBarStyleBuilder()
// Call methods on the builder to create your desired style.
let controlbarStyling = controlBarStyleBuilder.build()
skinStyling.controlBarStyle(controlbarStyling)

JWControlBarStyleBuilder *controlBarStyleBuilder = [JWControlBarStyleBuilder new];
// Call methods on the builder to create your desired style.
JWControlBarStyle *controlbarStyling = controlBarStyleBuilder.build();
[skinStylingBuilder controlBarStyle: controlbarStyling];

Branding Image

The JWP iOS SDK enables you to add a branding image (logo or watermark) to the player.

2015 — iPhone screen with a JWP branding logo

Within the JWPlayerViewController, use JWLogoBuilder() to create a JWLogo object. Be sure to define imageFile.

// Subclass of JWPlayerViewController
class PlayerViewController: JWPlayerViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        
        do {
            // Create logo
            self.logo = try JWLogoBuilder()
                .imageFile(URL(string: "http://mylogo.jpg")!)
                .fades(false)
                .margin(10)
                .position(.bottomLeft)
                .weblink(URL(string: "http://mywebsite.com")!)
                .build()
        }
        catch {
            print(error)
        }
        
        // Create player config and load.
        ...
    }
}

// Subclass of JWPlayerObjViewController
@implementation PlayerViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    NSError *error;
    NSURL *imageUrl = [NSURL URLWithString:@"http://mylogo.jpg"];
    NSURL *siteUrl = [NSURL URLWithString:@"http://mywebsite.com"];
    
    // Create logo
    JWLogo *logo = [[[[[[[JWLogoBuilder new] imageFile:imageUrl]
                        fades:NO]
                       margin:10]
                      position:JWLogoPositionBottomLeft]
                     weblink:siteUrl]
                    buildAndReturnError:&error];
    self.logo = logo;
    
    // Create player config and load.
    ...
}