Embedded YouTube Video Thumbnail Flashes Red

Discussion in 'iOS Programming' started by RagingGoat, Nov 12, 2012.

  1. RagingGoat macrumors 6502

    Joined:
    Jun 21, 2010
    #1
    I have a YouTube thumbnail embedded in my app. It works just fine but the thumbnail is just a red box for a couple seconds before the thumbnail image appears. I'm wondering if anyone knows how to get rid of that flash of red? Here is my code:
    Code:
    //
    //  YouTubeView.m
    //  KFBNewsroom
    //
    //  Created by KFB on 11/8/12.
    //  Copyright (c) 2012 com.kfb. All rights reserved.
    //
    
    #import "YouTubeView.h"
    
    @interface YouTubeView ()
    
    @end
    
    @implementation YouTubeView
    @synthesize thumbnailView;
    
    - (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
    {
        self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
        if (self) {
            // Custom initialization
        }
        return self;
    }
    
    - (void)viewDidLoad
    {
        [super viewDidLoad];
        self.title = @"Monthly Video";
        // Do any additional setup after loading the view from its nib.
        // webView is a UIWebView, either initialized programmatically or loaded as part of a xib.
        
        NSString *htmlString = @"<html><head><meta name = \"viewport\" content = \"initial-scale = 1.0, user-scalable = no, width = 280\"/></head><body style=\"background:#F00;margin-top:0px;margin-left:0px\"><div><object width=\"280\" height=\"218\"><param name=\"movie\" value=\"http://www.youtube.com/embed/videoseries?list=PL0B9BF37A24840E28&hl=en_US""></param><param name=\"wmode\" value=\"transparent\"></param><embed src=\"http://www.youtube.com/embed/videoseries?list=PL0B9BF37A24840E28&hl=en_US""type=\"application/x-shockwave-flash\" wmode=\"transparent\" width=\"280\" height=\"218\"></embed></object></div></body></html>";
        
        [thumbnailView loadHTMLString:htmlString baseURL:[NSURL URLWithString:@"http://www.youtube.com/playlist?list=PL0B9BF37A24840E28&feature=plcp"]];
    
    }
    
    - (void)didReceiveMemoryWarning
    {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    
    @end
    
     
  2. ccamelot macrumors member

    ccamelot

    Joined:
    Feb 21, 2010
    Location:
    Poland
    #2
    Just make your HTML background transparent

    Just make your HTML background transparent.
    Here:
    Code:
    <body style=\"background:#F00;margin-top:0 ...
    change it to:
    Code:
    <body style=\"background:transparent;margin-top:0
    Why you're loading this thumbnail to UIWebView? Better make UIImage from remote file and put it into UIImageView.

    Code:
    UIImage *thumbnail = [UIImage imageWithData:[NSData dataWithContentsOfURL:[NSURL urlWithString:@"http://www.youtube.com/yourThumbnail.jpg"]]];
    [myUIImageView setImage:thumbnail];
    ...something like that.
     
  3. RagingGoat thread starter macrumors 6502

    Joined:
    Jun 21, 2010
    #3
    @ccamelot,

    I just saw your reply but I actually figured it out already. This is actually how I'm doing it now.

    Code:
    //
    //  YouTubeView.m
    //  KFBNewsroom
    //
    //  Created by Adam Rayborn/Jon Mattingly on 11/8/12.
    //  Copyright (c) 2012 com.kfb. All rights reserved.
    //
    
    #import "YouTubeView.h"
    #import <MediaPlayer/MediaPlayer.h>
    #import "KFBAppDelegate.h"
    @interface YouTubeView ()
    {
        UIWindow *window;
    }
    
    @end
    
    @implementation YouTubeView
    @synthesize thumbnailView;
    - (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
    {
        self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
        if (self) {
            thumbnailView.backgroundColor = [UIColor clearColor];
            KFBAppDelegate* myDelegate = (((KFBAppDelegate*) [UIApplication sharedApplication].delegate));
            window = myDelegate.window;
            // Custom initialization
            
            [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(youTubeStarted:) name:@"UIMoviePlayerControllerDidEnterFullscreenNotification" object:nil];
            [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(youTubeFinished:) name:@"UIMoviePlayerControllerDidExitFullscreenNotification" object:nil];
    
        }
        return self;
    }
    
    - (void)viewDidLoad
    {
        [super viewDidLoad];
        /*
        
        
    
        
        
        [self.view setBounds:CGRectMake( 0, 0, 480, 320)];
        [self.view setCenter:CGPointMake(160, 240)];
        [self.view setTransform:CGAffineTransformMakeRotation(M_PI/ 2)];
         */
        self.title = @"Monthly Video";
        // Do any additional setup after loading the view from its nib.
        // webView is a UIWebView, either initialized programmatically or loaded as part of a xib.
        
        int screenWidth = [UIScreen mainScreen].bounds.size.height;
        NSString *htmlString = [NSString stringWithFormat:@"<html><head><meta name = \"viewport\" content = \"initial-scale = 1.0, user-scalable = no, width = %d\"/></head><body style=\"background:#000;margin-top:10px;margin-left:0px\"><div><object width=\"220\" height=\"128\"><param name=\"movie\" value=\"http://www.youtube.com/embed/videoseries?list=PL0B9BF37A24840E28&hl=en_US""></param><param name=\"wmode\" value=\"transparent\"></param><embed src=\"http://www.youtube.com/embed/videoseries?list=PL0B9BF37A24840E28&hl=en_US""type=\"application/x-shockwave-flash\" wmode=\"transparent\" width=\"%d\" height=\"218\"></embed></object></div></body></html>",screenWidth,screenWidth];
        
    
        [thumbnailView loadHTMLString:htmlString baseURL:[NSURL URLWithString:@"http://www.youtube.com/playlist?list=PL0B9BF37A24840E28&feature=plcp"]];
        
    }
    
    -(IBAction)back:(id)sender
    {
        [self dismissViewControllerAnimated:YES completion:nil];
    }
    
    - (void)didReceiveMemoryWarning
    {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    - (UIInterfaceOrientation)preferredInterfaceOrientationForPresentation
    {
        return UIInterfaceOrientationLandscapeLeft;
    }
    
    -(NSUInteger)supportedInterfaceOrientations
    {
        return UIInterfaceOrientationMaskLandscape;
        //return UIDeviceOrientationLandscapeLeft | UIDeviceOrientationLandscapeRight | UIDeviceOrientationPortraitUpsideDown;
    }
    -(void)youTubeStarted:(id)sender
    {
        NSLog(@"Video Starting");
    
    }
    -(void)youTubeFinished:(id)sender
    {
        NSLog(@"bye");
    }
    @end
    
     

Share This Page