iOS的UI開發(fā)中Modal的使用與主流應(yīng)用UI結(jié)構(gòu)介紹
Modal簡單介紹
一、簡單介紹
除了push之外,還有另外一種控制器的切換方式,那就是Modal
任何控制器都能通過Modal的形式展⽰出來
Modal的默認效果:新控制器從屏幕的最底部往上鉆,直到蓋住之前的控制器為⽌
二、代碼說明
新建一個項目,在Application的代理中添加window和控制器。
YYAppDelegate.m文件
//
// YYAppDelegate.m
// 01-modal
//
// Created by apple on 14-6-9.
// Copyright (c) 2014年 itcase. All rights reserved.
//
#import "YYAppDelegate.h"
#import "YYViewController.h"
@implementation YYAppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
//1.創(chuàng)建window,并設(shè)置window的frame
self.window=[[UIWindow alloc]initWithFrame:[[UIScreen mainScreen] bounds]];
//2.設(shè)置window的背景顏色為黑色
self.window.backgroundColor=[UIColor blackColor];
//創(chuàng)建一個導(dǎo)航控制器作為子控制器
YYViewController *one=[[YYViewController alloc]init];
self.window.rootViewController=one;
//3.設(shè)置window為主窗口,并顯示
[self.window makeKeyAndVisible];
return YES;
}
@end
打開modal窗口
YYViewController.m文件
//
// YYViewController.m
// 01-modal
//
// Created by apple on 14-6-9.
// Copyright (c) 2014年 itcase. All rights reserved.
//
#import "YYViewController.h"
#import "YYtwoViewController.h"
@interface YYViewController ()
//當點擊的時候,跳轉(zhuǎn)到第二個界面
- (IBAction)jump2two:(UIButton *)sender;
@end
@implementation YYViewController
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view from its nib.
}
- (IBAction)jump2two:(UIButton *)sender {
//創(chuàng)建一個新的modal并彈出
YYtwoViewController *two=[[YYtwoViewController alloc]init];
//在two上用導(dǎo)航控制器包裝,讓彈出的模態(tài)窗口有一個導(dǎo)航欄可以放返回按鈕
UINavigationController *nvc=[[UINavigationController alloc]initWithRootViewController:two
];
[self presentViewController:nvc animated:YES completion:^{
NSLog(@"彈出一個模態(tài)窗口");
}];
}
@end
移除modal視圖
YYtwoViewController.m文件
//
// YYtwoViewController.m
// 01-modal
//
// Created by apple on 14-6-9.
// Copyright (c) 2014年 itcase. All rights reserved.
//
#import "YYtwoViewController.h"
@interface YYtwoViewController ()
@end
@implementation YYtwoViewController
- (void)viewDidLoad
{
[super viewDidLoad];
//給導(dǎo)航條添加一個返回按鈕
self.navigationItem.leftBarButtonItem=[[UIBarButtonItem alloc]initWithTitle:@"返回" style:UIBarButtonItemStylePlain target:self action:@selector(change)];
}
-(void)change
{
//編寫點擊返回按鈕的點擊事件
//點擊返回按鈕,移除當前模態(tài)窗口
// [self.navigationController dismissViewControllerAnimated:YES completion:^{
// NSLog(@"移除模態(tài)窗口");
// }];
// 如果一個控制器是以模態(tài)的形式展現(xiàn)出來的, 可以調(diào)用該控制器以及該控制器的子控制器讓讓控制器消失
[self dismissViewControllerAnimated:YES completion:^{
NSLog(@"移除");
}];
}
@end
三、注意點
(1)modal的特點:當modal窗口彈出(從下往上)的時候,后面的視圖不可點
(2)彈出控制器的視圖(通過這種方式只能彈出一個視圖)
//創(chuàng)建一個新的modal并彈出
YYtwoViewController *two=[[YYtwoViewController alloc]init];
//在two上用導(dǎo)航控制器包裝,讓彈出的模態(tài)窗口有一個導(dǎo)航欄可以放返回按鈕
UINavigationController *nvc=[[UINavigationController alloc]initWithRootViewController:two
];
[self presentViewController:nvc animated:YES completion:^{
NSLog(@"彈出一個模態(tài)窗口");
}];
(3)移除控制器的視圖(兩種方式都可以)
//編寫點擊返回按鈕的點擊事件
//點擊返回按鈕,移除當前模態(tài)窗口
// [self.navigationController dismissViewControllerAnimated:YES completion:^{
// NSLog(@"移除模態(tài)窗口");
// }];
// 如果一個控制器是以模態(tài)的形式展現(xiàn)出來的, 可以調(diào)用該控制器以及該控制器的子控制器讓讓控制器消失
[self dismissViewControllerAnimated:YES completion:^{
NSLog(@"移除");
}];
4)提示在實際的開發(fā)中,如果控制器之間的關(guān)系緊密一般用導(dǎo)航控制器,如果控制器之間的關(guān)系不是很緊密就用modal
四、內(nèi)部機制
(1)彈出之后,window上面只有一個子視圖。
(2)雖然當前界面上展示在我們眼前的時twoview,但是window的根控制器仍然是NJviewController,它并沒有切換window的根控制器,而僅僅只是換了window上面顯示的視圖。
(3)移除的視圖并沒有銷毀,因為控制器并沒有銷毀,所以控制器對應(yīng)的view也沒有銷毀。
(4)在模態(tài)彈出(完全顯示后),在方法中傳入two作為參數(shù),默認就有一個控制器強引用著它。
(5)當向下移除之后,只要調(diào)用了控制器的dismiss方法讓窗口關(guān)閉,modal就釋放了。
(6)通常彈出的模態(tài)窗口都會提供一個導(dǎo)航條,讓界面擁有導(dǎo)航條的最快的方式是給它包裝一個導(dǎo)航控制器。
(7)如果一個控制器是以模態(tài)的形式展現(xiàn)出來的??梢哉{(diào)用該控制器以及該控制器的子控制器,讓該控制器消失。
五、數(shù)據(jù)的傳遞
項目文件結(jié)構(gòu)和storyboard
代碼示例:
YYViewController.m文件
//
// YYViewController.m
// 02-模態(tài)窗口的數(shù)據(jù)傳遞
//
// Created by apple on 14-6-9.
// Copyright (c) 2014年 itcase. All rights reserved.
//
#import "YYViewController.h"
#import "YYtwoViewController.h"
@interface YYViewController ()
@end
@implementation YYViewController
- (void)viewDidLoad
{
[super viewDidLoad];
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
}
/*
如果控制器之間的關(guān)系比較緊密一般用 UINavigationController
如果控制器之間的關(guān)系不是很緊密可以用Modal
*/
//通過segue跳轉(zhuǎn)前,會調(diào)用這個方法,在這個方法中把數(shù)據(jù)傳遞給彈出來的模態(tài)窗口
-(void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender
{
//拿到目標控制器
UINavigationController *nav=segue.destinationViewController;
YYtwoViewController *two=(YYtwoViewController *)nav.topViewController;
//傳遞數(shù)據(jù)
two.name=@"文頂頂";
}
@end
YYtwoViewController.h文件
//
// YYtwoViewController.h
// 02-模態(tài)窗口的數(shù)據(jù)傳遞
//
// Created by apple on 14-6-9.
// Copyright (c) 2014年 itcase. All rights reserved.
//
#import <UIKit/UIKit.h>
@interface YYtwoViewController : UIViewController
@property(nonatomic,copy)NSString *name;
@end
YYtwoViewController.m文件
//
// YYtwoViewController.m
// 02-模態(tài)窗口的數(shù)據(jù)傳遞
//
// Created by apple on 14-6-9.
// Copyright (c) 2014年 itcase. All rights reserved.
//
#import "YYtwoViewController.h"
@interface YYtwoViewController ()
@property (weak, nonatomic) IBOutlet UILabel *nametext;
@end
@implementation YYtwoViewController
- (void)viewDidLoad
{
[super viewDidLoad];
self.nametext.text=self.name;
//為導(dǎo)航欄添加一個返回按鈕
self.navigationItem.leftBarButtonItem=[[UIBarButtonItem alloc]initWithTitle:@"返回" style:UIBarButtonItemStylePlain target:self action:@selector(black)];
}
-(void)black
{
//移除模態(tài)窗口
[self dismissViewControllerAnimated:YES completion:^{
NSLog(@"成功移除!");
}];
}
@end
APP主流UI框架結(jié)構(gòu)
一、簡單示例
說明:使用APP主流UI框架結(jié)構(gòu)完成簡單的界面搭建
搭建頁面效果:
二、搭建過程和注意點
1.新建一個項目,把原有的控制器刪除,添加UITabBarController控制器作為管理控制器
2.對照界面完成搭建
3.注意點:
(1)隱藏工具條:配置一個屬性,Hideabotton bar在push的時候隱藏底部的bar在那個界面隱藏,就在哪個界面設(shè)置。
(2).cell可以設(shè)置行高
(3)連線
(4)說明:在上面的頁面搭建中直接使用了靜態(tài)單元格,但在實際開發(fā)中,通常不這么做。
(5)在tableview中添加headerview(顯示一根藍線)
三、 APP主流UI框架結(jié)構(gòu)
請問:UITabBarController和導(dǎo)航控制器的在結(jié)構(gòu)中的位置能否互調(diào)?(一個導(dǎo)航條)
設(shè)置控制器關(guān)聯(lián)或出現(xiàn)問題,tableviewcontroller默認實現(xiàn)了數(shù)據(jù)源的方法,兩個控制器把它反過來管理。關(guān)于導(dǎo)航條。導(dǎo)航條上顯示什么內(nèi)容由棧頂控制器來確定,下面的導(dǎo)航條只有一個(棧頂控制器就是tabbar控制器)。
補充說明:ios7全屏化的設(shè)計
打印ios7中控制器的層次結(jié)構(gòu):
打印ios6中控制器的層次結(jié)構(gòu):
- iOS開發(fā)中導(dǎo)航控制器的基本使用教程
- 講解iOS開發(fā)中UITableView列表設(shè)計的基本要點
- iOS開發(fā)中使用Picker View實現(xiàn)一個點菜應(yīng)用的UI示例
- iOS開發(fā)中UIImageView控件的常用操作整理
- IOS改變UISearchBar中搜索框的高度
- iOS開發(fā)中使用UILabel設(shè)置字體的相關(guān)技巧小結(jié)
- 詳解iOS應(yīng)用UI開發(fā)中的九宮格坐標計算與字典轉(zhuǎn)換模型
- 解析iOS應(yīng)用的UI開發(fā)中懶加載和xib的簡單使用方法
- iOS開發(fā)中使用UIDynamic來捕捉動畫組件的重力行為
- 詳解iOS開發(fā)中使用storyboard創(chuàng)建導(dǎo)航控制器的方法
相關(guān)文章
IOS 出現(xiàn)錯誤reason: image not found的解決方案
這篇文章主要介紹了IOS 出現(xiàn)錯誤reason: image not found的解決方案的相關(guān)資料,需要的朋友可以參考下2017-05-05iOS仿微博導(dǎo)航欄動畫(CoreGraphics)的實現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于iOS仿微博導(dǎo)航欄動畫(CoreGraphics)的實現(xiàn)方法,文章最后給出了完整的示例代碼,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-07-07iOS開發(fā)項目- 基于WebSocket的聊天通訊(2)
這篇文章主要介紹了iOS開發(fā)項目- 基于WebSocket的聊天通訊,可以實現(xiàn)錄音和音樂播放,有需要的可以了解一下。2016-11-11iOS schem與Universal Link 調(diào)試時踩坑解決記錄
這篇文章主要為大家介紹了iOS schem與Universal Link 調(diào)試時踩坑解決記錄,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-01-01