Skip to content

A unique scrolling behavior combined with the use of Metal shaders for visual effects. Written in SwiftUI.

Notifications You must be signed in to change notification settings

ZelynaFarrell/CustomScrolling

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 

Repository files navigation

CustomScrolling with Metal Shaders

This SwiftUI project showcases a unique scrolling behavior combined with the use of Metal shaders for visual effects.


Features

  • Custom Scrolling: The project implements a custom scrolling behavior that gives users an intuitive way to navigate through content.
  • Metal Shaders: Various Metal shaders are leveraged to create captivating visual effects, including distortion, noise, embossing, and more.
  • Dynamic Dark Mode: Users can switch between dark and light modes, allowing for a personalized visual experience. In light mode, each card image transforms into a daytime version of the Harry Potter scene.
  • Interactive 3D Icons: Each 3D icon reacts interactively with custom shadows, providing a sense of depth and realism.
  • Animated SF Icons (iOS 17): The project showcases the use of animated SF icons, a feature introduced in iOS 17, adding a dynamic and lively element to the user interface.
  • ScrollTransition Modifiers: Leveraging the ScrollTransition modifier, the project achieves smooth and engaging animations when scrolling through content.

Videos and Demos

Custom Scrolling Card Navigation
Light/Dark WaveShaders
MetalShaders keyframeAnimator

Getting Started

Prerequisites

  • Xcode (with SwiftUI support)
  • iOS Simulator or a physical iOS device

Installation

  • Clone or download the project.
  • Open the project in Xcode.
  • Build and run the project on the desired simulator or device.

Customization

  • Shader Experiments: You can experiment with different Metal shaders by modifying the functions in the ShaderLibrary file. Adjust parameters to see how they affect visual output.
  • Adjust Scrolling Behavior: Customize the scrolling behavior by tweaking parameters in the CardView file. Adjust animations, offsets, and other properties to fine-tune the user experience.
  • Vertical Scrolling Behavior: Can easily be switched into a Vertical scroller in ContentView.

Acknowledgements

  • Metal shaders credit: Hacking with Swift

About

A unique scrolling behavior combined with the use of Metal shaders for visual effects. Written in SwiftUI.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published