AuroraMiddleware/skia2
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[skottie] Initial inner shadow layer style support

Browse Source 
Implement drop and inner shadow styles using explicit image filters.

Remove existing style support from DropShadowEffect.cpp, as it now
has a new cozy place with its inner sibling.

Supported properties:

  - color
  - opacity
  - angle
  - distance
  - size (sigma)

Change-Id: I5b7e3c75678e036a20c1908b84c74a670a5aa196
Reviewed-on: https://skia-review.googlesource.com/c/skia/+/283918
Reviewed-by: Michael Ludwig <michaelludwig@google.com>
Commit-Queue: Florin Malita <fmalita@chromium.org>
This commit is contained in:
Florin Malita 2020-04-17 13:08:46 -04:00 committed by Skia Commit-Bot
parent 73b86c1ade
commit e35a7ea7a9
8 changed files with 184 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
modules/skottie/skottie.gni
View File

@ -54,6 +54,7 @@ skia_skottie_sources = [
"$_src/effects/MotionBlurEffect.h",
"$_src/effects/MotionTileEffect.cpp",
"$_src/effects/RadialWipeEffect.cpp",
"$_src/effects/ShadowStyles.cpp",
"$_src/effects/ShiftChannelsEffect.cpp",
"$_src/effects/TintEffect.cpp",
"$_src/effects/TransformEffect.cpp",

68
modules/skottie/src/effects/DropShadowEffect.cpp
View File

@ -18,9 +18,9 @@ namespace {
class DropShadowAdapter final : public AnimatablePropertyContainer {
public:
static sk_sp<DropShadowAdapter> MakeEffect(const skjson::ArrayValue& jprops,
sk_sp<sksg::RenderNode> layer,
const AnimationBuilder& abuilder) {
static sk_sp<DropShadowAdapter> Make(const skjson::ArrayValue& jprops,
sk_sp<sksg::RenderNode> layer,
const AnimationBuilder& abuilder) {
enum : size_t {
kShadowColor_Index = 0,
kOpacity_Index = 1,
@ -30,7 +30,7 @@ public:
kShadowOnly_Index = 5,
};
sk_sp<DropShadowAdapter> adapter(new DropShadowAdapter(std::move(layer), Type::fEffect));
sk_sp<DropShadowAdapter> adapter(new DropShadowAdapter(std::move(layer)));
EffectBinder(jprops, abuilder, adapter.get())
.bind(kShadowColor_Index, adapter->fColor )
@ -43,42 +43,20 @@ public:
return adapter;
}
static sk_sp<DropShadowAdapter> MakeStyle(const skjson::ObjectValue& jstyle,
sk_sp<sksg::RenderNode> layer,
const AnimationBuilder& abuilder) {
sk_sp<DropShadowAdapter> adapter(new DropShadowAdapter(std::move(layer), Type::fStyle));
adapter->bind(abuilder, jstyle["a"], adapter->fDirection);
adapter->bind(abuilder, jstyle["c"], adapter->fColor );
adapter->bind(abuilder, jstyle["d"], adapter->fDistance );
adapter->bind(abuilder, jstyle["o"], adapter->fOpacity );
adapter->bind(abuilder, jstyle["s"], adapter->fSoftness );
return adapter;
}
const sk_sp<sksg::RenderNode>& node() const { return fImageFilterEffect; }
private:
enum class Type { fEffect, fStyle };
DropShadowAdapter(sk_sp<sksg::RenderNode> layer, Type ty)
explicit DropShadowAdapter(sk_sp<sksg::RenderNode> layer)
: fDropShadow(sksg::DropShadowImageFilter::Make())
, fImageFilterEffect(sksg::ImageFilterEffect::Make(std::move(layer), fDropShadow))
, fType(ty) {
fOpacity = this->maxOpacity();
}
, fImageFilterEffect(sksg::ImageFilterEffect::Make(std::move(layer), fDropShadow)) {}
void onSync() override {
// fColor -> RGB, fOpacity -> A
const SkColor color = fColor;
fDropShadow->setColor(SkColorSetA(color,
SkScalarRoundToInt(SkTPin(fOpacity / this->maxOpacity(),
0.0f, 1.0f) * 255)));
fDropShadow->setColor(SkColorSetA(color, SkTPin(SkScalarRoundToInt(fOpacity), 0, 255)));
// The offset is specified in terms of an angle + distance.
const auto rad = SkDegreesToRadians(fType == Type::fEffect
? 90 - fDirection // bearing (effect)
: 180 + fDirection); // 0deg -> left (style)
// The offset is specified in terms of a bearing + distance.
const auto rad = SkDegreesToRadians(90 - fDirection);
fDropShadow->setOffset(SkVector::Make( fDistance * SkScalarCos(rad),
-fDistance * SkScalarSin(rad)));
@ -90,18 +68,11 @@ private:
: sksg::DropShadowImageFilter::Mode::kShadowAndForeground);
}
float maxOpacity() const {
return fType == Type::fEffect
? 255.0f // effect: 0 - 255
: 100.0f; // style : 0 - 100
}
const sk_sp<sksg::DropShadowImageFilter> fDropShadow;
const sk_sp<sksg::RenderNode> fImageFilterEffect;
const Type fType;
VectorValue fColor = { 0, 0, 0, 1 };
ScalarValue fOpacity, // initialized explicitly depending on type
ScalarValue fOpacity = 255,
fDirection = 0,
fDistance = 0,
fSoftness = 0,
@ -112,22 +83,9 @@ private:
sk_sp<sksg::RenderNode> EffectBuilder::attachDropShadowEffect(const skjson::ArrayValue& jprops,
sk_sp<sksg::RenderNode> layer) const {
auto adapter = DropShadowAdapter::MakeEffect(jprops, std::move(layer), *fBuilder);
auto effect_node = adapter->node();
fBuilder->attachDiscardableAdapter(std::move(adapter));
return effect_node;
}
sk_sp<sksg::RenderNode> EffectBuilder::attachDropShadowStyle(const skjson::ObjectValue& jstyle,
sk_sp<sksg::RenderNode> layer) const {
auto adapter = DropShadowAdapter::MakeStyle(jstyle, std::move(layer), *fBuilder);
auto effect_node = adapter->node();
fBuilder->attachDiscardableAdapter(std::move(adapter));
return effect_node;
return fBuilder->attachDiscardableAdapter<DropShadowAdapter>(jprops,
std::move(layer),
*fBuilder);
}
} // namespace internal

1
modules/skottie/src/effects/Effects.cpp
View File

@ -129,6 +129,7 @@ sk_sp<sksg::RenderNode> EffectBuilder::attachStyles(const skjson::ArrayValue& js
static constexpr StyleBuilder gStyleBuilders[] = {
nullptr, // 'ty': 0 -> stroke
&EffectBuilder::attachDropShadowStyle, // 'ty': 1 -> drop shadow
&EffectBuilder::attachInnerShadowStyle, // 'ty': 2 -> inner shadow
};
for (const skjson::ObjectValue* jstyle : jstyles) {

2
modules/skottie/src/effects/Effects.h
View File

@ -73,6 +73,8 @@ private:
sk_sp<sksg::RenderNode> attachDropShadowStyle(const skjson::ObjectValue&,
sk_sp<sksg::RenderNode>) const;
sk_sp<sksg::RenderNode> attachInnerShadowStyle(const skjson::ObjectValue&,
sk_sp<sksg::RenderNode>) const;
EffectBuilderT findBuilder(const skjson::ObjectValue&) const;

138
modules/skottie/src/effects/ShadowStyles.cpp Normal file
View File

@ -0,0 +1,138 @@
/*
* Copyright 2020 Google Inc.
*
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file.
*/
#include "modules/skottie/src/effects/Effects.h"
#include "include/core/SkColorFilter.h"
#include "include/effects/SkColorMatrix.h"
#include "include/effects/SkImageFilters.h"
#include "modules/skottie/src/Adapter.h"
#include "modules/skottie/src/SkottieValue.h"
#include "modules/sksg/include/SkSGRenderEffect.h"
#include "src/utils/SkJSON.h"
namespace skottie::internal {
namespace {
class ShadowAdapter final : public DiscardableAdapterBase<ShadowAdapter,
sksg::ExternalImageFilter> {
public:
enum Type {
kDropShadow,
kInnerShadow,
};
ShadowAdapter(const skjson::ObjectValue& jstyle,
const AnimationBuilder& abuilder,
Type type)
: fType(type) {
this->bind(abuilder, jstyle["c"], fColor);
this->bind(abuilder, jstyle["o"], fOpacity);
this->bind(abuilder, jstyle["a"], fAngle);
this->bind(abuilder, jstyle["s"], fSize);
this->bind(abuilder, jstyle["d"], fDistance);
}
private:
void onSync() override {
const auto rad = SkDegreesToRadians(180 + fAngle), // 0deg -> left (style)
sigma = fSize * kBlurSizeToSigma,
opacity = SkTPin(fOpacity / 100, 0.0f, 1.0f);
const auto color = static_cast<SkColor4f>(fColor);
const auto offset = SkV2{ fDistance * SkScalarCos(rad),
-fDistance * SkScalarSin(rad)};
// Shadow effects largely follow the feDropShadow spec [1]:
//
// 1) isolate source alpha
// 2) apply a gaussian blur
// 3) apply an offset
// 4) modulate with a flood/color generator
// 5) composite with the source
//
// Note: as an optimization, we can fold #1 and #4 into a single color matrix filter.
//
// Inner shadow differences:
//
// a) operates on the inverse of source alpha
// b) the result is masked against the source
// c) composited on top of source
//
// [1] https://drafts.fxtf.org/filter-effects/#feDropShadowElement
// Select and colorize the source alpha channel.
SkColorMatrix cm{0, 0, 0, 0, color.fR,
0, 0, 0, 0, color.fG,
0, 0, 0, 0, color.fB,
0, 0, 0, opacity * color.fA, 0};
// Inner shadows use the alpha inverse.
if (fType == Type::kInnerShadow) {
cm.preConcat({1, 0, 0, 0, 0,
0, 1, 0, 0, 0,
0, 0, 1, 0, 0,
0, 0, 0,-1, 1});
}
auto f = SkImageFilters::ColorFilter(SkColorFilters::Matrix(cm), nullptr);
if (sigma > 0) {
f = SkImageFilters::Blur(sigma, sigma, std::move(f));
}
if (!SkScalarNearlyZero(offset.x) || !SkScalarNearlyZero(offset.y)) {
f = SkImageFilters::Offset(offset.x, offset.y, std::move(f));
}
sk_sp<SkImageFilter> source;
if (fType == Type::kInnerShadow) {
// Inner shadows draw on top of, and are masked with, the source.
f = SkImageFilters::Xfermode(SkBlendMode::kDstIn, std::move(f));
std::swap(source, f);
}
this->node()->setImageFilter(SkImageFilters::Merge(std::move(f),
std::move(source)));
}
const Type fType;
VectorValue fColor;
ScalarValue fOpacity = 100, // percentage
fAngle = 0, // degrees
fSize = 0,
fDistance = 0;
using INHERITED = DiscardableAdapterBase<ShadowAdapter, sksg::ExternalImageFilter>;
};
static sk_sp<sksg::RenderNode> make_shadow_effect(const skjson::ObjectValue& jstyle,
const AnimationBuilder& abuilder,
sk_sp<sksg::RenderNode> layer,
ShadowAdapter::Type type) {
auto filter_node = abuilder.attachDiscardableAdapter<ShadowAdapter>(jstyle, abuilder, type);
return sksg::ImageFilterEffect::Make(std::move(layer), std::move(filter_node));
}
} // namespace
sk_sp<sksg::RenderNode> EffectBuilder::attachDropShadowStyle(const skjson::ObjectValue& jstyle,
sk_sp<sksg::RenderNode> layer) const {
return make_shadow_effect(jstyle, *fBuilder, std::move(layer),
ShadowAdapter::Type::kDropShadow);
}
sk_sp<sksg::RenderNode> EffectBuilder::attachInnerShadowStyle(const skjson::ObjectValue& jstyle,
sk_sp<sksg::RenderNode> layer) const {
return make_shadow_effect(jstyle, *fBuilder, std::move(layer),
ShadowAdapter::Type::kInnerShadow);
}
} // namespece skottie::internal

21
modules/sksg/include/SkSGRenderEffect.h
View File

@ -149,6 +149,27 @@ private:
using INHERITED = EffectNode;
};
/**
* Wrapper for externally-managed SkImageFilters.
*/
class ExternalImageFilter final : public ImageFilter {
public:
~ExternalImageFilter() override;
static sk_sp<ExternalImageFilter> Make() {
return sk_sp<ExternalImageFilter>(new ExternalImageFilter());
}
SG_ATTRIBUTE(ImageFilter, sk_sp<SkImageFilter>, fImageFilter)
private:
ExternalImageFilter();
sk_sp<SkImageFilter> onRevalidateFilter() override { return fImageFilter; }
sk_sp<SkImageFilter> fImageFilter;
};
/**
* SkDropShadowImageFilter node.
*/

8
modules/sksg/src/SkSGRenderEffect.cpp
View File

@ -108,7 +108,10 @@ SkRect ImageFilterEffect::onRevalidate(InvalidationController* ic, const SkMatri
fImageFilter->revalidate(ic, ctm);
const auto& filter = fImageFilter->getFilter();
SkASSERT(!filter || filter->canComputeFastBounds());
// Would be nice for this this to stick, but canComputeFastBounds()
// appears to be conservative (false negatives).
// SkASSERT(!filter || filter->canComputeFastBounds());
const auto content_bounds = this->INHERITED::onRevalidate(ic, ctm);
@ -164,6 +167,9 @@ SkRect ImageFilter::onRevalidate(InvalidationController*, const SkMatrix&) {
return SkRect::MakeEmpty();
}
ExternalImageFilter:: ExternalImageFilter() = default;
ExternalImageFilter::~ExternalImageFilter() = default;
sk_sp<DropShadowImageFilter> DropShadowImageFilter::Make(sk_sp<ImageFilter> input) {
return sk_sp<DropShadowImageFilter>(new DropShadowImageFilter(std::move(input)));
}

1
resources/skottie/skottie-innershadow-style.json Normal file
View File

@ -0,0 +1 @@
{"v":"5.6.8","fr":60,"ip":0,"op":600,"w":500,"h":500,"nm":"inner shadow","ddd":0,"assets":[{"id":"comp_0","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,250,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"sr","sy":1,"d":1,"pt":{"a":0,"k":5,"ix":3},"p":{"a":0,"k":[0,0],"ix":4},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"t":600,"s":[720]}],"ix":5},"ir":{"a":0,"k":35,"ix":6},"is":{"a":0,"k":0,"ix":8},"or":{"a":0,"k":100,"ix":7},"os":{"a":0,"k":0,"ix":9},"ix":1,"nm":"Polystar Path 1","mn":"ADBE Vector Shape - Star","hd":false},{"ty":"fl","c":{"a":0,"k":[0.186933204532,0.489476114511,1,1],"ix":4},"o":{"a":0,"k":75,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[150,150],"ix":2},"p":{"a":0,"k":[80,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"st","c":{"a":0,"k":[1,0.230637252331,1,1],"ix":3},"o":{"a":0,"k":100,"ix":4},"w":{"a":0,"k":21,"ix":5},"lc":1,"lj":1,"ml":4,"bm":0,"nm":"Stroke 1","mn":"ADBE Vector Graphic - Stroke","hd":false},{"ty":"fl","c":{"a":0,"k":[0.799341320992,0.889966309071,0.211565569043,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"t":600,"s":[-360]}],"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":3,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":601,"st":0,"bm":0}]}],"layers":[{"ddd":0,"ind":1,"ty":0,"nm":"precomp","refId":"comp_0","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"t":599,"s":[-360]}],"ix":10},"p":{"a":0,"k":[250,250,0],"ix":2},"a":{"a":0,"k":[250,250,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":0,"s":[100,100,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":150,"s":[150,150,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":300,"s":[100,100,100]},{"i":{"x":[0.833,0.833,0.833],"y":[0.833,0.833,0.833]},"o":{"x":[0.167,0.167,0.167],"y":[0.167,0.167,0.167]},"t":450,"s":[75,75,100]},{"t":599,"s":[100,100,100]}],"ix":6}},"ao":0,"sy":[{"c":{"a":0,"k":[0,0.260202199221,0,1],"ix":2},"o":{"a":0,"k":75,"ix":3},"a":{"a":0,"k":120,"ix":5},"s":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":0,"s":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":100,"s":[0]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":300,"s":[28]},{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"t":500,"s":[0]},{"t":599,"s":[0]}],"ix":8},"d":{"a":0,"k":30,"ix":6},"ch":{"a":0,"k":0,"ix":7},"bm":{"a":0,"k":1,"ix":1},"no":{"a":0,"k":0,"ix":9},"ty":2,"nm":"Inner Shadow"}],"w":500,"h":500,"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":1,"nm":"bg","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[250,250,0],"ix":2},"a":{"a":0,"k":[250,250,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"sw":500,"sh":500,"sc":"#ffffff","ip":0,"op":600,"st":0,"bm":0}],"markers":[]}