服务器之家:专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - IOS - iOS应用中使用Toolbar工具栏方式切换视图的方法详解

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

2021-01-16 14:59双子座 IOS

这篇文章主要介绍了iOS应用中使用Toolbar工具栏方式切换视图的方法,文中讲解了UIToolbar的相关编写以及使用xib方式创建可切换视图程序的例子,需要的朋友可以参考下

关于uitoolbar
toolbar工具栏是视图view的属性,可以在工具栏上添加工具栏按钮bar button item(可以是自定义的custom、也可以是系统自带的barbuttonsystemitem ),视图控制器可以通过工具栏项对视图中内容进行操作。

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

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

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

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

 

工具栏风格:

?
1
2
3
4
5
6
typedef ns_enum(nsinteger, uibarstyle) {
  uibarstyledefault     = 0,    //默认风格,蓝色文字
  uibarstyleblack      = 1,    //黑色背景,褐色文字
  uibarstyleblackopaque   = 1,  // 纯黑色背景,白色文字
  uibarstyleblacktranslucent = 2,  // 透明黑色背景,白色文字
};

属性:

?
1
2
3
4
5
@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; //工具栏颜色

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

?
1
- (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,其他设置如下图:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

2、创建3个view controller:
依次选择file — new — new file,打开如下窗口:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

找到uiviewcontroller subclass并单击next,打开下面的窗口:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

输入名称rootviewcontroller,并且保证subclass of选择uiviewcontroller,下面的两个选框都不选;按照同样的步骤新建两个view controller,名称分别是firstviewcontroller和secondviewcontroller。建好后,在project navigation中显示文件如下:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

3、为三个view controller创建.xib文件:
依次选择file — new — new file,打开如下窗口:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

在左边选user interface,右边选view,单击next,在新窗口中的device family中选择iphone,单击next,打开如下窗口:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

输入名称rootview,单击create,创建了一个.xib文件。用同样的方法再创建两个.xib,名称分别是firstview和secondview。
4、修改app delegate:
4.1 单击appdelegate.h,在其中添加代码,在@interface之前添加@class rootviewcontroller;在@end之前添加@property (strong, nonatomic) rootviewcontroller *rootviewcontroller;添加之后的代码如下:

?
1
2
3
4
5
6
#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方法如下:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
- (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,在其中添加两个属性和一个方法,如下:

 

?
1
2
3
4
5
6
7
8
#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:

 

这样,我们iOS应用中使用Toolbar工具栏方式切换视图的方法详解就可以从rootview.xib文件向rootviewcontroller创建outlet和action了。
7、为rootview.xib添加工具栏:打开rootview.xib,拖一个tool bar到视图上,双击tool bar上的按钮,修改其名称为switch views:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

8、添加action映射:
选中switch views按钮,按住control,拖到file's owner,松开鼠标后选择switchviews方法:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

9、选择file's owner,按住control键,拖到view,松开鼠标,选择view:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

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

?
1
2
#import "firstviewcontroller.h"
#import "secondviewcontroller.h"

在@implementation之后添加代码:

?
1
2
@synthesize firstviewcontroller;
@synthesize secondviewcontroller;

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

?
1
2
3
4
5
6
- (void)viewdidload
{
  self.firstviewcontroller = [[firstviewcontroller alloc] initwithnibname:@"firstview" bundle:nil];
  [self.view insertsubview: firstviewcontroller.view atindex:0];
  [super viewdidload];
}

添加switchviews方法:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
- (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方法:

?
1
2
3
4
5
6
7
8
9
- (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,进行如下设置:

iOS应用中使用Toolbar工具栏方式切换视图的方法详解

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

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
- (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];
}

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

?
1
2
3
4
uiviewanimationtransitionflipfromleft
uiviewanimationtransitionflipfromright
uiviewanimationtransitioncurldown
uiviewanimationtransitioncurlup

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

iOS应用中使用Toolbar工具栏方式切换视图的方法详解iOS应用中使用Toolbar工具栏方式切换视图的方法详解

延伸 · 阅读

精彩推荐
  • IOSIOS 屏幕适配方案实现缩放window的示例代码

    IOS 屏幕适配方案实现缩放window的示例代码

    这篇文章主要介绍了IOS 屏幕适配方案实现缩放window的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要...

    xiari5772021-06-01
  • IOSiOS布局渲染之UIView方法的调用时机详解

    iOS布局渲染之UIView方法的调用时机详解

    在你刚开始开发 iOS 应用时,最难避免或者是调试的就是和布局相关的问题,下面这篇文章主要给大家介绍了关于iOS布局渲染之UIView方法调用时机的相关资料...

    windtersharp7642021-05-04
  • IOSIOS开发之字典转字符串的实例详解

    IOS开发之字典转字符串的实例详解

    这篇文章主要介绍了IOS开发之字典转字符串的实例详解的相关资料,希望通过本文能帮助到大家,让大家掌握这样的方法,需要的朋友可以参考下...

    苦练内功5832021-04-01
  • IOSiOS通过逆向理解Block的内存模型

    iOS通过逆向理解Block的内存模型

    自从对 iOS 的逆向初窥门径后,我也经常通过它来分析一些比较大的应用,参考一下这些应用中某些功能的实现。这个探索的过程乐趣多多,不仅能满足自...

    Swiftyper12832021-03-03
  • IOS解析iOS开发中的FirstResponder第一响应对象

    解析iOS开发中的FirstResponder第一响应对象

    这篇文章主要介绍了解析iOS开发中的FirstResponder第一响应对象,包括View的FirstResponder的释放问题,需要的朋友可以参考下...

    一片枫叶4662020-12-25
  • IOSiOS 雷达效果实例详解

    iOS 雷达效果实例详解

    这篇文章主要介绍了iOS 雷达效果实例详解的相关资料,需要的朋友可以参考下...

    SimpleWorld11022021-01-28
  • IOS关于iOS自适应cell行高的那些事儿

    关于iOS自适应cell行高的那些事儿

    这篇文章主要给大家介绍了关于iOS自适应cell行高的那些事儿,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的...

    daisy6092021-05-17
  • IOSiOS中tableview 两级cell的展开与收回的示例代码

    iOS中tableview 两级cell的展开与收回的示例代码

    本篇文章主要介绍了iOS中tableview 两级cell的展开与收回的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...

    J_Kang3862021-04-22