diff --git a/packages/SettingsLib/Spa/gallery/res/raw/accessibility_shortcut_type_triple_tap.json b/packages/SettingsLib/Spa/gallery/res/raw/accessibility_shortcut_type_triple_tap.json new file mode 100644 index 0000000000000..870e671a51fed --- /dev/null +++ b/packages/SettingsLib/Spa/gallery/res/raw/accessibility_shortcut_type_triple_tap.json @@ -0,0 +1,1959 @@ +{ + "v": "5.6.5", + "fr": 60, + "ip": 0, + "op": 180, + "w": 412, + "h": 300, + "nm": "Triple_Tap_Screen", + "ddd": 0, + "assets": [ + { + "id": "comp_0", + "layers": [ + { + "ddd": 0, + "ind": 1, + "ty": 4, + "nm": ".white", + "cl": "white", + "hd": true, + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 206, + 150, + 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": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 15.4 + ], + [ + 0, + 0 + ], + [ + -15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -15.4 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + 0, + 0 + ], + [ + -15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -15.4 + ], + [ + 0, + 0 + ], + [ + 15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 15.4 + ] + ], + "v": [ + [ + 178, + 150 + ], + [ + -178, + 150 + ], + [ + -206, + 122 + ], + [ + -206, + -122 + ], + [ + -178, + -150 + ], + [ + 178, + -150 + ], + [ + 206, + -122 + ], + [ + 206, + 122 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 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": 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 + } + ], + "ip": 0, + "op": 1800, + "st": 0, + "bm": 0 + } + ] + } + ], + "layers": [ + { + "ddd": 0, + "ind": 1, + "ty": 4, + "nm": ".grey200", + "cl": "grey200", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 206, + 150, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 1.35, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 0, + 0 + ], + [ + 0, + -73.4 + ], + [ + -73.4, + 0 + ], + [ + 0, + 73.4 + ], + [ + 73.4, + 0 + ] + ], + "o": [ + [ + -73.4, + 0 + ], + [ + 0, + 73.4 + ], + [ + 73.4, + 0 + ], + [ + 0, + -73.4 + ], + [ + 0, + 0 + ] + ], + "v": [ + [ + 1.4, + -132.9 + ], + [ + -131.6, + 0 + ], + [ + 1.3, + 132.9 + ], + [ + 134.3, + 0 + ], + [ + 1.4, + -132.9 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ind": 1, + "ty": "sh", + "ix": 2, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 0, + 0 + ], + [ + -24.7, + -24.8 + ], + [ + 0, + -35 + ], + [ + 24.8, + -24.7 + ], + [ + 35, + 0 + ], + [ + 24.7, + 24.8 + ], + [ + 0, + 35 + ], + [ + -24.8, + 24.7 + ], + [ + -35, + 0 + ] + ], + "o": [ + [ + 35, + 0 + ], + [ + 24.7, + 24.7 + ], + [ + 0, + 35 + ], + [ + -24.7, + 24.7 + ], + [ + -35, + 0 + ], + [ + -24.7, + -24.8 + ], + [ + 0, + -35 + ], + [ + 24.7, + -24.7 + ], + [ + 0, + 0 + ] + ], + "v": [ + [ + 1.4, + -130.9 + ], + [ + 94, + -92.5 + ], + [ + 132.4, + 0.1 + ], + [ + 94, + 92.7 + ], + [ + 1.4, + 131.1 + ], + [ + -91.2, + 92.7 + ], + [ + -129.6, + 0 + ], + [ + -91.2, + -92.6 + ], + [ + 1.4, + -130.9 + ] + ], + "c": false + }, + "ix": 2 + }, + "nm": "Path 2", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.909803926945, + 0.917647063732, + 0.929411768913, + 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": 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": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 300, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 2, + "ty": 4, + "nm": ".grey300", + "cl": "grey300", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 205, + 150, + 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": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + -7.9, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 8 + ], + [ + 0, + 0 + ], + [ + 0, + 1.6 + ], + [ + 0, + 0 + ], + [ + 2, + 1.5 + ], + [ + 0, + 0 + ], + [ + 6.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 6.4 + ], + [ + 0, + 0 + ], + [ + 1, + -0.7 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + 0, + 0 + ], + [ + 8, + 0 + ], + [ + 0, + 0 + ], + [ + 1.6, + 0 + ], + [ + 0, + 0 + ], + [ + -1.9, + -1.6 + ], + [ + 0, + 0 + ], + [ + 0, + 6.4 + ], + [ + 0, + 0 + ], + [ + -6.4, + 0 + ], + [ + 0, + 0 + ], + [ + -1, + 0.7 + ], + [ + 0, + 0 + ], + [ + 0.1, + 7.9 + ] + ], + "v": [ + [ + -64, + 75.3 + ], + [ + 69.1, + 75.3 + ], + [ + 83.6, + 60.8 + ], + [ + 83.6, + -81 + ], + [ + 86.5, + -83.9 + ], + [ + 86.5, + -100.9 + ], + [ + 80.7, + -105.6 + ], + [ + 80.7, + 60.8 + ], + [ + 69.1, + 72.4 + ], + [ + -64, + 72.4 + ], + [ + -75.6, + 60.8 + ], + [ + -75.6, + -107.3 + ], + [ + -78.5, + -105.2 + ], + [ + -78.5, + 60.9 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.854901969433, + 0.86274510622, + 0.878431379795, + 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": 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": "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": 1, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 300, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 3, + "ty": 4, + "nm": "cursor 5", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 36, + "s": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 39.582, + "s": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 44.953, + "s": [ + 100 + ] + }, + { + "t": 55.697265625, + "s": [ + 0 + ] + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 207.641, + 154.48, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + -180.5, + -165.5, + 0 + ], + "ix": 1 + }, + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0, + 0, + 0 + ], + "y": [ + 1, + 1, + 1 + ] + }, + "o": { + "x": [ + 0.45, + 0.45, + 0.45 + ], + "y": [ + 0, + 0, + 0 + ] + }, + "t": 37.791, + "s": [ + 27.252, + 27.252, + 100 + ] + }, + { + "t": 59, + "s": [ + 56.661, + 56.661, + 100 + ] + } + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 63.109, + 63.109 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 0.182245725744, + 0.894323072246, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 3, + "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": [ + 1, + 0.522196631338, + 0.9762855081, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 50, + "ix": 5 + }, + "r": 1, + "bm": 0, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -180.5, + -165.5 + ], + "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": "Ellipse 1", + "np": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 36, + "op": 59, + "st": -1, + "bm": 0 + }, + { + "ddd": 0, + "ind": 4, + "ty": 4, + "nm": "cursor 4", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 22, + "s": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 25.58, + "s": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 30.953, + "s": [ + 100 + ] + }, + { + "t": 41.697265625, + "s": [ + 0 + ] + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 207.641, + 154.48, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + -180.5, + -165.5, + 0 + ], + "ix": 1 + }, + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0, + 0, + 0 + ], + "y": [ + 1, + 1, + 1 + ] + }, + "o": { + "x": [ + 0.45, + 0.45, + 0.45 + ], + "y": [ + 0, + 0, + 0 + ] + }, + "t": 23.789, + "s": [ + 27.252, + 27.252, + 100 + ] + }, + { + "t": 45, + "s": [ + 56.661, + 56.661, + 100 + ] + } + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 63.109, + 63.109 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 0.182245725744, + 0.894323072246, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 3, + "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": [ + 1, + 0.522196631338, + 0.9762855081, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 50, + "ix": 5 + }, + "r": 1, + "bm": 0, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -180.5, + -165.5 + ], + "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": "Ellipse 1", + "np": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 22, + "op": 45, + "st": -3, + "bm": 0 + }, + { + "ddd": 0, + "ind": 5, + "ty": 4, + "nm": "cursor", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 8, + "s": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 11.582, + "s": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 16.953, + "s": [ + 100 + ] + }, + { + "t": 27.697265625, + "s": [ + 0 + ] + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 207.641, + 154.48, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + -180.5, + -165.5, + 0 + ], + "ix": 1 + }, + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0, + 0, + 0 + ], + "y": [ + 1, + 1, + 1 + ] + }, + "o": { + "x": [ + 0.45, + 0.45, + 0.45 + ], + "y": [ + 0, + 0, + 0 + ] + }, + "t": 9.791, + "s": [ + 27.252, + 27.252, + 100 + ] + }, + { + "t": 31, + "s": [ + 56.661, + 56.661, + 100 + ] + } + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 63.109, + 63.109 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 0.182245725744, + 0.894323072246, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 3, + "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": [ + 1, + 0.522196631338, + 0.9762855081, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 50, + "ix": 5 + }, + "r": 1, + "bm": 0, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -180.5, + -165.5 + ], + "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": "Ellipse 1", + "np": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 8, + "op": 31, + "st": -5, + "bm": 0 + }, + { + "ddd": 0, + "ind": 6, + "ty": 0, + "nm": "BG_White", + "refId": "comp_0", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 206, + 150, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 206, + 150, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "w": 412, + "h": 300, + "ip": 0, + "op": 1800, + "st": 0, + "bm": 0 + } + ], + "markers": [] +} \ No newline at end of file diff --git a/packages/SettingsLib/Spa/gallery/src/com/android/settingslib/spa/gallery/page/IllustrationPage.kt b/packages/SettingsLib/Spa/gallery/src/com/android/settingslib/spa/gallery/page/IllustrationPage.kt index 5db6e7ac1d36c..4f8ea0b75e0af 100644 --- a/packages/SettingsLib/Spa/gallery/src/com/android/settingslib/spa/gallery/page/IllustrationPage.kt +++ b/packages/SettingsLib/Spa/gallery/src/com/android/settingslib/spa/gallery/page/IllustrationPage.kt @@ -53,6 +53,15 @@ object IllustrationPageProvider : SettingsPageProvider { @Composable private fun IllustrationPage() { Column(Modifier.verticalScroll(rememberScrollState())) { + Preference(object : PreferenceModel { + override val title = "Lottie Illustration" + }) + + Illustration(object : IllustrationModel { + override val resId = R.raw.accessibility_shortcut_type_triple_tap + override val resourceType = ResourceType.LOTTIE + }) + Preference(object : PreferenceModel { override val title = "Image Illustration" }) diff --git a/packages/SettingsLib/Spa/spa/Android.bp b/packages/SettingsLib/Spa/spa/Android.bp index 3c8d91edc05ba..a4928e6608ab5 100644 --- a/packages/SettingsLib/Spa/spa/Android.bp +++ b/packages/SettingsLib/Spa/spa/Android.bp @@ -30,6 +30,7 @@ android_library { "androidx.compose.ui_ui-tooling-preview", "androidx.navigation_navigation-compose", "com.google.android.material_material", + "lottie_compose", ], kotlincflags: [ "-Xjvm-default=all", diff --git a/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/Illustration.kt b/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/Illustration.kt index 0d4e0c5059431..cd8a02a10b3d6 100644 --- a/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/Illustration.kt +++ b/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/Illustration.kt @@ -29,7 +29,7 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import com.android.settingslib.spa.framework.theme.SettingsDimension import com.android.settingslib.spa.widget.ui.ImageBox - +import com.android.settingslib.spa.widget.ui.Lottie enum class ResourceType { IMAGE, LOTTIE } /** @@ -72,7 +72,7 @@ fun Illustration( Column( modifier = modifier .fillMaxWidth() - .padding(SettingsDimension.illustrationPadding), + .padding(horizontal = SettingsDimension.illustrationPadding), horizontalAlignment = Alignment.CenterHorizontally, ) { val illustrationModifier = modifier @@ -85,7 +85,10 @@ fun Illustration( when (resourceType) { ResourceType.LOTTIE -> { - // TODO: Add Lottie function after lottie is enabled. + Lottie( + resId = resId, + modifier = illustrationModifier, + ) } ResourceType.IMAGE -> { ImageBox( diff --git a/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/ui/Lottie.kt b/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/ui/Lottie.kt new file mode 100644 index 0000000000000..915c6e2456bcf --- /dev/null +++ b/packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/ui/Lottie.kt @@ -0,0 +1,54 @@ +/* + * Copyright (C) 2022 The Android Open Source Project + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +package com.android.settingslib.spa.widget.ui + +import androidx.compose.foundation.layout.Box +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.ui.Modifier +import com.airbnb.lottie.compose.LottieAnimation +import com.airbnb.lottie.compose.LottieCompositionSpec +import com.airbnb.lottie.compose.LottieConstants +import com.airbnb.lottie.compose.animateLottieCompositionAsState +import com.airbnb.lottie.compose.rememberLottieComposition + +@Composable +fun Lottie( + resId: Int, + modifier: Modifier = Modifier, +) { + Box( + modifier = modifier, + ) { + BaseLottie(resId) + } +} + +@Composable +private fun BaseLottie(resId: Int) { + val composition by rememberLottieComposition( + LottieCompositionSpec.RawRes(resId) + ) + val progress by animateLottieCompositionAsState( + composition, + iterations = LottieConstants.IterateForever, + ) + LottieAnimation( + composition = composition, + progress = { progress }, + ) +} diff --git a/packages/SettingsLib/Spa/tests/res/raw/accessibility_shortcut_type_triple_tap.json b/packages/SettingsLib/Spa/tests/res/raw/accessibility_shortcut_type_triple_tap.json new file mode 100644 index 0000000000000..870e671a51fed --- /dev/null +++ b/packages/SettingsLib/Spa/tests/res/raw/accessibility_shortcut_type_triple_tap.json @@ -0,0 +1,1959 @@ +{ + "v": "5.6.5", + "fr": 60, + "ip": 0, + "op": 180, + "w": 412, + "h": 300, + "nm": "Triple_Tap_Screen", + "ddd": 0, + "assets": [ + { + "id": "comp_0", + "layers": [ + { + "ddd": 0, + "ind": 1, + "ty": 4, + "nm": ".white", + "cl": "white", + "hd": true, + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 206, + 150, + 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": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 15.4 + ], + [ + 0, + 0 + ], + [ + -15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -15.4 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + 0, + 0 + ], + [ + -15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + -15.4 + ], + [ + 0, + 0 + ], + [ + 15.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 15.4 + ] + ], + "v": [ + [ + 178, + 150 + ], + [ + -178, + 150 + ], + [ + -206, + 122 + ], + [ + -206, + -122 + ], + [ + -178, + -150 + ], + [ + 178, + -150 + ], + [ + 206, + -122 + ], + [ + 206, + 122 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 1, + 1, + 1, + 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": 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 + } + ], + "ip": 0, + "op": 1800, + "st": 0, + "bm": 0 + } + ] + } + ], + "layers": [ + { + "ddd": 0, + "ind": 1, + "ty": 4, + "nm": ".grey200", + "cl": "grey200", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 206, + 150, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 1.35, + 0, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 0, + 0 + ], + [ + 0, + -73.4 + ], + [ + -73.4, + 0 + ], + [ + 0, + 73.4 + ], + [ + 73.4, + 0 + ] + ], + "o": [ + [ + -73.4, + 0 + ], + [ + 0, + 73.4 + ], + [ + 73.4, + 0 + ], + [ + 0, + -73.4 + ], + [ + 0, + 0 + ] + ], + "v": [ + [ + 1.4, + -132.9 + ], + [ + -131.6, + 0 + ], + [ + 1.3, + 132.9 + ], + [ + 134.3, + 0 + ], + [ + 1.4, + -132.9 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ind": 1, + "ty": "sh", + "ix": 2, + "ks": { + "a": 0, + "k": { + "i": [ + [ + 0, + 0 + ], + [ + -24.7, + -24.8 + ], + [ + 0, + -35 + ], + [ + 24.8, + -24.7 + ], + [ + 35, + 0 + ], + [ + 24.7, + 24.8 + ], + [ + 0, + 35 + ], + [ + -24.8, + 24.7 + ], + [ + -35, + 0 + ] + ], + "o": [ + [ + 35, + 0 + ], + [ + 24.7, + 24.7 + ], + [ + 0, + 35 + ], + [ + -24.7, + 24.7 + ], + [ + -35, + 0 + ], + [ + -24.7, + -24.8 + ], + [ + 0, + -35 + ], + [ + 24.7, + -24.7 + ], + [ + 0, + 0 + ] + ], + "v": [ + [ + 1.4, + -130.9 + ], + [ + 94, + -92.5 + ], + [ + 132.4, + 0.1 + ], + [ + 94, + 92.7 + ], + [ + 1.4, + 131.1 + ], + [ + -91.2, + 92.7 + ], + [ + -129.6, + 0 + ], + [ + -91.2, + -92.6 + ], + [ + 1.4, + -130.9 + ] + ], + "c": false + }, + "ix": 2 + }, + "nm": "Path 2", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.909803926945, + 0.917647063732, + 0.929411768913, + 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": 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": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 300, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 2, + "ty": 4, + "nm": ".grey300", + "cl": "grey300", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 205, + 150, + 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": "gr", + "it": [ + { + "ind": 0, + "ty": "sh", + "ix": 1, + "ks": { + "a": 0, + "k": { + "i": [ + [ + -7.9, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 8 + ], + [ + 0, + 0 + ], + [ + 0, + 1.6 + ], + [ + 0, + 0 + ], + [ + 2, + 1.5 + ], + [ + 0, + 0 + ], + [ + 6.4, + 0 + ], + [ + 0, + 0 + ], + [ + 0, + 6.4 + ], + [ + 0, + 0 + ], + [ + 1, + -0.7 + ], + [ + 0, + 0 + ] + ], + "o": [ + [ + 0, + 0 + ], + [ + 8, + 0 + ], + [ + 0, + 0 + ], + [ + 1.6, + 0 + ], + [ + 0, + 0 + ], + [ + -1.9, + -1.6 + ], + [ + 0, + 0 + ], + [ + 0, + 6.4 + ], + [ + 0, + 0 + ], + [ + -6.4, + 0 + ], + [ + 0, + 0 + ], + [ + -1, + 0.7 + ], + [ + 0, + 0 + ], + [ + 0.1, + 7.9 + ] + ], + "v": [ + [ + -64, + 75.3 + ], + [ + 69.1, + 75.3 + ], + [ + 83.6, + 60.8 + ], + [ + 83.6, + -81 + ], + [ + 86.5, + -83.9 + ], + [ + 86.5, + -100.9 + ], + [ + 80.7, + -105.6 + ], + [ + 80.7, + 60.8 + ], + [ + 69.1, + 72.4 + ], + [ + -64, + 72.4 + ], + [ + -75.6, + 60.8 + ], + [ + -75.6, + -107.3 + ], + [ + -78.5, + -105.2 + ], + [ + -78.5, + 60.9 + ] + ], + "c": true + }, + "ix": 2 + }, + "nm": "Path 1", + "mn": "ADBE Vector Shape - Group", + "hd": false + }, + { + "ty": "fl", + "c": { + "a": 0, + "k": [ + 0.854901969433, + 0.86274510622, + 0.878431379795, + 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": 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": "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": 1, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 0, + "op": 300, + "st": 0, + "bm": 0 + }, + { + "ddd": 0, + "ind": 3, + "ty": 4, + "nm": "cursor 5", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 36, + "s": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 39.582, + "s": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 44.953, + "s": [ + 100 + ] + }, + { + "t": 55.697265625, + "s": [ + 0 + ] + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 207.641, + 154.48, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + -180.5, + -165.5, + 0 + ], + "ix": 1 + }, + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0, + 0, + 0 + ], + "y": [ + 1, + 1, + 1 + ] + }, + "o": { + "x": [ + 0.45, + 0.45, + 0.45 + ], + "y": [ + 0, + 0, + 0 + ] + }, + "t": 37.791, + "s": [ + 27.252, + 27.252, + 100 + ] + }, + { + "t": 59, + "s": [ + 56.661, + 56.661, + 100 + ] + } + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 63.109, + 63.109 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 0.182245725744, + 0.894323072246, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 3, + "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": [ + 1, + 0.522196631338, + 0.9762855081, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 50, + "ix": 5 + }, + "r": 1, + "bm": 0, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -180.5, + -165.5 + ], + "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": "Ellipse 1", + "np": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 36, + "op": 59, + "st": -1, + "bm": 0 + }, + { + "ddd": 0, + "ind": 4, + "ty": 4, + "nm": "cursor 4", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 22, + "s": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 25.58, + "s": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 30.953, + "s": [ + 100 + ] + }, + { + "t": 41.697265625, + "s": [ + 0 + ] + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 207.641, + 154.48, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + -180.5, + -165.5, + 0 + ], + "ix": 1 + }, + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0, + 0, + 0 + ], + "y": [ + 1, + 1, + 1 + ] + }, + "o": { + "x": [ + 0.45, + 0.45, + 0.45 + ], + "y": [ + 0, + 0, + 0 + ] + }, + "t": 23.789, + "s": [ + 27.252, + 27.252, + 100 + ] + }, + { + "t": 45, + "s": [ + 56.661, + 56.661, + 100 + ] + } + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 63.109, + 63.109 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 0.182245725744, + 0.894323072246, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 3, + "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": [ + 1, + 0.522196631338, + 0.9762855081, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 50, + "ix": 5 + }, + "r": 1, + "bm": 0, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -180.5, + -165.5 + ], + "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": "Ellipse 1", + "np": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 22, + "op": 45, + "st": -3, + "bm": 0 + }, + { + "ddd": 0, + "ind": 5, + "ty": 4, + "nm": "cursor", + "sr": 1, + "ks": { + "o": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 8, + "s": [ + 0 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 11.582, + "s": [ + 100 + ] + }, + { + "i": { + "x": [ + 0.833 + ], + "y": [ + 0.833 + ] + }, + "o": { + "x": [ + 0.167 + ], + "y": [ + 0.167 + ] + }, + "t": 16.953, + "s": [ + 100 + ] + }, + { + "t": 27.697265625, + "s": [ + 0 + ] + } + ], + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 207.641, + 154.48, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + -180.5, + -165.5, + 0 + ], + "ix": 1 + }, + "s": { + "a": 1, + "k": [ + { + "i": { + "x": [ + 0, + 0, + 0 + ], + "y": [ + 1, + 1, + 1 + ] + }, + "o": { + "x": [ + 0.45, + 0.45, + 0.45 + ], + "y": [ + 0, + 0, + 0 + ] + }, + "t": 9.791, + "s": [ + 27.252, + 27.252, + 100 + ] + }, + { + "t": 31, + "s": [ + 56.661, + 56.661, + 100 + ] + } + ], + "ix": 6 + } + }, + "ao": 0, + "shapes": [ + { + "ty": "gr", + "it": [ + { + "d": 1, + "ty": "el", + "s": { + "a": 0, + "k": [ + 63.109, + 63.109 + ], + "ix": 2 + }, + "p": { + "a": 0, + "k": [ + 0, + 0 + ], + "ix": 3 + }, + "nm": "Ellipse Path 1", + "mn": "ADBE Vector Shape - Ellipse", + "hd": false + }, + { + "ty": "st", + "c": { + "a": 0, + "k": [ + 1, + 0.182245725744, + 0.894323072246, + 1 + ], + "ix": 3 + }, + "o": { + "a": 0, + "k": 100, + "ix": 4 + }, + "w": { + "a": 0, + "k": 3, + "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": [ + 1, + 0.522196631338, + 0.9762855081, + 1 + ], + "ix": 4 + }, + "o": { + "a": 0, + "k": 50, + "ix": 5 + }, + "r": 1, + "bm": 0, + "nm": "Fill 1", + "mn": "ADBE Vector Graphic - Fill", + "hd": false + }, + { + "ty": "tr", + "p": { + "a": 0, + "k": [ + -180.5, + -165.5 + ], + "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": "Ellipse 1", + "np": 3, + "cix": 2, + "bm": 0, + "ix": 1, + "mn": "ADBE Vector Group", + "hd": false + } + ], + "ip": 8, + "op": 31, + "st": -5, + "bm": 0 + }, + { + "ddd": 0, + "ind": 6, + "ty": 0, + "nm": "BG_White", + "refId": "comp_0", + "sr": 1, + "ks": { + "o": { + "a": 0, + "k": 100, + "ix": 11 + }, + "r": { + "a": 0, + "k": 0, + "ix": 10 + }, + "p": { + "a": 0, + "k": [ + 206, + 150, + 0 + ], + "ix": 2 + }, + "a": { + "a": 0, + "k": [ + 206, + 150, + 0 + ], + "ix": 1 + }, + "s": { + "a": 0, + "k": [ + 100, + 100, + 100 + ], + "ix": 6 + } + }, + "ao": 0, + "w": 412, + "h": 300, + "ip": 0, + "op": 1800, + "st": 0, + "bm": 0 + } + ], + "markers": [] +} \ No newline at end of file diff --git a/packages/SettingsLib/Spa/tests/res/raw/empty.json b/packages/SettingsLib/Spa/tests/res/raw/empty.json new file mode 100644 index 0000000000000..e69de29bb2d1d diff --git a/packages/SettingsLib/Spa/tests/src/com/android/settingslib/spa/widget/IllustrationTest.kt b/packages/SettingsLib/Spa/tests/src/com/android/settingslib/spa/widget/IllustrationTest.kt index d2a07e9e041ca..5ac719a503f7e 100644 --- a/packages/SettingsLib/Spa/tests/src/com/android/settingslib/spa/widget/IllustrationTest.kt +++ b/packages/SettingsLib/Spa/tests/src/com/android/settingslib/spa/widget/IllustrationTest.kt @@ -17,12 +17,14 @@ package com.android.settingslib.spa.widget import androidx.annotation.DrawableRes +import androidx.annotation.RawRes import androidx.compose.ui.Modifier import androidx.compose.ui.semantics.SemanticsPropertyKey import androidx.compose.ui.semantics.SemanticsPropertyReceiver import androidx.compose.ui.semantics.semantics import androidx.compose.ui.test.SemanticsMatcher import androidx.compose.ui.test.assertIsDisplayed +import androidx.compose.ui.test.assertIsNotDisplayed import androidx.compose.ui.test.filterToOne import androidx.compose.ui.test.hasAnyAncestor import androidx.compose.ui.test.junit4.createComposeRule @@ -54,9 +56,52 @@ class IllustrationTest { fun hasDrawable(@DrawableRes id: Int): SemanticsMatcher = SemanticsMatcher.expectValue(DrawableId, id) - val isIllustrationNode = !hasAnyAncestor(hasDrawable(resId)) + val isIllustrationNode = hasAnyAncestor(hasDrawable(resId)) composeTestRule.onAllNodes(hasDrawable(resId)) .filterToOne(isIllustrationNode) .assertIsDisplayed() } + + private val RawId = SemanticsPropertyKey("RawResId") + private var SemanticsPropertyReceiver.rawId by RawId + + @Test + fun lottie_displayed() { + val resId = R.raw.accessibility_shortcut_type_triple_tap + composeTestRule.setContent { + Illustration( + resId = resId, + resourceType = ResourceType.LOTTIE, + modifier = Modifier.semantics { rawId = resId } + ) + } + + fun hasRaw(@RawRes id: Int): SemanticsMatcher = + SemanticsMatcher.expectValue(RawId, id) + + val isIllustrationNode = hasAnyAncestor(hasRaw(resId)) + composeTestRule.onAllNodes(hasRaw(resId)) + .filterToOne(isIllustrationNode) + .assertIsDisplayed() + } + + @Test + fun empty_lottie_not_displayed() { + val resId = R.raw.empty + composeTestRule.setContent { + Illustration( + resId = resId, + resourceType = ResourceType.LOTTIE, + modifier = Modifier.semantics { rawId = resId } + ) + } + + fun hasRaw(@RawRes id: Int): SemanticsMatcher = + SemanticsMatcher.expectValue(RawId, id) + + val isIllustrationNode = hasAnyAncestor(hasRaw(resId)) + composeTestRule.onAllNodes(hasRaw(resId)) + .filterToOne(isIllustrationNode) + .assertIsNotDisplayed() + } }