Git Product home page Git Product logo

dander521 / svgaplayer-ios Goto Github PK

View Code? Open in Web Editor NEW

This project forked from svga/svgaplayer-ios

0.0 3.0 0.0 1.58 MB

Similar to Lottie. Render After Effects / Animate CC (Flash) animations natively on Android and iOS, Web. 使用 SVGAPlayer 在 Android、iOS、Web中播放 After Effects / Animate CC (Flash) 动画。

Home Page: http://svga.io

License: Apache License 2.0

Ruby 1.99% Objective-C 98.01%

svgaplayer-ios's Introduction

SVGAPlayer

Version

2.1.0

  • Add range play mode.

2.0.0

New Features

  • Add SVGA-Format 2.0.0 support.
  • Add SVGAImageView.
  • Add more UIViewContentMode support.

Improvements

  • SVGAParser now can works up-to 8 concurrent tasks.
  • Improves BezierPath performance.

SVGA Format

@see https://github.com/yyued/SVGA-Format

Install

CocoaPods

Add following dependency to Podfile

pod 'SVGAPlayer'

Usage

code

SVGAParser *parser = [[SVGAParser alloc] init];
SVGAPlayer *player = [[SVGAPlayer alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
[self.view addSubview:player];
[parser parseWithURL:[NSURL URLWithString:@"http://uedfe.yypm.com/assets/svga-samples/angel.svga"] completionBlock:^(SVGAVideoEntity * _Nullable videoItem) {
    if (videoItem != nil) {
        player.videoItem = videoItem;
        [player startAnimation];
    }
} failureBlock:nil];

xib

  1. Add UIView to IB layout area.
  2. Let UIView subclass SVGAImageView.
  3. Input imageName on IB Properties Area.
  4. Animation will start after loaded.

Cache

SVGAParser use NSURLSession request remote data via network. You may use following ways to control cache.

Response Header

Server response SVGA files in Body, and response header either. response header has cache-control / etag / expired keys, all these keys telling NSURLSession how to handle cache.

Request NSData By Yourself

If you couldn't fix Server Response Header, You should build NSURLRequest with CachePolicy by yourself, and fetch NSData.

Deliver NSData to SVGAParser, as usual.

API

Properties

  • id delegate; - Callbacks
  • SVGAVideoEntity *videoItem; - Animation Instance
  • Int loops; - Loop Count,0 = Infinity Loop
  • BOOL clearsAfterStop; - Clears Canvas After Animation Stop
  • String fillMode; - defaults to Forward,optional Forward / Backward,fillMode = Forward,Animation will pause on last frame while finished,fillMode = Backward , Animation will pause on first frame.

Methods

  • (void)startAnimation; - Play Animation from 0 frame.
  • (void)startAnimationWithRange:(NSRange)range reverse:(BOOL)reverse;
  • (void)pauseAnimation; - Pause Animation and keep on current frame.
  • (void)stopAnimation; - Stop Animation,Clears Canvas while clearsAfterStop == YES.
  • (void)clear; - Clear Canvas force.
  • (void)stepToFrame:(NSInteger)frame andPlay:(BOOL)andPlay; - Step to N frame, and then Play Animation if andPlay === true.
  • (void)stepToPercentage:(CGFloat)percentage andPlay:(BOOL)andPlay; - Step to x%, and then Play Animation if andPlay === true.
  • (void)setImage:(UIImage *)image forKey:(NSString *)aKey; - Set Dynamic Image.
  • (void)setImageWithURL:(NSURL *)URL forKey:(NSString *)aKey; - Set Dynamic Image via remote URL.
  • (void)setAttributedText:(NSAttributedString *)attributedText forKey:(NSString *)aKey; - Set Dynamic Text.
  • (void)clearDynamicObjects; - Clear all dynamic Images and Texts.

SVGAPlayerDelegate

  • @optional
    • (void)svgaPlayerDidFinishedAnimation:(SVGAPlayer *)player; - Call after animation finished.
    • (void)svgaPlayerDidAnimatedToFrame:(NSInteger)frame; - Call after animation play to specific frame.
    • (void)svgaPlayerDidAnimatedToPercentage:(CGFloat)percentage; - Call after animation play to specific percentage.

Dynamic Object

Use this way to replace specific image, or add text to it. (可以通过以下方式,替换动画文件中的指定图像,以及动态添加富文本。)

Dynamic Image

CALayer *iconLayer = [CALayer layer];
iconLayer.cornerRadius = 84.0;
iconLayer.masksToBounds = YES;
iconLayer.borderWidth = 4.0;
iconLayer.borderColor = [UIColor colorWithRed:0xea/255.0 green:0xb3/255.0 blue:0x7d/255.0 alpha:1.0].CGColor;
[self.aPlayer setImage:iconImage forKey:@"99" referenceLayer:iconLayer];
  • Ask designer tell you the imageKey(or unzip the svga file, find it).

Dynamic Text

NSShadow *shadow = [NSShadow new];
shadow.shadowColor = [UIColor blackColor];
shadow.shadowOffset = CGSizeMake(0, 1);
NSAttributedString *text = [[NSAttributedString alloc] initWithString:@"崔小姐不吃鱼 送了魔法奇缘"
                                                            attributes:@{
                                                                        NSForegroundColorAttributeName: [UIColor colorWithRed:0xff/255.0 green:0xe0/255.0 blue:0xa4/255.0 alpha:1.0],
                                                                        NSFontAttributeName: [UIFont boldSystemFontOfSize:30.0],
                                                                        NSShadowAttributeName: shadow,
                                                                        }];
[self.aPlayer setAttributedText:text forKey:@"banner"];
  • Ask designer tell you the imageKey(or unzip the svga file, find it).

Dynamic Hidden

Now use setHidden to hide an element prevents drawing.

[self.aPlayer setHidden:YES forKey:@"99"];

Dynamic Drawing

You can set a block, it will callback while frame step.

[self.aPlayer setDrawingBlock:^(CALayer *contentLayer, NSInteger frameIndex) {
    // do thing by yourself
} forKey:@"99"];

svgaplayer-ios's People

Contributors

ponycui avatar

Watchers

James Cloos avatar RogerChen avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.