WVWalkthroughView is an objective C based utility to highlight certain parts for iOS apps.

Overview

WVWalkthroughView

A simple utility written in Objective C to help developers walk a user through their app. It allows a message to be displayed, a particular part of the screen to be (optionally) highlighted and the touch in the highlighted area to be (optionally) passed through.

The first runs and walkthroughs, in my opinion, are one of the most important ways to make a user feel comfortable in a new app.

Demo

Use it however you like - highlighting a particular element, with a touch pointer or covering the whole screen.

You can see it in action here: https://gfycat.com/DirectShamefulFlycatcher. There is also a demo project included to showcase a few of the options.

Installation

Just drag and drop WVWalkthroughView.h and WVWalkthroughView.m files into your iOS project and you'll be ready to go!

Usage

It's ridiculously easy to use this view. Since it extends UIView, just create a new instance of WVWalkthroughView and add it as a subview to any view.

  1. Import the WVWalkthroughView
#import "WVWalkthroughView.h"
  1. Create an instance of WVWalkthroughView and set it's options and delegate
_walkthrough = [[WVWalkthroughView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
[_walkthrough setHideOnTappingEmptyArea:YES];
[_walkthrough setHideOnTappingTooltip:YES];
[_walkthrough setDelegate:self];
  1. Conform your ViewController to the WVWalkthroughViewDelegate protocol and implement the methods as required
@interface ViewController () <WVWalkthroughViewDelegate, UITableViewDataSource, UITableViewDelegate>

...

- (void) didTapEmptyAreaForWalkthrough:(WVWalkthroughView *)walkView {
  //...
}

- (void) didTapMaskedAreaForWalkthrough:(WVWalkthroughView *)walkView {
  //...
}

- (void) didTapTooltipForWalkthrough:(WVWalkthroughView *)walkView {
  //...
}
  1. Add it to the view of your app. I recommend adding it to the window using:
[[UIApplication sharedApplication].keyWindow addSubview:_walkthrough];
  1. Whenever you want to show the overlay, use the method show
[_walkthrough show];

Properties

There are various properties to play around with and they have also been explained in WVWalkthroughView.h.

/**
 * Delegate for receiving callbacks.
 */
@property (nonatomic, weak) id<WVWalkthroughViewDelegate> delegate;

/**
 * The text to be shown as a tooltip.
 */
@property (nonatomic, strong) NSString *text;

/**
 * Font of the icon label.
 */
@property (nonatomic, strong) UIFont *iconFont;

/**
 * The icon to be displayed in the tooltip. Visible
 * only if the `text` property is set.
 */
@property (nonatomic, strong) NSString *iconText;

/**
 * When set to YES, then it allows touches on the masked area
 * to pass through to the view below. Default is NO.
 */
@property (nonatomic, assign) BOOL passTouchThroughEmptyArea;

/**
 * When set to YES, then it shows an animated touch pointer
 * in the middle of the masked area. Default is NO.
 */
@property (nonatomic, assign) BOOL showTouchPointer;

/**
 * When set to YES, then the WalkthoughView hides itself
 * when an empty area (area other than the tooltip and the
 * masked area) is tapped. Default is NO.
 */
@property (nonatomic, assign) BOOL hideOnTappingEmptyArea;

/**
 * When set to YES, then the WalkthoughView hides itself
 * when the tooltip is tapped. Default is NO.
 */
@property (nonatomic, assign) BOOL hideOnTappingTooltip;

/**
 * When set to YES, and when passTouchThroughEmptyArea is NO
 * then the WalkthroughView hides itself on tapping the masked area.
 * Default is NO.
 */
@property (nonatomic, assign) BOOL hideOnTappingMaskedArea;

Methods

The following methods are supported as of now:

/**
 * Shows the WalkthroughView with a subtle animation. Use this to
 * show the WalkthoughView after adding it as a subview.
 */
- (void) show;

/**
 * Hides the WalkthroughView with a subtle animation and removes it from
 * it's superview after completing the animation. Use this to
 * hide the WalkthoughView after adding it as a subview.
 */
- (void) hide;

/**
 * Masks the specified CGRect with the specified radius. Which means that
 * the given CGRect will be cut out.
 */
- (void) addMaskWithRect: (CGRect) rect andCornerRadius: (CGFloat) radius;

Delegates

The following delegates have been implemented:

@optional
- (void) didTapMaskedAreaForWalkthrough: (WVWalkthroughView *) walkView;
- (void) didTapEmptyAreaForWalkthrough: (WVWalkthroughView *) walkView;
- (void) didTapTooltipForWalkthrough: (WVWalkthroughView *) walkView;

License

WVWalkthroughView has been released under an MIT License. I'll be extremely happy if you let me know when you use it in your app.


www.praagya.com

You might also like...
An iOS framework to easily create simple animated walkthrough, written in Swift.
An iOS framework to easily create simple animated walkthrough, written in Swift.

Intro Overview An iOS framework to easily create simple animated walkthrough, written in Swift. Requirements iOS8 Installation with CocoaPods Intro is

PaymentApp - Payment App based on the MVVM architecture, with certain adaptations

PaymentApp Está basado en la arquitectura MVVM, con ciertas adaptaciones. Estruc

Frogatto & Friends is an action-adventure game, starring a certain quixotic frog.

Frogatto & Friends is an action-adventure game, starring a certain quixotic frog. We're trying to push 2D platforming, pixel-art, and music into unch

A cooking book provides recipes to perform certain action on SwiftUI

SwiftUI Recipes This is like a cooking book. provides recipes to perform certain action on SwiftUI Every Project will contain as many SwiftUI views as

LottieView - Wrapper around Lottie in SwiftUI that allows chaining animations & triggering callbacks at certain frames

LottieView is a Wrapper around Lottie in SwiftUI that allows chaining animations & triggering callbacks at certain frames

      MarkdownView is a WKWebView based UI element, and internally use bootstrap, highlight.js, markdown-it.
MarkdownView is a WKWebView based UI element, and internally use bootstrap, highlight.js, markdown-it.

MarkdownView is a WKWebView based UI element, and internally use bootstrap, highlight.js, markdown-it.

JSPatch bridge Objective-C and Javascript using the Objective-C runtime. You can call any Objective-C class and method in JavaScript by just including a small engine. JSPatch is generally used to hotfix iOS App.

JSPatch 中文介绍 | 文档 | JSPatch平台 请大家不要自行接入 JSPatch,统一接入 JSPatch 平台,让热修复在一个安全和可控的环境下使用。原因详见 这里 JSPatch bridges Objective-C and JavaScript using the Object

Spare Parts is a 2D physics game that lets you build silly contraptions and machines.

Spare Parts Spare Parts is a 2D physics game that lets you build silly contraptions and machines. The goal for this project is: 100% of the code is op

A cli program written in swift (with async/await) that removes the unnecessary parts of xcframeworks.

xctrim A cli program written in swift (with async/await) that removes the unnecessary parts of xcframeworks. Usecase Say you downloaded firebase sdk a

WhirlyGlobe-Maply is a mapping toolkit with two parts, hence the dash.
WhirlyGlobe-Maply is a mapping toolkit with two parts, hence the dash.

What is WhirlyGlobe-Maply? WhirlyGlobe-Maply is a mapping toolkit with two parts, hence the dash. The WhirlyGlobe part is an interactive 3D globe. The

👋 A place for Jeep owners to buy and sell Jeep parts. O|||||||O
👋 A place for Jeep owners to buy and sell Jeep parts. O|||||||O

Features Look for Jeep parts anywhere in the world. 🌎 Sign up for an account to post your own jeep parts. 👪 Favorites parts to save them for later.

iOS Chart. Support animation, click, scroll, area highlight.
iOS Chart. Support animation, click, scroll, area highlight.

XJYChart XJYChart - A High-performance, Elegant, Easy-to-integrate Charting Framework. The Best iOS Objc Charts. chart more beautiful support chart sc

Weather Forecast Assigment is an iOS application built to highlight MVP and Clean Architecture concepts

Weather Forecast Assigment - iOS - MVP + Clean Architecture Description Weather Forecast Assigment is an iOS application built to highlight MVP (Model

Swift-Misc-Utility - Taking the misc out of General Utility so that General only defines the namespace

Swift-Misc-Utility Everything extra that used to be in Swift-General-Utility has

UISlider clone with multiple thumbs and values, range highlight, optional snap intervals, optional value labels, either vertical or horizontal.
UISlider clone with multiple thumbs and values, range highlight, optional snap intervals, optional value labels, either vertical or horizontal.

MultiSlider UISlider clone with multiple thumbs and values, range highlight, optional snap intervals, optional value labels, either vertical or horizo

CodeEditor - A SwiftUI TextEditor with syntax highlighting using Highlight.js
CodeEditor - A SwiftUI TextEditor with syntax highlighting using Highlight.js

CodeEditor A SwiftUI TextEditor View with syntax highlighting using Highlight.js. It builds on top of Highlightr which does the wrapping of Highlight.

🖍 Highlight whatever you want!
🖍 Highlight whatever you want!

Highlighter Updates See CHANGELOG for details Intoduction 🖍 Highlight whatever you want! Highlighter will magically find UI objects such as UILabel,

UISlider clone with multiple thumbs and values, range highlight, optional snap intervals, optional value labels, either vertical or horizontal.
UISlider clone with multiple thumbs and values, range highlight, optional snap intervals, optional value labels, either vertical or horizontal.

MultiSlider UISlider clone with multiple thumbs and values, range highlight, optional snap intervals, optional value labels, either vertical or horizo

swift-highlight a pure-Swift data structure library designed for server applications that need to store a lot of styled text

swift-highlight is a pure-Swift data structure library designed for server applications that need to store a lot of styled text. The Highlight module is memory-efficient and uses slab allocations and small-string optimizations to pack large amounts of styled text into a small amount of memory, while still supporting efficient traversal through the Sequence protocol.

Owner
Praagya Joshi
Engineer lead
Praagya Joshi
SwiftyWalkthrough is a library for creating great walkthrough experiences in your apps, written in Swift.

SwiftyWalkthrough is a library for creating great walkthrough experiences in your apps, written in Swift. You can use the library to allow users to navigate and explore your app, step by step, in a predefined way controlled by you.

Rui Costa 370 Nov 24, 2022
A simple keyframe-based animation framework for iOS, written in Swift. Perfect for scrolling app intros.

RazzleDazzle is a simple AutoLayout-friendly keyframe animation framework for iOS, written in Swift. Perfect for scrolling app intros. RazzleDazzle gr

IFTTT 3.4k Jan 1, 2023
A simple keyframe-based animation framework for UIKit. Perfect for scrolling app intros.

Jazz Hands is a simple keyframe-based animation framework for UIKit. Animations can be controlled via gestures, scroll views, KVO, or ReactiveCocoa. J

IFTTT 6.4k Dec 28, 2022
Swift based simple information view with pointed arrow.

InfoView View to show small text information blocks with arrow pointed to another view.In most cases it will be a button that was pressed. Example To

Anatoliy Voropay 60 Feb 4, 2022
BWWalkthrough is a simple library that helps you build custom walkthroughs for your iOS App

What is BWWalkthrough? BWWalkthrough (BWWT) is a class that helps you create Walkthroughs for your iOS Apps. It differs from other similar classes in

Yari @bitwaker 2.8k Jan 4, 2023
iOS library Paper Onboarding is a material design UI slider written on Swift.

iOS library Paper Onboarding is a material design UI slider written on Swift. We specialize in the designing and coding of custom UI

Ramotion 3.2k Jan 5, 2023
SuggestionsKit is a framework for iOS that was created in order to provide developers with the opportunity to educate users on various features of applications.

SuggestionsKit is a framework for iOS that was created in order to provide developers with the opportunity to educate users

Ilya 63 Nov 30, 2022
A swifty iOS framework that allows developers to create beautiful onboarding experiences.

SwiftyOnboard is being sponsored by the following tool; please help to support us by taking a look and signing up to a free trial SwiftyOnboard A simp

Juan Pablo Fernandez 1.2k Jan 2, 2023
An iOS framework to easily create a beautiful and engaging onboarding experience with only a few lines of code.

Onboard Click Here For More Examples Important Onboard is no longer under active development, and as such if you create any issues or submit pull requ

Mike 6.5k Dec 17, 2022
Fully customisable tooltip view in Swift for iOS.

Description EasyTipView is a fully customizable tooltip view written in Swift that can be used as a call to action or informative tip. Contents Featur

Teo 2.9k Dec 27, 2022