71bcfef9f7
Auto-resizing and vertical alignment require a non-empty text box. But currently, the presence of the text box is used to discriminate between point text [1] and paragraph text [2]. In order to support auto-scaling and v-alignment for point text, we must decouple the text mode encoding from the text box: * introduce and explicit LinebreakPolicy property for skottie::Shaper, and use it to control line breaking instead of the text box presence * by default, the line breaking policy is initialized per existing AE/BM semantics: non-empty text box -> paragraph mode, empty box -> point mode * the policy can be overridden via the PropertyObserver APIs to enable point mode auto-resizing and vertical alignment [1] https://helpx.adobe.com/after-effects/using/creating-editing-text-layers.html#enter_point_text [2] https://helpx.adobe.com/after-effects/using/creating-editing-text-layers.html#enter_paragraph_text Change-Id: I007144283a31a2faa579d7eec82af72af3d540cb Reviewed-on: https://skia-review.googlesource.com/c/skia/+/321788 Reviewed-by: Ben Wagner <bungeman@google.com> Commit-Queue: Florin Malita <fmalita@google.com>
2 lines
13 KiB
JSON
2 lines
13 KiB
JSON
{"v":"5.7.3","fr":60,"ip":0,"op":601,"w":500,"h":500,"nm":"point text auto resize","ddd":0,"assets":[],"fonts":{"list":[{"origin":1,"fPath":"https://fonts.googleapis.com/css2?family=Roboto","fClass":"","fFamily":"Roboto","fWeight":"","fStyle":"Bold","fName":"Roboto-Bold","ascent":75}]},"layers":[{"ddd":0,"ind":1,"ty":5,"nm":"Foo","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[99,88.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":1,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo","m":0,"j":0,"tr":0,"lh":76.8,"ls":0,"fc":[0.345,0.388,0.749],"vj":0,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":2,"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":[86,101,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":5,"nm":"Foo Bar","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[264,88.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":1,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo Bar","m":0,"j":0,"tr":0,"lh":43.9797592163086,"ls":0,"fc":[0.345,0.388,0.749],"vj":0,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Shape Layer 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[251,101,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":5,"nm":"Foo Bar Baz","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[428,88.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":1,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo Bar Baz","m":0,"j":0,"tr":0,"lh":43.9797592163086,"ls":0,"fc":[0.345,0.388,0.749],"vj":0,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Shape Layer 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[415,101,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":5,"nm":"Foo 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[99,250.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":2,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo","m":0,"j":0,"tr":0,"lh":76.8,"ls":0,"fc":[0.345,0.388,0.749],"vj":1,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":8,"ty":4,"nm":"Shape Layer 6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[86,263,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":9,"ty":5,"nm":"Foo Bar 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[264,250.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":2,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo Bar","m":0,"j":0,"tr":0,"lh":43.9797592163086,"ls":0,"fc":[0.345,0.388,0.749],"vj":1,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":10,"ty":4,"nm":"Shape Layer 5","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[251,263,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":11,"ty":5,"nm":"Foo Bar Baz 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[428,250.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":2,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo Bar Baz","m":0,"j":0,"tr":0,"lh":43.9797592163086,"ls":0,"fc":[0.345,0.388,0.749],"vj":1,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":12,"ty":4,"nm":"Shape Layer 4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[415,263,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":13,"ty":5,"nm":"Foo 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[99,405.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":3,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo","m":0,"j":0,"tr":0,"lh":76.8,"ls":0,"fc":[0.345,0.388,0.749],"vj":2,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":14,"ty":4,"nm":"Shape Layer 9","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[86,418,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":15,"ty":5,"nm":"Foo Bar 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[264,405.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":3,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo Bar","m":0,"j":0,"tr":0,"lh":43.9797592163086,"ls":0,"fc":[0.345,0.388,0.749],"vj":2,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":16,"ty":4,"nm":"Shape Layer 8","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[251,418,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":17,"ty":5,"nm":"Foo Bar Baz 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[428,405.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"ef":[{"ty":5,"nm":"Text Properties","np":4,"mn":"Pseudo/Bodymovin Text Props 3","ix":1,"en":1,"ef":[{"ty":7,"nm":"Vertical Text Alignment","mn":"Pseudo/Bodymovin Text Props 3-0001","ix":1,"v":{"a":0,"k":3,"ix":1}},{"ty":7,"nm":"Resize Behavior","mn":"Pseudo/Bodymovin Text Props 3-0002","ix":2,"v":{"a":0,"k":2,"ix":2}}]}],"t":{"d":{"k":[{"s":{"sz":[157,100],"ps":[-92,-37.5],"s":64,"f":"Roboto-Bold","t":"Foo Bar Baz","m":0,"j":0,"tr":0,"lh":43.9797592163086,"ls":0,"fc":[0.345,0.388,0.749],"vj":2,"rs":1},"t":0}]},"p":{},"m":{"g":1,"a":{"a":0,"k":[0,0],"ix":2}},"a":[]},"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":18,"ty":4,"nm":"Shape Layer 7","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[415,418,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[160,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"rc","d":1,"s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,0.890196084976,0.470588237047,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false}],"ip":0,"op":601,"st":0,"bm":0},{"ddd":0,"ind":19,"ty":1,"nm":"Pale Cyan Solid 2","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":"#e1ffff","ip":0,"op":601,"st":0,"bm":0}],"markers":[]}
|