Bind slider handel function

source/Component/Recorder/Recorder.scss

@@ -30,7 +30,7 @@ div.recorder-root {
 		
 		span.ms-Slider-inactive {
 			height: 3px;
-			animation: none;
+			transition: none;
 		}
 	}
 

source/Component/Recorder/Recorder.tsx

@@ -14,6 +14,7 @@ interface IRecorderProps {
 	allTime?: number;
 	currentTime?: number;
 	action?: () => void;
+	valueChange?: (value: number) => any;
 }
 
 class Recorder extends Component<IRecorderProps> {
@@ -85,19 +86,38 @@ class Recorder extends Component<IRecorderProps> {
 				max={this.props.allFrame}
 				className={"recorder-slider" + (isSliderDisable ? " disable" : "")}
 				showValue={false}
+				onChange={(value) => {
+					if (this.props.valueChange && !isSliderDisable) {
+						this.props.valueChange(value);
+					}
+				}}
 			/>
 			<div className="recorder-content">
 				<div className="time-view">
 					{this.getRecordInfo()}
 				</div>
 				<div className="ctrl-button">
-					<div className={"ctrl-action" + (isJumpDisable ? " disable" : "")}>
+					<div
+						className={"ctrl-action" + (isJumpDisable ? " disable" : "")}
+						onClick={() => {
+							if (this.props.valueChange && !isJumpDisable && this.props.currentFrame !== undefined) {
+								this.props.valueChange(this.props.currentFrame - 1);
+							}
+						}}
+					>
 						<Icon iconName="Back"/>
 					</div>
 					<div className="ctrl-action ctrl-action-main" onClick={this.props.action}>
 						<Icon iconName={this.getActionIcon()}/>
 					</div>
-					<div className={"ctrl-action" + (isJumpDisable ? " disable" : "")}>
+					<div
+						className={"ctrl-action" + (isJumpDisable ? " disable" : "")}
+						onClick={() => {
+							if (this.props.valueChange && !isJumpDisable && this.props.currentFrame !== undefined) {
+								this.props.valueChange(this.props.currentFrame + 1);
+							}
+						}}
+					>
 						<Icon iconName="Forward"/>
 					</div>
 				</div>

source/Model/Actuator.ts

@@ -217,6 +217,23 @@ class Actuator extends Emitter<IActuatorEvent> {
 
 	private playTickerTimer?: number;
 
+	/**
+	 * 设置播放进度
+	 */
+	public setPlayProcess(id: number) {
+		if (this.playClip && id >= 0 && id < this.playClip.frames.length) {
+		
+			// 跳转值这帧
+			this.playFrameId = id;
+			this.playFrame = this.playClip.frames[this.playFrameId];
+			this.emit("record", this.playFrame.duration);
+
+			if (this.mod !== ActuatorModel.Play) {
+				this.playClip.play(this.playFrame);
+			}
+		}
+	}
+
 	/**
 	 * 播放时钟
 	 */

source/Panel/ClipPlayer/ClipRecorder.tsx

@@ -93,6 +93,9 @@ class ClipRecorder extends Component<IMixinStatusProps> {
 					console.log("ClipRecorder: Pause start...");
 				}
 			}}
+			valueChange={(value) => {
+				this.props.status?.actuator.setPlayProcess(value);
+			}}
 		/>
 	}
 }