Open source, a fully decoupled iOS implementation in ViewPager.

A brief

Now App is more and more attention to the user experience, if you need is to do a let others easily stroll around the interface, such as multi interface effect of this can be around the sliding switch Tab is very suitable, do not need too many users click, interactive effect makes the experience more good sliding around. For example, in the hands of Amoy home Amoy buy, there are good goods, male god fan, will buy list is the way this interaction. We’re flying pigs in the outbound Native when supermarkets home, also take this interaction, the project successfully completed, the interaction effect on all evaluation are also good, I spent a little time to remove some of the business code, code refactoring, extract can be part of the source code, for we make a reference. Project address.

Two, the effect of display

1.1: picture + text switching effect

Open source, a fully decoupled iOS implementation in ViewPager.

1.2: single text switching effect

Open source, a fully decoupled iOS implementation in ViewPager.

1.3: single picture switching effect

Open source, a fully decoupled iOS implementation in ViewPager.

1.4: picture + text selected switching effect

Open source, a fully decoupled iOS implementation in ViewPager.

1.5: more than one screen when switching effect

Open source, a fully decoupled iOS implementation in ViewPager.

Three, how to use

2.1: source introduction

To download the GitHub source code, access to all the files under the YXViewpager/YXViewPager/Classes/* directory to your project directory. The
directory structure is as follows:

Delegate, had YXViewPagerEventDelegate.h had Utility, UIColor+YX.h, UIColor+YX.m had just had, UIView+YX.h, UIView+YX.m, YXViewPagerDefine.h had just / YXViewPagerUtility.h - VC / YXViewPagerBaseSubViewController.h - had just had, YXViewPagerBaseSubViewController.m, YXViewPagerBaseViewController.h, YXViewPagerBaseViewController.m had had View, ViewModel, had, had: YXViewPagerItemViewModel.h / / - YXViewPagerItemViewModel.m / YXViewPagerTopItemView.h / YXViewPagerTopItemView.m had just had, YXViewPagerTopView.h - - YXViewPager.h - YXViewPagerTopView.m

Delegate: primary processing event callback

Utility: some regular help classes

VC: these two categories are our business lines need to inherit. The main frame ViewController needs to inherit YXViewPagerBaseViewController, each of the following sub ViewController needs to inherit YXViewPagerBaseSubViewController

View: some custom View

2.2:cocoapods introduction

Pod’YXViewPager’,’~> 0.0.1′

2.3: use mode

Specific you can download the GitHub project in the Example directory, provides the Demo, the use is very simple.
side to take more than a screen when switching effect as an example to explain how to use this framework.

Open source, a fully decoupled iOS implementation in ViewPager.

Step 1: create a new ViewController inherited from YXViewPagerBaseViewController.

Named YXViewPagerDemo4ViewController.

- (NSDictionary *) getPageConfigInfo{NSDictionary *configInfo = @{@ @ "topViewBgColor": "#FFFFFF", "maskColor": @ @ @ "#FEEDB1", "type", "itemWidth": @1, @ @60, @ dataArray @ @[@{: "itemType: @2", "title": "@ @ recommended", "normalTitleColor": @ @ @ "#666666", "selectTitleColor": @ #3d3d3d", @ @ "normalIconName": "home_unselect", "selectIconName": @ @ @ "home_select", "vcName": "YXViewPagerSub0ViewController"}, @{@ @ @ @2: "itemType", "title": @ "travel ticket", "normalTitleColor": @ @ @ "#666666", "selectTitleColor": @ #3d3d3d", @ @ "normalIconName": "flight_unselect", "selectIconName": @ @ @ "flight_select", "vcName": "YXViewPagerSub1ViewController"}, @{@ @ @ @2: "itemType", "title": @ "visa", "normalTitleColor": @ @ @ "#666666", "selectTitleColor": @ #3d3d3d", @ @ "normalIconName": "visa_unselect", "selectIconName": @ @ @ "visa_select", "vcName": "YXViewPagerSub2ViewController"}, @{@ @ @ @2: "itemType", "title": @ "Hotel", "normalTitleColor": @ @ @ "#666666", "selectTitleColor": @ #3d3d3d", @ @ "normalIconName": "hotel_unselect", "selectIconName": @ @ @ "hotel_select", "vcName": "YXViewPagerSub3ViewController"}, @{@ @ @ @2: "itemType", "title": @ "car hire", "normalTitleColor": @ @ 666666 @ # "," selectTitleColor "#3d3d3d": @", @ @ "normalIconName": "car_unselect", "selectIconName": @ @ @ "car_select", "vcName": "YXViewPagerSub4ViewController"}, @{@ @ @ @2: "itemType", "title": @ "pick-up", "normalTitleColor": @ @ @ "#666666", "selectTitleColor": @ #3d3d3d", @ @ "normalIconName": "transfer_unselect", "selectIconName": @ @ @ "transfer_select", "vcName": "YXViewPagerSub5ViewController"}, @{@ @ @ @2: "itemType", "title": @ WIFI @ phone cards "," normalTitleColor "," #666666 "," @ @ selectTitleColor "#3d3d3d": @", @ @ "normalIconName": "wifi_unselect", "selectIconName": @ @ @ "wifi_select", "vcName": "YXViewPagerSub6ViewController"}, @{@ @ @ @2: "itemType", "title": @ "tickets", "normalTitleColor": @ @ @ "#666666", "selectTitleColor": @ #3d3d3d", @ @ "normalIconName": "ticket_unselect", "selectIconName": @ @ @ "ticket_select", "vcName": "YXViewPagerSub7ViewController"}, @{@ @ @ @2: "itemType", "title": @ "local fun", "normalTitleColor": @ @ 666666 @ # "," selectTitleColor "#3d3d3d": @", "NormalIconName": @ @ @ "fun_unselect", "selectIconName", "fun_select": @ @ @ "vcName": "YXViewPagerSub8ViewController"}]}; return configInfo;}

Override the getPageConfigInfo method, initialized by the NSDictionary configuration item. Common fields for configuration items.

TopViewBgColor: top tabView background color.

MaskColor: the top tabView sliding when the mask color.

Type: 0–> just a screen, each item width according to the screen adaptation, the top tabView can not roll, 1–> generally used more Item on the top of the project, the width of the item need to be set in the configuration table.

ItemWidth: when type==1, you need to manually set the width of the item.

DataArray: configuration items for each item.

Each of the item configuration items are as follows:

ItemType: 0–> text Item. 1–> picture Item. 2–> text + picture Item

Title: text title

NormalTitleColor: unselected text color.

SelectTitleColor: text color for selected time.

NormalIconName: picture name not selected.

SelectIconName: selected picture name.

VcName: the item binding ViewController instance name.

Configuration items can be written locally to die, you can also send the server dynamically. Need to render, you can manually call [self renderUI].

The second step: each new Item project inside the vcName corresponding to the ViewController instance, the instance needs to inherit from YXViewPagerBaseSubViewController.

The base class provides a communication mechanism between RootVc and SubVc.

@interface YXViewPagerBaseSubViewController: @property UIViewController RootVC / * * * / message parameters to transfer SubVC (nonatomic, strong) NSDictionary *rootToSubInfo SubVC; //RootVC class as a class of agents to deal with some need to subclass to superclass news @ property (nonatomic, weak) id< YXViewPagerEventDelegate> delegate; / / get rootVc in the SubVC class, mainly used to jump @property (nonatomic, strong) UIViewController *rootVc; @end

Each SubVc can be monitored in the setRootToSubInfo method, the parameters passed by RootVc. You can also send messages to RootVc via self.delegate. This forms a conduit for mutual reference. Self.rootVc said in the SubVc access to the RootVc instance, I am here to deal with the main page jump.

RootVc and SubVc communicate through this information pipeline to solve the code coupling between rootVc and each SubVc.

There is not much to say, there are questions, then look at the source code. Source is also very simple.

Four, contact information

Sina micro-blog


Jane book

If you feel useful, star ~ ~ ~ ~ ~.