Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 7678ce0

Browse files
Merge pull request #294 from mousheng/Fix_And_Improve_JsonLottie
Fix_Optimize_JSON_Lottie_Component
2 parents 2493dc7 + a967f24 commit 7678ce0

File tree

8 files changed

+47
-18
lines changed

8 files changed

+47
-18
lines changed
File renamed without changes.

‎client/packages/lowcoder-design/src/icons/index.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -285,5 +285,6 @@ export { ReactComponent as TableCheckedIcon } from "icons/icon-table-checked.svg
285285
export { ReactComponent as TableUnCheckedIcon } from "icons/icon-table-boolean-false.svg";
286286
export { ReactComponent as FileFolderIcon } from "icons/icon-editor-folder.svg";
287287
export { ReactComponent as ExpandIcon } from "icons/icon-expand.svg";
288-
export { ReactComponent as CompressIcon } from "icons/icon-compress.svg"
289-
export { ReactComponent as TableCellsIcon } from "icons/icon-table-cells.svg" // Added By Aqib Mirza
288+
export { ReactComponent as CompressIcon } from "icons/icon-compress.svg";
289+
export { ReactComponent as TableCellsIcon } from "icons/icon-table-cells.svg"; // Added By Aqib Mirza
290+
export { ReactComponent as LottieIcon } from "icons/icon-lottie.svg";

‎client/packages/lowcoder/src/assets/icons/index.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,4 @@ export { ReactComponent as DocIcon } from "./view-doc.svg";
1010
export { ReactComponent as TutorialIcon } from "./tutorial.svg";
1111
export { ReactComponent as ShortcutIcon } from "./icon-help-shortcut.svg";
1212

13-
export { ReactComponent as LottieIcon } from "./icon-lottie.svg"; //Added By Aqib Mirza
14-
1513
export { GoogleLoginIcon, GithubLoginIcon, GeneralLoginIcon, EmailLoginIcon };

‎client/packages/lowcoder/src/comps/comps/jsonComp/jsonLottieComp.tsx‎

Lines changed: 20 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {
55
NumberControl,
66
} from "comps/controls/codeControl";
77
import { dropdownControl } from "comps/controls/dropdownControl";
8+
import { BoolControl } from "comps/controls/boolControl";
89
import { styleControl } from "comps/controls/styleControl";
910
import { LottieStyle } from "comps/controls/styleControlConstants";
1011
import { trans } from "i18n";
@@ -22,27 +23,35 @@ import { defaultLottie } from "./jsonConstants";
2223
*/
2324
const animationStartOptions = [
2425
{
25-
label: "Auto",
26+
label: trans("jsonLottie.auto"),
2627
value: "auto",
2728
},
2829
{
29-
label: "On Hover",
30+
label: trans("jsonLottie.onHover"),
3031
value: "on hover",
3132
},
3233
] as const;
3334

3435
const loopOptions = [
3536
{
36-
label: "Single play",
37+
label: trans("jsonLottie.singlePlay"),
3738
value: "single",
3839
},
3940
{
40-
label: "Endless loop",
41+
label: trans("jsonLottie.endlessLoop"),
4142
value: "endless",
4243
},
4344
] as const;
4445

4546
const speedOptions = [
47+
{
48+
label: "0.5x",
49+
value: "0.5",
50+
},
51+
{
52+
label: "0.75x",
53+
value: "0.75",
54+
},
4655
{
4756
label: "1x",
4857
value: "1",
@@ -81,8 +90,8 @@ let JsonLottieTmpComp = (function () {
8190
backgroundColor: styleControl(LottieStyle),
8291
animationStart: dropdownControl(animationStartOptions, "auto"),
8392
loop: dropdownControl(loopOptions, "single"),
93+
keepLastFrame: BoolControl.DEFAULT_TRUE,
8494
};
85-
8695
return new UICompBuilder(childrenMap, (props) => {
8796
return (
8897
<div
@@ -95,8 +104,9 @@ let JsonLottieTmpComp = (function () {
95104
>
96105
<Player
97106
key={
98-
[props.speed, props.animationStart, props.loop, props.value] as any
107+
[props.speed, props.animationStart, props.loop, props.value,props.keepLastFrame] as any
99108
}
109+
keepLastFrame={props.keepLastFrame}
100110
autoplay={props.animationStart === "auto" && true}
101111
hover={props.animationStart === "on hover" && true}
102112
loop={props.loop === "single" ? false : true}
@@ -117,7 +127,7 @@ let JsonLottieTmpComp = (function () {
117127
<>
118128
<Section name={sectionNames.basic}>
119129
{children.value.propertyView({
120-
label: trans("lottieJson"),
130+
label: trans("jsonLottie.lottieJson"),
121131
})}
122132
{children.speed.propertyView({
123133
label: trans("jsonLottie.speed"),
@@ -128,6 +138,9 @@ let JsonLottieTmpComp = (function () {
128138
{children.animationStart.propertyView({
129139
label: trans("jsonLottie.animationStart"),
130140
})}
141+
{children.keepLastFrame.propertyView({
142+
label: trans("jsonLottie.keepLastFrame"),
143+
})}
131144
</Section>
132145
<Section name={sectionNames.style}>
133146
{children.backgroundColor.getPropertyView()}

‎client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -875,18 +875,15 @@ export const LottieStyle = [
875875
name: "background",
876876
label: trans("style.background"),
877877
depTheme: "canvas",
878-
depType: DEP_TYPE.CONTRAST_TEXT,
879-
transformer: contrastText,
878+
depType: DEP_TYPE.SELF,
879+
transformer: toSelf,
880880
},
881-
MARGIN,
882-
PADDING,
883881
] as const;
884882
/////////////////////
885883

886884
export const CarouselStyle = [getBackground("canvas")] as const;
887885

888886
export const RichTextEditorStyle = [getStaticBorder(), RADIUS] as const;
889-
890887
export type InputLikeStyleType = StyleConfigType<typeof InputLikeStyle>;
891888
export type ButtonStyleType = StyleConfigType<typeof ButtonStyle>;
892889
export type ToggleButtonStyleType = StyleConfigType<typeof ToggleButtonStyle>;

‎client/packages/lowcoder/src/comps/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,7 @@ import {
9191
TreeSelectIcon,
9292
UploadCompIcon,
9393
VideoCompIcon,
94+
LottieIcon,
9495
} from "lowcoder-design";
9596

9697
import { defaultFormData, FormComp } from "./comps/formComp/formComp";
@@ -119,7 +120,6 @@ import { SignatureComp } from "./comps/signatureComp";
119120

120121
//Added by Aqib Mirza
121122
import { JsonLottieComp } from "./comps/jsonComp/jsonLottieComp";
122-
import { LottieIcon } from "../assets/icons";
123123

124124
type Registry = {
125125
[key in UICompType]?: UICompManifest;

‎client/packages/lowcoder/src/i18n/locales/en.ts‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,6 @@ export const en = {
4444
accessControl: " Access Control",
4545
copySuccess: "Copied",
4646
copyError: "Copy error",
47-
lottieJson: "Lottie JSON", //Added By Aqib Mirza
4847
api: {
4948
publishSuccess: "Published",
5049
recoverFailed: "Recover failed",
@@ -2423,13 +2422,19 @@ export const en = {
24232422
},
24242423
//Added By Aqib Mirza
24252424
jsonLottie: {
2425+
lottieJson: "Lottie JSON",
24262426
speed: "Speed",
24272427
width: "Width",
24282428
height: "Height",
24292429
backgroundColor: "Background color",
24302430
animationStart: "Animation Start",
24312431
valueDesc: "Current json Data",
24322432
loop: "Loop",
2433+
auto: 'auto',
2434+
onHover: "On hover",
2435+
singlePlay: "Single Play",
2436+
endlessLoop: "Endless Loop",
2437+
keepLastFrame: "Keep Last Frame",
24332438
},
24342439
/////////////////////
24352440
};

‎client/packages/lowcoder/src/i18n/locales/zh.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2412,5 +2412,20 @@ idSource: {
24122412
slotControl: {
24132413
configSlotView: "配置槽视图",
24142414
},
2415+
jsonLottie: {
2416+
lottieJson: "JSON数据",
2417+
speed: "播放速度",
2418+
width: "宽度",
2419+
height: "高度",
2420+
backgroundColor: "背景颜色",
2421+
animationStart: "播放方式",
2422+
valueDesc: "JSON数据",
2423+
loop: "循环方式",
2424+
auto: "自动",
2425+
onHover: "鼠标悬停时",
2426+
singlePlay: "播放一次",
2427+
endlessLoop: "循环播放",
2428+
keepLastFrame: "冻结最后一帧",
2429+
},
24152430
};
24162431

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /