您好,登錄后才能下訂單哦!
如今很多應(yīng)用已經(jīng)不再局限于點(diǎn)擊按鈕觸發(fā)事件來(lái)進(jìn)行視圖之間切換,為迎合給予用戶(hù)更好體驗(yàn),體現(xiàn)iOS系統(tǒng)極佳用戶(hù)體驗(yàn),使用手勢(shì)來(lái)進(jìn)行各個(gè)視圖之間切換,用戶(hù)至于一個(gè)大拇指在屏幕中央就可瀏覽到很多信息;
關(guān)于 RNSwipeViewController: https://github.com/rnystrom/RNSwipeViewController
RNSwipeViewController是別人已經(jīng)寫(xiě)好的一個(gè)ViewController容器,剩下我們要做的就是把自己的視圖容器放到這個(gè)容器中進(jìn)行管理。
首先學(xué)習(xí) RNSwipeViewController里面的Demo
1.創(chuàng)建一個(gè)Single View Application工程,next,勾選 Use Storyboards,Use Automatic Reference Counting
2.將RNSwipeViewController拖入新建到工程,添加QuartzCore.framework
3.新建四個(gè)類(lèi)CenterViewController、LeftViewController、RightViewController、BottomViewController,繼承UIViewController類(lèi)
4.打開(kāi)StoryBoard,從庫(kù)里拖入四個(gè)ViewController視圖控制器到StoryBoard里面,選中一個(gè)視圖控制器設(shè)置類(lèi)名和Storyboard ID,其他三個(gè)類(lèi)似
,
5.在ViewController.h將加入#import "RNSwipeViewController.h"并將繼承類(lèi)改為RNSwipeViewController,在ViewDidLoad方法中
- (void)viewDidLoad { [super viewDidLoad]; CenterViewController *centerView = [self.storyboard instantiateViewControllerWithIdentifier:@"CenterViewController"]; UINavigationController *centerNav = [[UINavigationController alloc] initWithRootViewController:centerView]; centerView.title =@"Center"; self.centerViewController = centerNav; self.leftViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"LeftViewController"]; self.rightViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"RightViewController"]; self.bottomViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"BottomViewController"]; }
如此我們就完成三個(gè)視圖之間手勢(shì)交互,首先出現(xiàn)的視圖作為主視圖,其他試圖再是在它上面進(jìn)行運(yùn)動(dòng),手指向左滑右側(cè)視圖出現(xiàn),向右滑動(dòng)出現(xiàn)左視圖,向上滑動(dòng)出現(xiàn)底部視圖出現(xiàn)
..
平常我們?cè)跇?gòu)建一個(gè)帶有XIB視圖控制類(lèi)的時(shí)候,初始化一般這樣
CenterViewController *centerVC = [[CenterViewController alloc] initWithNibName:@"CenterViewController" bundle:nil];
但是在StoryBoard中,視圖的Storyboard ID 成了這是視圖的唯一標(biāo)示,再給一個(gè)視圖所屬類(lèi)時(shí),設(shè)定好該視圖的Storyboard ID,進(jìn)行初始化時(shí)CenterViewController *centerView = [self.storyboard instantiateViewControllerWithIdentifier:@"CenterViewController"];
這個(gè)類(lèi)庫(kù)中也提供按鈕點(diǎn)擊進(jìn)行視圖交互方法,同時(shí)也設(shè)置視圖顯示寬度的屬性,在類(lèi)庫(kù)實(shí)現(xiàn)的里面視圖寬度有默認(rèn)值
_leftVisibleWidth = 200.f;
_rightVisibleWidth = 200.f;
_bottomVisibleHeight = 300.0f;
再此我們可以在自己類(lèi)里修改這個(gè)屬性,根據(jù)自己需求,作圖下設(shè)置
ViewController.m
- (void)viewDidLoad { [super viewDidLoad]; CenterViewController *centerView = [self.storyboard instantiateViewControllerWithIdentifier:@"CenterViewController"]; UINavigationController *centerNav = [[UINavigationController alloc] initWithRootViewController:centerView]; centerView.title =@"Center"; self.centerViewController = centerNav; self.leftViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"LeftViewController"]; self.leftVisibleWidth = 100; self.rightViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"RightViewController"]; self.rightVisibleWidth = self.view.frame.size.width; self.bottomViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"BottomViewController"]; }
我們?cè)俳o導(dǎo)航欄上添加兩個(gè)按鈕,在CenterViewController類(lèi)中,包含#import "UIViewController+RNSwipeViewController.h"
- (void)viewDidLoad { [super viewDidLoad]; UIButton *leftBtn = [UIButton buttonWithType:UIButtonTypeCustom]; leftBtn.frame = CGRectMake(0, 0, 44, 44); [leftBtn setImage:[UIImage p_w_picpathNamed:@"left.png"] forState:UIControlStateNormal]; [leftBtn addTarget:self action:@selector(toggleLeft) forControlEvents:UIControlEventTouchUpInside]; UIBarButtonItem *leftBar = [[UIBarButtonItem alloc] initWithCustomView:leftBtn]; self.navigationItem.leftBarButtonItem = leftBar ; UIButton *rightBtn = [UIButton buttonWithType:UIButtonTypeCustom]; rightBtn.frame = CGRectMake(self.view.frame.size.width-44, 0,44 , 44); [rightBtn setImage:[UIImage p_w_picpathNamed:@"right.png"] forState:UIControlStateNormal]; [rightBtn addTarget:self action:@selector(toggleRight) forControlEvents:UIControlEventTouchUpInside]; UIBarButtonItem *rightBar = [[UIBarButtonItem alloc] initWithCustomView:rightBtn]; self.navigationItem.rightBarButtonItem = rightBar; ; }
接著連個(gè)按鈕事件,為了顯示明顯我們可以設(shè)置一下三個(gè)視圖背景顏色
-(void)toggleLeft { [self.swipeController showLeft]; } -(void)toggleRight { [self.swipeController showRight]; }
RNSwipeViewController有一個(gè)協(xié)議方法,可以監(jiān)聽(tīng)當(dāng)前視圖顯示百分比(0~100)
RNSwipeViewController have a protocol method, can monitor the current view shows percentage (0 ~ 100)
#import <UIKit/UIKit.h> #import "RNRevealViewControllerProtocol.h" @interface LeftViewController : UIViewController<RNRevealViewControllerProtocol> @end
協(xié)議方法,當(dāng)左側(cè)視圖完全顯示時(shí)彈出一個(gè)alertView
-(void)changedPercentReveal:(NSInteger)percent { if (percent == 100) { UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"提示" message:@"這是一個(gè)測(cè)試" delegate:self cancelButtonTitle:@"OK" otherButtonTitles: nil]; [alert show ]; } }
×××地址:https://github.com/XFZLDXF/XFSwipeView.git
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。