ng-cw-v12
Version:
Angular UI Component Library
67 lines (66 loc) • 3.04 kB
TypeScript
import { OnInit, OnDestroy, AfterViewInit, ElementRef, OnChanges, SimpleChanges, NgZone } from '@angular/core';
import * as i0 from "@angular/core";
export declare class RippleGridBackgroundComponent implements OnInit, AfterViewInit, OnDestroy, OnChanges {
private ngZone;
containerRef: ElementRef<HTMLDivElement>;
/** 彩虹模式关闭时网格的颜色 */
ncGridColor: string;
/** 控制中心波纹效应的强度（0-0.3）*/
ncRippleIntensity: number;
/** 控制网格图案的密度/大小（5-30）*/
ncGridSize: number;
/** 控制网格线的粗细（5-50）*/
ncGridThickness: number;
/** 控制淡入淡出效果从中心向外延伸的距离（0.5-3）*/
ncFadeDistance: number;
/** 控制暗角（边缘变暗）效果的强度（0.5-5）*/
ncVignetteStrength: number;
/** 为网格线添加发光效果（0-1）*/
ncGlowIntensity: number;
/** 整体效果的不透明度（0-1）*/
ncOpacity: number;
/** 将整个网格图案旋转一定角度（0-360）*/
ncGridRotation: number;
/** 启用鼠标/触摸交互以产生涟漪效 */
private _mouseInteraction;
set ncMouseInteraction(val: boolean | string);
get ncMouseInteraction(): boolean;
/** 控制鼠标交互效果的半径（0.2-2）*/
ncMouseInteractionRadius: number;
/** 为网格启用彩虹色循环动画 */
private _enableRainbow;
set ncEnableRainbow(val: boolean | string);
get ncEnableRainbow(): boolean;
private renderer;
private scene;
private camera;
private material;
private mesh;
private resizeObserver;
private intersectionObserver;
private rafId;
private resizeRafId;
private isVisible;
private isDestroyed;
private clock;
private mousePosition;
private targetMouse;
private targetInfluence;
constructor(ngZone: NgZone);
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnDestroy(): void;
ngOnChanges(changes: SimpleChanges): void;
private hexToRgb;
private updateUniforms;
private initWebGL;
onMouseMove(e: MouseEvent): void;
onMouseEnter(): void;
onMouseLeave(): void;
private setupResizeObserver;
private setupIntersectionObserver;
private startAnimation;
private cleanup;
static ɵfac: i0.ɵɵFactoryDeclaration<RippleGridBackgroundComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<RippleGridBackgroundComponent, "nc-ripple-grid-background", never, { "ncGridColor": "ncGridColor"; "ncRippleIntensity": "ncRippleIntensity"; "ncGridSize": "ncGridSize"; "ncGridThickness": "ncGridThickness"; "ncFadeDistance": "ncFadeDistance"; "ncVignetteStrength": "ncVignetteStrength"; "ncGlowIntensity": "ncGlowIntensity"; "ncOpacity": "ncOpacity"; "ncGridRotation": "ncGridRotation"; "ncMouseInteraction": "ncMouseInteraction"; "ncMouseInteractionRadius": "ncMouseInteractionRadius"; "ncEnableRainbow": "ncEnableRainbow"; }, {}, never, ["*"]>;
}