Skip to content

Cleveroad/slidingtutorial-ios

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

35 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

##Sliding Tutorial iOS Awesome

###Simple library that helps developers to create awesome sliding iOS app tutorial.

Applied parallax effects will make your product presentation look like Google apps tutorial.

All you need to do is:
1. Create icons for each screen of your tutorial
2. Follow the instructions below

Usage

Add to your Podline a line
pod 'SlidingTutorial'

Run in terminal command
$ pod install

Then import PRLView.h to your view controller:
#import "PRLView.h"

After you should instantiate an instance of sliding view tutorial class:

PRLView *viewParallax = [[PRLView alloc] initWithPageCount:3 scaleCoefficient:0.8];

Where first parameter is a count of pages in tutorial and second parameter is a coefficient of scaling images (put 1.0 if you don't need scale and images will displaying in a full size).

Then add background colors for all your tutorial pages:
[viewParallax addBackgroundColor:[UIColor colorWithRed:231./255 green:150./255 blue:0 alpha:1]];
[viewParallax addBackgroundColor:[UIColor colorWithRed:163./255 green:181./255 blue:0 alpha:1]];
[viewParallax addBackgroundColor:[UIColor colorWithRed:35./255 green:75./255 blue:122.0/255 alpha:1]];

The colors follow the order they are added. All missing colors will be replaced with white color.

After that you should add all image-layers onto sliding tutorial view:
[viewParallax addElementWithName:@"elem00-00" offsetX:0 offsetY:0 slippingCoefficient:0.3 pageNum:0];
[viewParallax addElementWithName:@"elem01-00" offsetX:-140 offsetY:25 slippingCoefficient:-0.15 pageNum:1];
[viewParallax addElementWithName:@"elem02-00" offsetX:-50 offsetY:-120 slippingCoefficient:0.2 pageNum:2];

First param - image name from your project resources.

offsetX and offsetY - layer offset from the center of the screen. If you send offsetX:0 offsetY:0 your image layer will be placed exactly in the center of the screen. Dot (0,0) in this coords system situated in the center of the screen in all device orientations.

slippingCoefficient - ratio bound to scroll offset in scroll view. For 1 pixel content offset of scroll view layer will be slipping for 1 * slippingCoefficient (so if slippingCoefficient == 0.3, it will be equal 0.3px). Sign determines the direction of slipping - left or right.

pageNum - the page number on which you will add this image layer.

After all call last method - prepareForShow:
[viewParallax prepareForShow];
And now your tutorial is ready to show.

For handle skip button action, you should support PRLViewProtocol and implement protocol method skipTutorial

Support

If you have any questions regarding the use of this tutorial, please contact us for support at info@cleveroad.com (email subject: «Sliding iOS app tutorial. Support request.»)
or
Use our contacts:
Cleveroad.com
Facebook account
Twitter account
Google+ account

License

Copyright (С) 2015 Cleveroad

This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 2 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.

http://choosealicense.com/licenses/gpl-2.0/

You should have received a copy of the GNU General Public License along with this program; if not, write to the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.