From e1380a2e3f17a988d887b5036303193d47bba397 Mon Sep 17 00:00:00 2001 From: hufeixiong <673632758@qq.com> Date: Wed, 11 Aug 2021 17:16:22 +0800 Subject: [PATCH] update 0.8.1 --- CHANGELOG.md | 4 + packages/dooringx-doc/src/changelog/1.1.md | 4 + packages/dooringx-example/src/pages/index.tsx | 5 +- .../plugin/formComponents/animateControl.tsx | 44 ++- packages/dooringx-lib/README.md | 2 +- packages/dooringx-lib/package.json | 2 +- .../components/IframeWrapperMove/index.tsx | 4 +- .../dooringx-lib/src/components/blocks.tsx | 1 - .../dooringx-lib/src/components/control.tsx | 8 + .../src/components/timeLine/timeline.tsx | 307 ++++++++++++++++++ .../src/components/timeLine/timelineItem.tsx | 108 ++++++ .../src/components/wrapperMove/index.tsx | 4 +- packages/dooringx-lib/src/config/index.tsx | 3 +- 13 files changed, 474 insertions(+), 22 deletions(-) create mode 100644 packages/dooringx-lib/src/components/timeLine/timeline.tsx create mode 100644 packages/dooringx-lib/src/components/timeLine/timelineItem.tsx diff --git a/CHANGELOG.md b/CHANGELOG.md index 2ed2cde..ba6dbfa 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ ## changelog +## 0.8.1 + +新增动画组件timeline。可以更好预览所有动画。 + ## 0.8.0 动画部分重构,可支持多动画同时配置。 diff --git a/packages/dooringx-doc/src/changelog/1.1.md b/packages/dooringx-doc/src/changelog/1.1.md index 6f96d1f..c319f37 100644 --- a/packages/dooringx-doc/src/changelog/1.1.md +++ b/packages/dooringx-doc/src/changelog/1.1.md @@ -4,6 +4,10 @@ order: 1 --- ## changelog +## 0.8.1 + +新增动画组件timeline。可以更好预览所有动画。 + ## 0.8.0 动画部分重构,可支持多动画同时配置。 diff --git a/packages/dooringx-example/src/pages/index.tsx b/packages/dooringx-example/src/pages/index.tsx index b0c2b8f..085d1fc 100644 --- a/packages/dooringx-example/src/pages/index.tsx +++ b/packages/dooringx-example/src/pages/index.tsx @@ -2,7 +2,7 @@ * @Author: yehuozhili * @Date: 2021-05-15 12:49:28 * @LastEditors: yehuozhili - * @LastEditTime: 2021-07-20 16:30:12 + * @LastEditTime: 2021-08-11 16:26:46 * @FilePath: \dooringx\packages\dooringx-example\src\pages\index.tsx */ import { @@ -31,7 +31,6 @@ export default function IndexPage() { }, [config]); const [state] = useStoreState(config, subscribeFn, everyFn); - return (
@@ -68,7 +67,7 @@ export default function IndexPage() { <> diff --git a/packages/dooringx-example/src/plugin/formComponents/animateControl.tsx b/packages/dooringx-example/src/plugin/formComponents/animateControl.tsx index ea58196..dd08261 100644 --- a/packages/dooringx-example/src/plugin/formComponents/animateControl.tsx +++ b/packages/dooringx-example/src/plugin/formComponents/animateControl.tsx @@ -1,4 +1,4 @@ -import React, { useMemo, useState } from 'react'; +import React, { useMemo } from 'react'; import { UserConfig, deepCopy, createUid } from 'dooringx-lib'; import { Col, Row, Select, InputNumber, Button } from 'antd'; import { FormMap, FormBaseType } from '../formTypes'; @@ -121,9 +121,19 @@ const timeFunction: Record = { 缓入: 'ease in', }; +let lastAnimate: AnimateItem[] = []; +let isOmit = false; + function AnimateControl(props: AnimateControlProps) { - const animate = props.current.animate; const store = props.config.getStore(); + + const animate = useMemo(() => { + if (isOmit) { + return lastAnimate; + } + lastAnimate = props.current.animate; + return props.current.animate; + }, [props.current.animate]); return ( <> {animate.map((v, i) => { @@ -164,6 +174,7 @@ function AnimateControl(props: AnimateControlProps) { `${value}s`} min={0} @@ -191,6 +202,7 @@ function AnimateControl(props: AnimateControlProps) { value={animate[i].animationDelay} formatter={(value) => `${value}s`} min={0} + step="0.1" onChange={(d) => { const cloneData: IStoreData = deepCopy(store.getData()); cloneData.block.forEach((w) => { @@ -291,22 +303,28 @@ function AnimateControl(props: AnimateControlProps) { {animate.length > 0 && ( +
diff --git a/packages/dooringx-lib/src/config/index.tsx b/packages/dooringx-lib/src/config/index.tsx index fb3bfe8..466dabd 100644 --- a/packages/dooringx-lib/src/config/index.tsx +++ b/packages/dooringx-lib/src/config/index.tsx @@ -2,7 +2,7 @@ * @Author: yehuozhili * @Date: 2021-02-25 21:16:58 * @LastEditors: yehuozhili - * @LastEditTime: 2021-08-03 23:19:24 + * @LastEditTime: 2021-08-11 16:16:09 * @FilePath: \dooringx\packages\dooringx-lib\src\config\index.tsx */ import React from 'react'; @@ -344,6 +344,7 @@ export class UserConfig { public focusState = focusState; public collapsed = false; public ticker = true; + public timeline = false; public wrapperMoveState = wrapperMoveState; public iframeWrapperMoveState = iframeWrapperMoveState; public refreshIframe = () => {};