From 301b9e0fb802c01edb2ed25695b3ba62e9c61da3 Mon Sep 17 00:00:00 2001 From: bpisano Date: Sun, 26 Jan 2025 10:26:42 +0100 Subject: [PATCH] fixed pattern aspect ratio --- README.md | 2 +- .../Resources/Shaders/FoilShader.metal | 46 +++++++++---------- .../Sticker/StickerEffect/StickerEffect.swift | 11 ++--- .../StickerEffectParameter.swift | 4 +- .../StickerPattern/StickerPatternType.swift | 13 ++++++ .../Extensions/ShaderLibraryExtension.swift | 7 +-- 6 files changed, 43 insertions(+), 40 deletions(-) create mode 100644 Sources/Sticker/StickerPattern/StickerPatternType.swift diff --git a/README.md b/README.md index 8e24946..bcb5b2e 100644 --- a/README.md +++ b/README.md @@ -46,7 +46,7 @@ The following modifiers are available to customize the sticker effect: | `.stickerNoiseScale(_:)` | 100.0 | Adjusts the scale of the noise pattern | | `.stickerNoiseIntensity(_:)` | 1.2 | Controls the intensity of the noise effect | | `.stickerLightIntensity(_:)` | 0.3 | Adjusts the intensity of the light reflection | -| `.stickerPatternType(_:)` | diamond | Modifies the checker pattern | +| `.stickerPattern(_:)` | diamond | Modifies the checker pattern | Example usage: diff --git a/Sources/Sticker/Resources/Shaders/FoilShader.metal b/Sources/Sticker/Resources/Shaders/FoilShader.metal index a6cf081..3ce7ee2 100644 --- a/Sources/Sticker/Resources/Shaders/FoilShader.metal +++ b/Sources/Sticker/Resources/Shaders/FoilShader.metal @@ -37,25 +37,6 @@ float noisePattern(float2 uv) { return mix(a, b, u.x) + (c - a) * u.y * (1.0 - u.x) + (d - b) * u.x * u.y; } -// Checker pattern function to create a diamond (lozenge) effect -float checkerPattern(float2 uv, float scale, float degreesAngle) { - float radiansAngle = degreesAngle * M_PI_F / 180; - - // Scale the UV coordinates - uv *= scale; - - // Rotate the UV coordinates by the specified angle - float cosAngle = cos(radiansAngle); - float sinAngle = sin(radiansAngle); - float2 rotatedUV = float2( - cosAngle * uv.x - sinAngle * uv.y, - sinAngle * uv.x + cosAngle * uv.y - ); - - // Determine if the current tile is black or white - return fmod(floor(rotatedUV.x) + floor(rotatedUV.y), 2.0) == 0.0 ? 0.0 : 1.0; -} - // Function to mix colors with more intensity on lighter colors half4 lightnessMix(half4 baseColor, half4 overlayColor, float intensity, float baselineFactor) { // Calculate brightness of the base color @@ -92,9 +73,9 @@ float squarePattern(float2 uv, float scale, float degreesAngle) { float cosAngle = cos(radiansAngle); float sinAngle = sin(radiansAngle); float2 rotatedUV = float2( - cosAngle * uv.x - sinAngle * uv.y, - sinAngle * uv.x + cosAngle * uv.y - ); + cosAngle * uv.x - sinAngle * uv.y, + sinAngle * uv.x + cosAngle * uv.y + ); // Determine if the current tile is black or white return fmod(floor(rotatedUV.x) + floor(rotatedUV.y), 2.0) == 0.0 ? 0.0 : 1.0; @@ -116,17 +97,34 @@ float stickerPattern(int option, float2 uv, float scale) { } } +[[ stitchable ]] half4 foil( + float2 position, + half4 color, + float2 offset, + float2 size, + float scale, + float intensity, + float contrast, + float blendFactor, + float checkerScale, + float checkerIntensity, + float noiseScale, + float noiseIntensity, + float patternType +) { + // Calculate aspect ratio (width / height) + float aspectRatio = size.x / size.y; -[[ stitchable ]] half4 foil(float2 position, half4 color, float2 offset, float2 size, float scale, float intensity, float contrast, float blendFactor, float checkerScale, float checkerIntensity, float noiseScale, float noiseIntensity, float patternType) { // Normalize the offset by dividing by size to keep it consistent across different view sizes float2 normalizedOffset = (offset + size * 250) / (size * scale) * 0.01; + float2 normalizedPosition = float2(position.x * aspectRatio, position.y); // Adjust UV coordinates by adding the normalized offset, then apply scaling float2 uv = (position / (size * scale)) + normalizedOffset; // Scale the noise based on the normalized position and noiseScale parameter float gradientNoise = random(position) * 0.1; - float pattern = stickerPattern(patternType, position / size * checkerScale, checkerScale); + float pattern = stickerPattern(patternType, normalizedPosition / size * checkerScale, checkerScale); float noise = noisePattern(position / size * noiseScale); // Calculate less saturated color shifts for a metallic effect diff --git a/Sources/Sticker/StickerEffect/StickerEffect.swift b/Sources/Sticker/StickerEffect/StickerEffect.swift index 9272ff5..b5e04cf 100644 --- a/Sources/Sticker/StickerEffect/StickerEffect.swift +++ b/Sources/Sticker/StickerEffect/StickerEffect.swift @@ -99,14 +99,11 @@ extension View { .shadow(radius: 20) .padding() - Circle() - .fill(.white) - .overlay { - Circle() - .stroke(.black, lineWidth: 16) - .padding() - } + Image(systemName: "applelogo") + .resizable() + .aspectRatio(contentMode: .fit) .frame(height: 300) + .foregroundStyle(.white) .animation(.snappy) { view in view .stickerEffect() diff --git a/Sources/Sticker/StickerEffectParameter/StickerEffectParameter.swift b/Sources/Sticker/StickerEffectParameter/StickerEffectParameter.swift index 7d58d70..55a02e6 100644 --- a/Sources/Sticker/StickerEffectParameter/StickerEffectParameter.swift +++ b/Sources/Sticker/StickerEffectParameter/StickerEffectParameter.swift @@ -17,7 +17,7 @@ extension EnvironmentValues { @Entry var stickerNoiseScale: Float = 100 @Entry var stickerNoiseIntensity: Float = 1.2 @Entry var stickerLightIntensity: Float = 0.3 - @Entry var stickerPattern: StickerPattern = .diamond + @Entry var stickerPattern: StickerPatternType = .diamond } extension View { @@ -57,7 +57,7 @@ extension View { environment(\.stickerLightIntensity, intensity) } - public func stickerPatternType(_ type: StickerPattern) -> some View { + public func stickerPattern(_ type: StickerPatternType) -> some View { environment(\.stickerPattern, type) } } diff --git a/Sources/Sticker/StickerPattern/StickerPatternType.swift b/Sources/Sticker/StickerPattern/StickerPatternType.swift new file mode 100644 index 0000000..c6749ef --- /dev/null +++ b/Sources/Sticker/StickerPattern/StickerPatternType.swift @@ -0,0 +1,13 @@ +// +// StickerPatternType.swift +// Sticker +// +// Created by Benjamin Pisano on 26/01/2025. +// + +import Foundation + +public enum StickerPatternType: Int, Hashable, Equatable, Sendable { + case diamond = 0 + case square = 1 +} diff --git a/Sources/Sticker/Utils/Extensions/ShaderLibraryExtension.swift b/Sources/Sticker/Utils/Extensions/ShaderLibraryExtension.swift index 7de8370..8a227b9 100644 --- a/Sources/Sticker/Utils/Extensions/ShaderLibraryExtension.swift +++ b/Sources/Sticker/Utils/Extensions/ShaderLibraryExtension.swift @@ -21,7 +21,7 @@ extension ShaderLibrary { checkerIntensity: Float = 1.2, noiseScale: Float = 100, noiseIntensity: Float = 1.2, - patternType: StickerPattern = .diamond + patternType: StickerPatternType = .diamond ) -> Shader { moduleLibrary.foil( .float2(offset), @@ -60,8 +60,3 @@ public extension ShaderLibrary { try await reflectionShader().compile(as: .colorEffect) } } - -public enum StickerPattern: Int, Hashable, Equatable, Sendable { - case diamond = 0 - case square = 1 -}