Skip to content
This repository has been archived by the owner on Feb 6, 2023. It is now read-only.

Dynamic · Matte Layer

詹瞻在欢聚 edited this page Nov 11, 2019 · 10 revisions

Matte Layer

You may add matte layers between elements just like this:

rocket

Or you may add masks above elements like this:

FilmCamera

Now you can do it at SVGAPlayer V2.5.0.

Download Sample File

You can download a sample file from SVGA-Samples to try.

Step

Mask

  1. Draw a pureColor layer;
  2. Select the pureColor layer, add a mask above it;

maskStep

Matte

  1. Draw a pureColor layer;
  2. Draw a masked shape layer;
  3. Set the masked layer as a matte for the pureColor layer;

matteStep

Dynamic Matte Layer

Download Sample File

You can download a sample file from SVGA-Samples to try.

Step

Load animation as usual.

// Setup a SVGAPlayer by yourself.
SVGAParser *parser = [[SVGAParser alloc] init];
[parser parseWithURL:[NSURL URLWithString:@"https://github.com/svga/SVGA-Samples/raw/master_aep/BitmapColorArea1.svga"] completionBlock:^(SVGAVideoEntity * _Nullable videoItem) {

} failureBlock:nil];

Setup replacing UIImage.

[...aPlayer setImage:iconImage forKey:@"matte_EEKdlEml.matte"];
// or
[...aPlayer setImageWithURL:[NSURL URLWithString: @"https://i.imgur.com/vd4GuUh.png"] forKey:@"matte_EEKdlEml.matte"];

DynamicMatte

ImageKey

The imageKey is the name of element, ask your designer tell you the element name.

For example, the layer element name is xck_basket, imageKey is xck_basket. The element should always use English name, do not use Chinese or Japanese etc.