examples: updated lottie extension

Added default slot overriding case
This commit is contained in:
Hermet Park 2024-11-09 15:06:02 +09:00
parent d8fa8f364c
commit 1528ae3729
4 changed files with 27 additions and 36 deletions

View file

@ -24,11 +24,12 @@
/* ThorVG Drawing Contents */
/************************************************************************/
#define NUM_PER_ROW 2
#define NUM_PER_COL 2
#define NUM_PER_ROW 3
#define NUM_PER_COL 3
struct UserExample : tvgexam::Example
{
unique_ptr<tvg::LottieAnimation> slot0;
unique_ptr<tvg::LottieAnimation> slot1;
unique_ptr<tvg::LottieAnimation> slot2;
unique_ptr<tvg::LottieAnimation> marker;
@ -59,6 +60,12 @@ struct UserExample : tvgexam::Example
{
if (!canvas) return false;
//default slot
{
auto progress = tvgexam::progress(elapsed, slot0->duration());
slot0->frame(slot0->totalFrame() * progress);
}
//gradient slot
{
auto progress = tvgexam::progress(elapsed, slot1->duration());
@ -96,16 +103,27 @@ struct UserExample : tvgexam::Example
this->h = h;
this->size = w / NUM_PER_ROW;
//slot (default)
{
slot0 = std::unique_ptr<tvg::LottieAnimation>(tvg::LottieAnimation::gen());
auto picture = slot0->picture();
if (!tvgexam::verify(picture->load(EXAMPLE_DIR"/lottie/extensions/slotsample0.json"))) return false;
sizing(picture, 0);
canvas->push(picture);
}
//slot (gradient)
{
slot1 = std::unique_ptr<tvg::LottieAnimation>(tvg::LottieAnimation::gen());
auto picture = slot1->picture();
if (!tvgexam::verify(picture->load(EXAMPLE_DIR"/lottie/extensions/slotsample.json"))) return false;
if (!tvgexam::verify(picture->load(EXAMPLE_DIR"/lottie/extensions/slotsample1.json"))) return false;
const char* slotJson = R"({"gradient_fill":{"p":{"p":2,"k":{"k":[0,0.1,0.1,0.2,1,1,0.1,0.2,0,0,1,1]}}}})";
if (!tvgexam::verify(slot1->override(slotJson))) return false;
sizing(picture, 0);
sizing(picture, 1);
canvas->push(picture);
}
@ -119,7 +137,7 @@ struct UserExample : tvgexam::Example
const char* slotJson = R"({"ball_color":{"p":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":7,"s":[0,0.176,0.867]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":22,"s":[0.867,0,0.533]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":37,"s":[0.867,0,0.533]},{"t":51,"s":[0,0.867,0.255]}]}}})";
if (!tvgexam::verify(slot2->override(slotJson))) return false;
sizing(picture, 1);
sizing(picture, 2);
canvas->push(picture);
}
@ -131,7 +149,7 @@ struct UserExample : tvgexam::Example
if (!tvgexam::verify(picture->load(EXAMPLE_DIR"/lottie/extensions/marker_sample.json"))) return false;
if (!tvgexam::verify(marker->segment("sectionC"))) return false;
sizing(picture, 2);
sizing(picture, 3);
canvas->push(picture);
}
@ -147,5 +165,5 @@ struct UserExample : tvgexam::Example
int main(int argc, char **argv)
{
return tvgexam::main(new UserExample, argc, argv);
return tvgexam::main(new UserExample, argc, argv, 1024, 1024);
}

View file

@ -0,0 +1 @@
{"v":"4.8.0","meta":{"g":"LottieFiles AE ","a":"","k":"","d":"","tc":""},"fr":30,"ip":0,"op":61,"w":1080,"h":1080,"nm":"B","assets":[],"slots":{"ball_color":{"p":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":7,"s":[0,0.176,0.867]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":22,"s":[0.867,0,0.533]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":37,"s":[0.867,0,0.533]},{"t":51,"s":[0,0.867,0.255]}]}},"ball_opacity":{"p":{"a":1,"k":[{"i":{"x":0.833,"y":0.833},"o":{"x":0.167,"y":0.167},"s":[0],"t":0},{"s":[100],"t":100}]}},"bg_color":{"p":{"a":0,"k":[1,1,1,1]}}},"layers":[{"ind":1,"ty":4,"nm":"B","sr":1,"ks":{"o":{"a":0,"k":100},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"t":58,"s":[349.032]}],"sid":"ball_rotation"},"p":{"s":true,"x":{"a":0,"k":540},"y":{"a":1,"k":[{"i":{"x":[0.67],"y":[0.343]},"o":{"x":[0.33],"y":[0]},"t":0,"s":[152]},{"i":{"x":[0.67],"y":[1]},"o":{"x":[0.33],"y":[0]},"t":15,"s":[915]},{"i":{"x":[0.67],"y":[0.343]},"o":{"x":[0.33],"y":[0]},"t":30,"s":[152]},{"i":{"x":[0.67],"y":[1]},"o":{"x":[0.33],"y":[0]},"t":45,"s":[915]},{"t":60,"s":[152]}]}},"a":{"a":0,"k":[0,0,0]},"s":{"a":0,"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[270,270],"sid":"ball_size"},"p":{"a":0,"k":[0,0]},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":15,"s":[135]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":30,"s":[33.75]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":45,"s":[33.75]},{"t":60,"s":[135]}]},"nm":"S"},{"ty":"fl","c":{"a":0,"k":[0.961,0.761,0.267,1],"sid":"ball_color"},"o":{"a":0,"k":100,"sid":"ball_opacity"},"r":1,"nm":"C"}],"ip":0,"op":61,"st":0},{"ind":3,"ty":4,"nm":"B","sr":1,"ks":{"o":{"a":0,"k":100},"r":{"a":0,"k":0},"p":{"a":0,"k":[540,540,0]},"a":{"a":0,"k":[0,0,0]},"s":{"a":0,"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[1080,1080],"sid":"bg_size"},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"nm":"R"},{"ty":"fl","c":{"a":0,"k":[0.153,0.153,0.153,1],"sid":"bg_color"},"o":{"a":0,"k":100},"r":1,"nm":"F"},{"ty":"tr","p":{"a":0,"k":[0,0]},"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"r":{"a":0,"k":0},"o":{"a":0,"k":100},"sk":{"a":0,"k":0},"sa":{"a":0,"k":0},"nm":"T"}],"nm":"G"}],"ip":0,"op":61,"st":0}],"markers":[]}

View file

@ -1 +1 @@
{"v":"4.8.0","meta":{"g":"LottieFiles AE 3.0.2","a":"","k":"","d":"","tc":""},"fr":60,"ip":0,"op":121,"w":550,"h":550,"nm":"C","assets":[],"layers":[{"ind":1,"ty":4,"nm":"S","sr":1,"ks":{"o":{"a":0,"k":100},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"t":120,"s":[360]}]},"p":{"a":0,"k":[275,275,0]},"a":{"a":0,"k":[-7.886,88.719,0]},"s":{"a":0,"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[282.019,134.888]},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"nm":"R"},{"ty":"st","c":{"a":0,"k":[0.991,0,1,1]},"o":{"a":0,"k":100},"w":{"a":0,"k":3},"lc":1,"lj":1,"ml":4,"nm":"S"},{"ty":"gf","o":{"a":0,"k":100},"r":1,"g":{"p":9,"k":{"a":0,"k":[0,0.514,0.373,0.984,0.141,0.478,0.412,0.984,0.283,0.443,0.451,0.984,0.379,0.408,0.49,0.984,0.475,0.373,0.529,0.984,0.606,0.278,0.647,0.925,0.737,0.184,0.765,0.867,0.868,0.092,0.882,0.808,1,0,1,0.749]},"sid":"gradient_fill"},"s":{"a":0,"k":[-159.51,23.531]},"e":{"a":0,"k":[183.084,8.059]},"t":1,"nm":"G"},{"ty":"tr","p":{"a":0,"k":[-7.886,88.719]},"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"r":{"a":0,"k":0},"o":{"a":0,"k":100},"sk":{"a":0,"k":0},"sa":{"a":0,"k":0},"nm":"T"}],"nm":"R"}],"ip":0,"op":300,"st":0}],"slots":{"gradient_fill":{"p":{"a":0,"k":[0,0.1,0.1,0.2,1,1,0.1,0.2,0.1,1]}}},"markers":[]}
{"v":"4.8.0","meta":{"g":"LottieFiles AE 3.0.2","a":"","k":"","d":"","tc":""},"fr":60,"ip":0,"op":121,"w":550,"h":550,"nm":"C","assets":[],"layers":[{"ind":1,"ty":4,"nm":"S","sr":1,"ks":{"o":{"a":0,"k":100},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"t":120,"s":[360]}]},"p":{"a":0,"k":[275,275,0]},"a":{"a":0,"k":[-7.886,88.719,0]},"s":{"a":0,"k":[100,100,100]}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[282.019,134.888]},"p":{"a":0,"k":[0,0]},"r":{"a":0,"k":0},"nm":"R"},{"ty":"st","c":{"a":0,"k":[0.991,0,1,1]},"o":{"a":0,"k":100},"w":{"a":0,"k":3},"lc":1,"lj":1,"ml":4,"nm":"S"},{"ty":"gf","o":{"a":0,"k":100},"r":1,"g":{"p":9,"k":{"a":0,"k":[0,0.514,0.373,0.984,0.141,0.478,0.412,0.984,0.283,0.443,0.451,0.984,0.379,0.408,0.49,0.984,0.475,0.373,0.529,0.984,0.606,0.278,0.647,0.925,0.737,0.184,0.765,0.867,0.868,0.092,0.882,0.808,1,0,1,0.749]},"sid":"gradient_fill"},"s":{"a":0,"k":[-159.51,23.531]},"e":{"a":0,"k":[183.084,8.059]},"t":1,"nm":"G"},{"ty":"tr","p":{"a":0,"k":[-7.886,88.719]},"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"r":{"a":0,"k":0},"o":{"a":0,"k":100},"sk":{"a":0,"k":0},"sa":{"a":0,"k":0},"nm":"T"}],"nm":"R"}],"ip":0,"op":300,"st":0}],"markers":[]}

View file

@ -8,34 +8,6 @@
"h": 1080,
"nm": "B",
"assets": [],
"slots": {
"ball_color": {
"p": {
"a": 1,
"k": [
{
"i": { "x": [0.833], "y": [0.833] },
"o": { "x": [0.167], "y": [0.167] },
"t": 7,
"s": [0, 0.176, 0.867]
},
{
"i": { "x": [0.833], "y": [0.833] },
"o": { "x": [0.167], "y": [0.167] },
"t": 22,
"s": [0.867, 0, 0.533]
},
{
"i": { "x": [0.833], "y": [0.833] },
"o": { "x": [0.167], "y": [0.167] },
"t": 37,
"s": [0.867, 0, 0.533]
},
{ "t": 51, "s": [0, 0.867, 0.255] }
]
}
}
},
"layers": [
{
"ind": 1,