ng-cw-v12
Version:
Angular UI Component Library
80 lines (79 loc) • 3.82 kB
TypeScript
import { OnInit, OnDestroy, AfterViewInit, ElementRef, OnChanges, SimpleChanges, NgZone } from '@angular/core';
import * as i0 from "@angular/core";
export declare type NcWaveType = 'top' | 'middle' | 'bottom';
export interface NcWavePosition {
x?: number;
y?: number;
rotate?: number;
}
export declare class FloatingLinesBackgroundComponent implements OnInit, AfterViewInit, OnDestroy, OnChanges {
private ngZone;
containerRef: ElementRef<HTMLDivElement>;
/** 用于线条渐变着色的十六进制颜色字符串数组(最多 8 种颜色) */
ncLinesGradient: string[];
/** 显示哪些波形层。可以单独切换显示/隐藏各个波形 */
ncEnabledWaves: NcWaveType[];
/** 每波形的线条数。单个数值适用于所有波形,也可以使用数组进行逐波形控制(1-20) */
ncLineCount: number | number[];
/** 行间距。单个数值适用于所有波形,或使用数组进行逐个波形的控制(1-100) */
ncLineDistance: number | number[];
/** 顶部波浪的位置和旋转参数 { x, y, rotate } */
ncTopWavePosition: NcWavePosition;
/** 中部波浪的位置和旋转参数 { x, y, rotate } */
ncMiddleWavePosition: NcWavePosition;
/** 底部波浪的位置和旋转参数 { x, y, rotate } */
ncBottomWavePosition: NcWavePosition;
/** 波浪动画的速度倍增器 */
ncAnimationSpeed: number;
/** 线条是否会对鼠标/指针移动做出反应 */
private _interactive;
set ncInteractive(val: boolean | string);
get ncInteractive(): boolean;
/** 受鼠标交互影响区域的半径(1-30) */
ncBendRadius: number;
/** 与鼠标交互时弯曲效应的强度(-15-15) */
ncBendStrength: number;
/** 鼠标移动跟踪的平滑因子(0-1) */
ncMouseDamping: number;
/** 启用鼠标移动时的视差效果 */
private _parallax;
set ncParallax(val: boolean | string);
get ncParallax(): boolean;
/** 视差效应的强度 */
ncParallaxStrength: number;
/** CSS mix-blend-mode 应用于canvas元素 */
ncMixBlendMode: string;
private scene;
private camera;
private renderer;
private material;
private geometry;
private mesh;
private clock;
private rafId;
private resizeObserver;
private targetMouse;
private currentMouse;
private targetInfluence;
private currentInfluence;
private targetParallax;
private currentParallax;
private uniforms;
constructor(ngZone: NgZone);
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
ngOnChanges(changes: SimpleChanges): void;
private initThree;
private updateUniforms;
private getLineCount;
private getLineDistance;
private setupResizeObserver;
onPointerMove(event: PointerEvent): void;
onPointerLeave(): void;
private animate;
private render;
private cleanupThree;
static ɵfac: i0.ɵɵFactoryDeclaration<FloatingLinesBackgroundComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<FloatingLinesBackgroundComponent, "nc-floating-lines-background", never, { "ncLinesGradient": "ncLinesGradient"; "ncEnabledWaves": "ncEnabledWaves"; "ncLineCount": "ncLineCount"; "ncLineDistance": "ncLineDistance"; "ncTopWavePosition": "ncTopWavePosition"; "ncMiddleWavePosition": "ncMiddleWavePosition"; "ncBottomWavePosition": "ncBottomWavePosition"; "ncAnimationSpeed": "ncAnimationSpeed"; "ncInteractive": "ncInteractive"; "ncBendRadius": "ncBendRadius"; "ncBendStrength": "ncBendStrength"; "ncMouseDamping": "ncMouseDamping"; "ncParallax": "ncParallax"; "ncParallaxStrength": "ncParallaxStrength"; "ncMixBlendMode": "ncMixBlendMode"; }, {}, never, ["*"]>;
}