90 lines
3.8 KiB
TypeScript
90 lines
3.8 KiB
TypeScript
|
import { IGroup, IShape } from '@antv/g-base';
|
|||
|
|
import Button from './timeButton';
|
|||
|
|
import { ExtendedShapeStyle } from './constant';
|
|||
|
|
export declare const TIME_TYPE: {
|
|||
|
|
SINGLE: "single";
|
|||
|
|
RANGE: "range";
|
|||
|
|
};
|
|||
|
|
export type ControllerCfg = Partial<{
|
|||
|
|
readonly group: IGroup;
|
|||
|
|
/** 控制栏的起始位置以及宽高，width height 将不缩放内部子控制器，仅影响它们的位置分布。需要缩放请使用 scale */
|
|||
|
|
readonly x?: number;
|
|||
|
|
readonly y?: number;
|
|||
|
|
readonly width: number;
|
|||
|
|
readonly height: number;
|
|||
|
|
/** 控制器背景的颜色和描边色 */
|
|||
|
|
readonly fill?: string;
|
|||
|
|
readonly stroke?: string;
|
|||
|
|
/** 整个控制栏的字体样式，优先级低于各个子控制器的 text 内的 fontFamily */
|
|||
|
|
readonly fontFamily?: string;
|
|||
|
|
/** 控制栏缩放比例 */
|
|||
|
|
readonly scale?: number;
|
|||
|
|
/** 播放速度，1 个 tick 花费时间 */
|
|||
|
|
readonly speed?: number;
|
|||
|
|
/** 是否循环播放 */
|
|||
|
|
readonly loop?: boolean;
|
|||
|
|
readonly hideTimeTypeController: boolean;
|
|||
|
|
/** ‘上一帧’按钮的样式，同时可以为其配置 scale、offsetX、offsetY 单独控制该控制器的缩放以及平移 */
|
|||
|
|
readonly preBtnStyle?: ExtendedShapeStyle;
|
|||
|
|
/** ‘下一帧’按钮的样式，同时可以为其配置 scale、offsetX、offsetY 单独控制该控制器的缩放以及平移 */
|
|||
|
|
readonly nextBtnStyle?: ExtendedShapeStyle;
|
|||
|
|
/** ‘播放’ 与 ‘暂停’ 按钮的样式，同时可以为其配置 scale、offsetX、offsetY 单独控制该控制器的缩放以及平移 */
|
|||
|
|
readonly playBtnStyle?: ExtendedShapeStyle;
|
|||
|
|
/** 控制栏背景方框的样式 */
|
|||
|
|
readonly containerStyle?: ExtendedShapeStyle;
|
|||
|
|
/** ‘速度控制器’ 的样式，包括速度的指针、速度指示滚轮（横线）、文本的样式，以及整个速度控制器的缩放（scale）与左右偏移（offsetX，offsetY） */
|
|||
|
|
readonly speedControllerStyle?: {
|
|||
|
|
offsetX?: number;
|
|||
|
|
offsetY?: number;
|
|||
|
|
scale?: number;
|
|||
|
|
pointer?: ExtendedShapeStyle;
|
|||
|
|
scroller?: ExtendedShapeStyle;
|
|||
|
|
text?: ExtendedShapeStyle;
|
|||
|
|
};
|
|||
|
|
/** ‘播放时间类型切换器’ 的样式，包括 checkbox 的框、checkbox 的选中勾、文本的样式，以及整个播放时间类型控制器的缩放（scale）与左右偏移（offsetX，offsetY） */
|
|||
|
|
readonly timeTypeControllerStyle?: {
|
|||
|
|
offsetX?: number;
|
|||
|
|
offsetY?: number;
|
|||
|
|
scale?: number;
|
|||
|
|
check?: ExtendedShapeStyle;
|
|||
|
|
box?: ExtendedShapeStyle;
|
|||
|
|
text?: ExtendedShapeStyle;
|
|||
|
|
};
|
|||
|
|
/** 播放时间类型切换器单一文本时的文本，默认为‘单一时间’ */
|
|||
|
|
readonly timePointControllerText?: string;
|
|||
|
|
/** 播放时间类型切换器单一文本时的文本，默认为‘时间范围’ */
|
|||
|
|
readonly timeRangeControllerText?: string;
|
|||
|
|
/** 时间播放类型默认值，不配置则为 'range' 即‘时间范围’ */
|
|||
|
|
readonly defaultTimeType?: 'single' | 'range';
|
|||
|
|
}>;
|
|||
|
|
export default class ControllerBtn {
|
|||
|
|
/** 是否处于播放状态 */
|
|||
|
|
private isPlay;
|
|||
|
|
playButton: Button;
|
|||
|
|
preStepButton: IShape;
|
|||
|
|
nextStepButton: IShape;
|
|||
|
|
private checkedIcon;
|
|||
|
|
private checkedText;
|
|||
|
|
readonly controllerCfg?: ControllerCfg;
|
|||
|
|
private group;
|
|||
|
|
private controllerGroup;
|
|||
|
|
private fontFamily;
|
|||
|
|
private speedGroup;
|
|||
|
|
private toggleGroup;
|
|||
|
|
private speedText;
|
|||
|
|
private speedPoint;
|
|||
|
|
private speedAxisY;
|
|||
|
|
private currentSpeed;
|
|||
|
|
private currentType;
|
|||
|
|
constructor(cfg: ControllerCfg);
|
|||
|
|
init(): void;
|
|||
|
|
/** 获取播放键 marker path */
|
|||
|
|
private getNextMarkerPath;
|
|||
|
|
private getPreMarkerPath;
|
|||
|
|
private renderPlayButton;
|
|||
|
|
private renderSpeedBtn;
|
|||
|
|
private getPointerPath;
|
|||
|
|
private renderToggleTime;
|
|||
|
|
private bindEvent;
|
|||
|
|
destroy(): void;
|
|||
|
|
}
|