Encounter scene: First the live broadcast needs to show the gift (moving gift)

Solution: According to the previous consideration is to load GIF, but GIF will produce sawteeth and the gift is not beautiful, finally we thought of WebP, we will UI design several PNG frames into webP format.

I used YYWebImage to load the webp first

Pod 'YYWebImage', '~ > 1.0.5'Copy the code

1 Follow the execution

pod 'YYImage/WebP'
Copy the code

1 perform the first step or the second webp will not load. Finally, let’s open up the project and see if we have webp.Framwork

In fact, there are two kinds of WebP, one is static, one is dynamic (similar to GIF many pieces of a moving picture)

This is static WebP

YYAnimatedImageView *imgView = [[YYAnimatedImageView alloc] init];
    imgView.frame = CGRectMake(10.f, 80.f, width, width);
    imgView.backgroundColor = [UIColor purpleColor];
    [self.view addSubview:imgView];
    
    NSURL *url = [NSURL URLWithString:@"http://xx/app/test.webp"];
    [imgView yy_setImageWithURL:url placeholder:nil];
Copy the code

This loads dynamic WebP

YYAnimatedImageView *imgView2 = [[YYAnimatedImageView alloc] init];
    imgView2.frame = CGRectMake(CGRectGetMaxX(imgView.frame) + 10.f, CGRectGetMinY(imgView.frame), width, width);
    imgView2.backgroundColor = [UIColor purpleColor];
    [self.view addSubview:imgView2];
    
    NSURL *url2 = [NSURL URLWithString:@"http://pia2njyxv.bkt.clouddn.com/out.webp"];
    [imgView2 yy_setImageWithURL:url2 placeholder:nil];
    
Copy the code

This is loading a GIF.

YYAnimatedImageView *imgView3 = [[YYAnimatedImageView alloc] init];
    imgView3.frame = CGRectMake(10.f, CGRectGetMaxY(imgView.frame) + 20.f, width, width);
    imgView3.backgroundColor = [UIColor purpleColor];
    [self.view addSubview:imgView3];
    
    NSURL *url3 = [NSURL URLWithString:@"http://xx/pre/gifts/gift_send_5_1541749467.gif"];
    [imgView3 yy_setImageWithURL:url3 placeholder:nil];
    
Copy the code

Finally, look at the renderings

Behind a webp will continue to write how to synthesize the PNG (hypothesis is the premise of not your UI. It would be if it is good to have ignored) text links: blog.csdn.net/liwenjie091…