音效素材网提供各类素材,打造精品素材网站!

站内导航 站长工具 投稿中心 手机访问

音效素材

iOS应用中使用Toolbar工具栏方式切换视图的方法详解
日期:2016-04-21 09:41:47   来源:脚本之家

关于UIToolbar
ToolBar工具栏是视图View的属性,可以在工具栏上添加工具栏按钮Bar Button Item(可以是自定义的Custom、也可以是系统自带的BarButtonSystemItem ),视图控制器可以通过工具栏项对视图中内容进行操作。

注意事项:
在导航栏控制器中会有一个UIToolBar实例,但默认是隐藏的,如果需要显示,需要通过这个方法将其打开:

201642193049007.png (766×89)

在这里需要注意的是,与UINavigationBar类似,导航控制器拥有且只拥有一个UIToolBar实例,但UIToolBar拥有的UIBarButtonItem实例,是由视图控制器进行管理的,如下所示:

201642193128090.png (757×159)

工具栏风格:

typedef NS_ENUM(NSInteger, UIBarStyle) {
  UIBarStyleDefault     = 0,    //默认风格,蓝色文字
  UIBarStyleBlack      = 1,    //黑色背景,褐色文字
  UIBarStyleBlackOpaque   = 1,  // 纯黑色背景,白色文字
  UIBarStyleBlackTranslucent = 2,  // 透明黑色背景,白色文字
};

属性:

@property(nonatomic)    UIBarStyle barStyle;  //工具栏风格,默认为蓝色
@property(nonatomic,copy)  NSArray  *items;   //工具栏中的按钮单元,UIBarButtonItem
@property(nonatomic,assign,getter=isTranslucent) BOOL translucent //是否透明
@property(nonatomic,retain) UIColor *tintColor;    //按钮颜色
@property(nonatomic,retain) UIColor *barTintColor; //工具栏颜色

方法:
※设置工具栏中的按钮单元

- (void)setItems:(NSArray *)items animated:(BOOL)animated; 

※设置工具栏的背景图像

复制代码 代码如下:

- (void)setBackgroundImage:(UIImage *)backgroundImage forToolbarPosition:(UIBarPosition)topOrBottom barMetrics:(UIBarMetrics)barMetrics;

※获取工具栏的背景图像

复制代码 代码如下:

- (UIImage *)backgroundImageForToolbarPosition:(UIBarPosition)topOrBottom barMetrics:(UIBarMetrics)barMetrics;


※设置工具栏的阴影图像

复制代码 代码如下:

- (void)setShadowImage:(UIImage *)shadowImage forToolbarPosition:(UIBarPosition)topOrBottom;


 ※获取工具栏的阴影图像

复制代码 代码如下:

- (UIImage *)shadowImageForToolbarPosition:(UIBarPosition)topOrBottom ;

Tool Bar方式切换视图
1、创建工程:
运行Xcode,新建一个Empty Application,名称为MultiView,其他设置如下图:

201642193318520.png (517×221)

2、创建3个View Controller:
依次选择File — New — New File,打开如下窗口:

201642193334536.png (734×494)

找到UIViewController subclass并单击Next,打开下面的窗口:

201642193358623.png (594×321)

输入名称RootViewController,并且保证Subclass of选择UIViewController,下面的两个选框都不选;按照同样的步骤新建两个View Controller,名称分别是FirstViewController和SecondViewController。建好后,在Project Navigation中显示文件如下:

201642193415059.png (263×271)

3、为三个View Controller创建.xib文件:
依次选择File — New — New File,打开如下窗口:

201642193435862.png (733×494)

在左边选User Interface,右边选View,单击Next,在新窗口中的Device Family中选择iPhone,单击Next,打开如下窗口:

201642193455889.png (429×311)

输入名称RootView,单击Create,创建了一个.xib文件。用同样的方法再创建两个.xib,名称分别是FirstView和SecondView。
4、修改App Delegate:
4.1 单击AppDelegate.h,在其中添加代码,在@interface之前添加@class RootViewController;在@end之前添加@property (strong, nonatomic) RootViewController *rootViewController;添加之后的代码如下:

#import <UIKit/UIKit.h>
@class RootViewController;
@interface AppDelegate : UIResponder <UIApplicationDelegate>
@property (strong, nonatomic) UIWindow *window;
@property (strong, nonatomic) RootViewController *rootViewController;
@end

4.2 单击AppDelegate.m,修改其代码。在@implementation之前添加#import "RootViewController.h",在@implementation之后添加@synthesize rootViewController;然后修改didFinishLaunchingWithOptions方法如下:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
  // Override point for customization after application launch.
  self.rootViewController = [[RootViewController alloc] initWithNibName:@"RootView" bundle:nil]; 
  UIView *rootView = self.rootViewController.view; 
  CGRect rootViewFrame = rootView.frame; 
  rootViewFrame.origin.y += [UIApplication sharedApplication].statusBarFrame.size.height; 
  rootView.frame = rootViewFrame; 
  [self.window addSubview:rootView]; 
  self.window.backgroundColor = [UIColor whiteColor];
  [self.window makeKeyAndVisible];
  return YES;
}

复制代码 代码如下:
self.rootViewController = [[RootViewController alloc] initWithNibName:@"RootView" bundle:nil];

这行代码用于从RootView.xib文件中初始化rootViewController,注意initWithNibName:@"RootView"中不要后缀名.xib
② 
复制代码 代码如下:
rootViewFrame.origin.y += [UIApplication sharedApplication].statusBarFrame.size.height;

使得RootViewController的视图不会被状态栏挡住
5、修改RootViewController.h:
单击RootViewController.h,在其中添加两个属性和一个方法,如下:

#import <UIKit/UIKit.h>
@class FirstViewController;
@class SecondViewController;
@interface RootViewController : UIViewController
@property (strong, nonatomic) FirstViewController *firstViewController;
@property (strong, nonatomic) SecondViewController *secondViewController;
- (IBAction)switchViews:(id)sender;
@end

6、打开RootView.xib,在坐边选择File's Owner,在右边打开Identity Inspector,在Class下拉菜单选择RootViewController:

这样,我们201642193602292.png (714×197)就可以从RootView.xib文件向RootViewController创建Outlet和Action了。
7、为RootView.xib添加工具栏:打开RootView.xib,拖一个Tool Bar到视图上,双击Tool Bar上的按钮,修改其名称为Switch Views:

201642193620664.png (421×229)

8、添加Action映射:
选中Switch Views按钮,按住Control,拖到File's Owner,松开鼠标后选择switchViews方法:

201642193655682.png (269×202)

9、选择File's Owner,按住Control键,拖到View,松开鼠标,选择view:

201642193709607.png (235×193)

10、修改RootViewController.m:
打开RootViewController.m文件,在@implementation之前添加代码:

#import "FirstViewController.h"
#import "SecondViewController.h"

在@implementation之后添加代码:

@synthesize firstViewController;
@synthesize secondViewController;

接下来修改viewDidLoad方法,这个方法默认是被注释掉的,先去掉其周围的注释符,然后修改其代码如下:

- (void)viewDidLoad
{
  self.firstViewController = [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil];
  [self.view insertSubview: firstViewController.view atIndex:0];
  [super viewDidLoad];
}

添加switchViews方法:

- (IBAction)switchViews:(id)sender {
  if (self.secondViewController.view.superview == nil) {
    if (self.secondViewController == nil) { 
      self.secondViewController = [[SecondViewController alloc] initWithNibName:@"SecondView" bundle:nil]; 
    } 
    [firstViewController.view removeFromSuperview]; 
    [self.view insertSubview:self.secondViewController.view atIndex:0]; 
  } else {
    if (self.firstViewController == nil) { 
      self.firstViewController = 
      [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil]; 
    } 
    [secondViewController.view removeFromSuperview]; 
    [self.view insertSubview:self.firstViewController.view atIndex:0]; 
  } 
}

修改didReceiveMemoryWarning方法:

- (void)didReceiveMemoryWarning
{
  [super didReceiveMemoryWarning];
  if (self.firstViewController.view.superview == nil) { 
    self.firstViewController = nil; 
  } else { 
    self.secondViewController = nil; 
  } 
}

11、打开FirstView.xib文件,选择左边的File's Owner,然后在Identity Inspector中选择Class为FirstViewController;然后按住Control键从File's Owner图标拖到View,在弹出的菜单选择view。为SecondView.xib进行同样的操作,不过Class选择为SecondViewController。
12、打开FirstView.xib文件,选择View,打开Attribute Inspector,进行如下设置:

201642193814931.png (900×468)

对SecondView.xib进行同样设置,不过背景颜色设成红色。
13、此时运行程序,你会看见刚启动的时候,程序显示的绿色背景,轻触Switch Views按钮后,背景变成了红色。不断轻触按钮,背景不断变换。
14、添加切换背景的动画效果:
打开RootViewController.m,修改其中的switchViews方法如下:

- (IBAction)switchViews:(id)sender { 
  [UIView beginAnimations:@"View Flip" context:nil]; 
  [UIView setAnimationDuration:1.25]; 
  [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
  if (self.secondViewController.view.superview == nil) { 
    if (self.secondViewController == nil) { 
      self.secondViewController = [[SecondViewController alloc] initWithNibName:@"SecondView" bundle:nil]; 
    } 
    [UIView setAnimationTransition: UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES]; 
    [self.firstViewController.view removeFromSuperview]; 
    [self.view insertSubview:self.secondViewController.view atIndex:0]; 
  } else { 
    if (self.firstViewController == nil) { 
      self.firstViewController = [[FirstViewController alloc] initWithNibName:@"FirstView" bundle:nil]; 
    } 
    [UIView setAnimationTransition: UIViewAnimationTransitionCurlUp forView:self.view cache:YES]; 
    [self.secondViewController.view removeFromSuperview]; 
    [self.view insertSubview:self.firstViewController.view atIndex:0]; 
  } 
  [UIView commitAnimations]; 
}

注意四个表示切换效果的常量:

UIViewAnimationTransitionFlipFromLeft
UIViewAnimationTransitionFlipFromRight
UIViewAnimationTransitionCurlDown
UIViewAnimationTransitionCurlUp

分别表示从左翻转、从右翻转、向下卷、向上卷。
运行后翻页效果如下:

201642193904648.png (350×500)201642193920985.png (350×500)

    您感兴趣的教程

    在docker中安装mysql详解

    本篇文章主要介绍了在docker中安装mysql详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编...

    详解 安装 docker mysql

    win10中文输入法仅在桌面显示怎么办?

    win10中文输入法仅在桌面显示怎么办?

    win10系统使用搜狗,QQ输入法只有在显示桌面的时候才出来,在使用其他程序输入框里面却只能输入字母数字,win10中...

    win10 中文输入法

    一分钟掌握linux系统目录结构

    这篇文章主要介绍了linux系统目录结构,通过结构图和多张表格了解linux系统目录结构,感兴趣的小伙伴们可以参考一...

    结构 目录 系统 linux

    PHP程序员玩转Linux系列 Linux和Windows安装

    这篇文章主要为大家详细介绍了PHP程序员玩转Linux系列文章,Linux和Windows安装nginx教程,具有一定的参考价值,感兴趣...

    玩转 程序员 安装 系列 PHP

    win10怎么安装杜比音效Doby V4.1 win10安装杜

    第四代杜比®家庭影院®技术包含了一整套协同工作的技术,让PC 发出清晰的环绕声同时第四代杜比家庭影院技术...

    win10杜比音效

    纯CSS实现iOS风格打开关闭选择框功能

    这篇文章主要介绍了纯CSS实现iOS风格打开关闭选择框,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作...

    css ios c

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的办法

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的

    Win7给电脑C盘扩容的办法大家知道吗?当系统分区C盘空间不足时,就需要给它扩容了,如果不管,C盘没有足够的空间...

    Win7 C盘 扩容

    百度推广竞品词的投放策略

    SEM是基于关键词搜索的营销活动。作为推广人员,我们所做的工作,就是打理成千上万的关键词,关注它们的质量度...

    百度推广 竞品词

    Visual Studio Code(vscode) git的使用教程

    这篇文章主要介绍了详解Visual Studio Code(vscode) git的使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。...

    教程 Studio Visual Code git

    七牛云储存创始人分享七牛的创立故事与

    这篇文章主要介绍了七牛云储存创始人分享七牛的创立故事与对Go语言的应用,七牛选用Go语言这门新兴的编程语言进行...

    七牛 Go语言

    Win10预览版Mobile 10547即将发布 9月19日上午

    微软副总裁Gabriel Aul的Twitter透露了 Win10 Mobile预览版10536即将发布,他表示该版本已进入内部慢速版阶段,发布时间目...

    Win10 预览版

    HTML标签meta总结,HTML5 head meta 属性整理

    移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析HTML代码,更好地将移动web前端页面表现出来...

    移动端html5模拟长按事件的实现方法

    这篇文章主要介绍了移动端html5模拟长按事件的实现方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家...

    移动端 html5 长按

    HTML常用meta大全(推荐)

    这篇文章主要介绍了HTML常用meta大全(推荐),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参...

    cdr怎么把图片转换成位图? cdr图片转换为位图的教程

    cdr怎么把图片转换成位图? cdr图片转换为

    cdr怎么把图片转换成位图?cdr中插入的图片想要转换成位图,该怎么转换呢?下面我们就来看看cdr图片转换为位图的...

    cdr 图片 位图

    win10系统怎么录屏?win10系统自带录屏详细教程

    win10系统怎么录屏?win10系统自带录屏详细

    当我们是使用win10系统的时候,想要录制电脑上的画面,这时候有人会想到下个第三方软件,其实可以用电脑上的自带...

    win10 系统自带录屏 详细教程

    + 更多教程 +
    Windows系统Linux系统苹果MACAndroidiOS系统鸿蒙系统