在 看见旋律 - WPF 实现音乐监听:频谱图展示-CSDN博客 中,我实现了对音乐旋律的监听,把监测到的鼓点、低频通量等可视化,看到了漂亮有趣的节奏线,现在我们把它与常见的数学线条结合,让节奏影响线条灯粗细、缩放、速度、跳动。
整体处理流程:
把「音频状态 → 相位 → 采样点 → 归一化 → 绘制」串成一条线;画廊里每个格子都走这段逻辑:
// Companion.WinUI3/Rendering/MathCurveGalleryRenderer.cs · DrawTile var influence = MathCurveAudioBindings.ForEntry(entry, index, audioState); var linearPhase = audioState.CyclePhase * entry.Speed; var phase = MathCurvePhaseMapper.MapDisplayPhase(linearPhase, audioState.LoopMode); entry.Sample(phase, SampleBuffer, SampleCount); PrepareDisplaySamples(SampleBuffer, DisplayBuffer, SampleCount); ApplyBeatScalePulse(DisplayBuffer, SampleCount, audioState); DrawCurve(session, plotCenter, radiusX, radiusY, plotRect, linearPhase, audioState.LoopMode, influence); DrawTileLabel(session, entry, x, y + height - labelBand, width, labelBand);音乐不直接改曲线公式,而是改「相位推进速度」和「视觉强度」;鼓点则触发脉冲包络:
// Companion.Core/MathCurveAudioModulator.cs · TickCore 摘录 if (driveChannel != MathCurveDriveChannel.None && isListening && frame is not null) { channelRaw = MathCurveChannelSampler.Sample(driveChannel, frame); channelNormalized = Math.Clamp(channelRaw / _channelScale, 0f, 1f); _trendEstimator.Tick(channelRaw, dt, settings); speedMultiplier = _trendEstimator.SpeedMultiplier; motionIntensity = 0.35f + channelNormalized * 0.45f; } _beatPulseTracker.Tick(dt, isListening, frame?.IsConfirmedKick ?? false, settings); _cyclePhase += dt * baseRate * speedMultiplier; // 动画相位累积以下是 47 种漂亮的数学线条,一起来欣赏吧:
漂亮的茅尓玫瑰,送给你: