WZDraggableSwitchHeaderView
  • September 17, 2023

How far your thumb can reach on the iPhone 6 Plus ?

Or, being bored with tapping the button or navigation Item to switch between viewControllers ?

Quick Look


About


This project is inspired by Nike’s awesome official App Making of Making Powered by NIKE MSI.

Installation


CocoaPods

# For latest release in CocoaPods
pod ‘WZDraggableSwitchHeaderView’

Or

# Feeling adventurous? Get the latest on develop
pod ‘WZDraggableSwitchHeaderView’, :git => ‘https://github.com/wongzigii/WZDraggableSwitchHeaderView.git’, :branch => ‘master’

Getting Start


#import “WZDraggableSwitchHeaderView.h”

Create an instance of WZDraggableSwitchHeaderView:

self.headerView = [[WZDraggableSwitchHeaderView alloc] initWithDelegate:self
frame:CGRectMake(0,0,self.view.bounds.size.width,50)
normalStateHeight:20.0f
heightCanTriggerSwitch:70.0f];
[self.view addSubView:self.headerView];

Implement the delegate method that will be invoked:

#pragma mark – WZDraggableSwitchHeaderViewDelegate

– (void)WZDraggableSwitchHeaderViewDidTriggerDeepDragging;
{
[self.navigationController.view.layer addAnimation:[WZAnimatingTransition backwardTransition] forKey:@”transition”];
[self.navigationController popToRootViewControllerAnimated:NO];
}

Hook on the UIScrollViewDelegate:

#pragma mark – UIScrollViewDelegate

– (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
[self.headerView WZDraggableSwitchHeaderViewDidScroll:scrollView];
}

– (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self.headerView WZDraggableSwitchHeaderViewDidEndDragging:scrollView];
}

Done!

Customization


/// The y contentOffset range between normal state and shallow dragging state. If end dragging on this range, `- WZDraggableSwitchHeaderViewDidTriggerShallowDragging` will be invoked.
/// Default is 20.0f.
@property (nonatomic, assign) CGFloat normalStateHeight;

/// The total height of this header view will trace down with. End up dragging on the y contentOffset if less than `heightCanTriggerSwitch`, `- WZDraggableSwitchHeaderViewDidTriggerDeepDragging` will be invoked properly.
/// Default is 70.0f.
@property (nonatomic, assign) CGFloat heightCanTriggerSwitch;

/// The status label shows the text of state.
@property (nonatomic, strong) UILabel *statusLabel;

/// The button can be tapped to return to menu.
@property (nonatomic, strong) UIButton *backButton;

/// The layer of arrow Image.
@property (nonatomic, strong) CALayer *arrowImage;

/// The state of this headerView.
@property (nonatomic, assign) WZDraggableSwitchState state;

/// The text will show in normal state. Default is `ABOUT`.
@property (nonatomic, strong) NSString *normalStateText;

/// The text will show on shallow dragging state. Default is `PULL TO RETURN TO MENU.`
@property (nonatomic, strong) NSString *shallowStateText;

/// The text will show on deep dragging state. Default is `RELEASE TO RETURN TO MENU.`
@property (nonatomic, strong) NSString *deepStateText;

GitHub


View Github

YOU MIGHT ALSO LIKE...
SwiftUI Charts

Build custom charts with SwiftUI Styles

SwiftUICharts

A simple line and bar charting library that support accessibility written using SwiftUI.

Swipeable cards

Swipeable Cards with SwiftUI

RGStack

This UI attempts to capture the Quibi Card Stack and the associated User Interaction.

🃏 CardStack

A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS.