欢迎大家加入以下开源社区

Xamarin-Cn:https://github.com/Xamarin-Cn

Mvvmcross-Cn:https://github.com/Mvvmcross-Cn 

(另外微信订阅号 Xamarin 所有者@善友兄也给予了运营权限,后面将开始陆续运营起来,给大家推送相关的文章)

继上节《Xamarin.IOS之快速入门》之后,本节将会在此基础之上具体扩展,主要是增加一个列表可以提供历史拨打电话的记录。下面我们直接进入正题。

首先打开MainStoryboard.storyboard,我们在这个基础之上继续修改。从工具栏中拖放一个Navigation Controller到故事板中,然后我们可以看到如下所示:

但是当前的主视图控制器还是之前的,我们需要将新的设置为主视图,所以我们要将拖放到下面这个视图控制器,然后我们还需要删除Navigation Controller所指向的那个视图控制器,然后按下Ctrl并左击Navigation Controller,进行拖拽,会发现一个蓝色的线条,我们就需要讲这个蓝色线条拖拽到我们上节做的那个视图控制器上,并在弹出的下拉中选择Root,这样就代表这个导航控制器的根视图控制器就是我们上节的那个,进行这番操作的结果如图:

我们可以看到我们的视图控制器上多个了标题栏,我们可以双击它,修改成“Phoneword”。接着我们重新拖拽一个Button到Call按钮下,并且宽度和上一个按钮一样,同时设置该按钮的Name为CallHistoryButton,显示的文字为Call History。完成之后的界面如下所示:

下面我们就需要去完成Call History跳转到的视图控制器,我们先从工具栏中拖拽一个Table View Controller放入到故事板中,然后打开属性窗口修改该视图控制器的Class为“CallHistoryController”并回车确认,这个时候你可以看到vs为我们生成了一个CallHistoryController.cs的文件,然后我们双击进入到然后输入以下代码:

 partial class CallHistoryController : UITableViewController
{
public List<String> PhoneNumbers { get; set; } private static string callHistoryCellId = "CallHistoryCell"; public CallHistoryController (IntPtr handle) : base (handle)
{
//注册UITableViewCell类型并且标识符为callHistoryCallId指定的字符串
TableView.RegisterClassForCellReuse(typeof(UITableViewCell), callHistoryCellId); //为TableView指定数据源
TableView.DataSource = new CallHistoryDataSource(this);
PhoneNumbers = new List<string>();
} private class CallHistoryDataSource : UITableViewDataSource
{
private CallHistoryController mController; public CallHistoryDataSource(CallHistoryController controller)
{
mController = controller;
} public override UITableViewCell GetCell(UITableView tableView, NSIndexPath indexPath)
{
//根据标识符获取表格项
var cell = tableView.DequeueReusableCell(CallHistoryController.callHistoryCellId);
int row = indexPath.Row;
//设置表格项显示的文字
cell.TextLabel.Text = mController.PhoneNumbers[row];
return cell;
} public override nint RowsInSection(UITableView tableView, nint section)
{
//返回数据总数
return this.mController.PhoneNumbers.Count;
}
}
}

完成了CallHistoryController之后,我们回到故事板中按下Ctrl和左击从Call History按钮中拖拽中蓝色线条,放到CallHistoryController中。并在弹出的下拉中选择第一个,这样当我们点击按钮的时候就会实现跳转到那个指定的视图控制器了,下面我们还要修改RootViewController中的代码,以便在拨打的时候记录电话号码,并且在显示CallHistoryController前将记录赋值给PhoneNumbers中。

我们先定义一个保存电话的数组,并在构造函数中初始化:

        public List<String> PhoneNumbers { get; set; }

        public RootViewController(IntPtr handle)
: base(handle)
{
PhoneNumbers = new List<string>();
}

然后在CallButton的TouchUpInside事件中的开头部分增加下面这段代码:

PhoneNumbers.Add(translatedNumber);

最后最关键的部分就是在CallHistoryController打开的之前将记录传递过去,那么我们就需要重写PrepareForSegue方法:

         public override void PrepareForSegue(UIStoryboardSegue segue, NSObject sender)
{
base.PrepareForSegue(segue, sender);
var callHistoryController = segue.DestinationViewController as CallHistoryController;
if(callHistoryController != null)
{
callHistoryController.PhoneNumbers = PhoneNumbers;
}
}

这里我们通过segueDestinationViewController访问将要打开的视图控制器,并且尝试强制转换成CallHistoryController类型,如果是该类型则将记录的数据赋值过去,这样我们就完成了,下面我们可以看到最终的效果图:

点击Call History之后

当然除了可以直接指定按钮打开的视图控制器外,还可以通过代码的方式去指定打开灯视图控制器,前提是我们需要给这些视图控制器设置Storyboard ID,所以我们需要先设置CallHistoryController的属性中的Storyboard ID为“CallHistoryController”,然后注释掉PrepareForSegue方法的代码,并且删掉我们在故事板中为Call History设置的跳转,在ViewDidLoad中新增CallHistoryButton的监听事件,如下所示:

             CallHistoryButton.TouchUpInside += (e, s) =>
{
CallHistoryController callHistory = Storyboard.InstantiateViewController("CallHistoryController") as CallHistoryController;
if(callHistory != null)
{
callHistory.PhoneNumbers = PhoneNumbers;
NavigationController.PushViewController(callHistory, true);
}
};

这里我们通过Storyboard的InstantiateViewController实例化指定的Storyboard ID的视图控制器,并且转换为对应的类型,如果不为null则将数据传递过去,并且通过NavigationController的PushViewContoller呈现这个视图控制器。到此为止我们的开头两篇入门就结束了。

Xamarin.IOS之多视图的更多相关文章

  1. Xamarin iOS教程之视图显示图像

    Xamarin iOS教程之视图显示图像 Xamarin iOS显示图像 在主视图中显示一个图像,可以让开发者的应用程序变的更有趣,例如,在一些应用程序开始运行时,都会通过图像来显示此应用程序的玩法或 ...

  2. Xamarin.ios 重新定位视图

    //旋转手机重新定位视图 /// <summary> /// 重新定位视图 /// </summary> /// <param name="toInterfac ...

  3. Xamarin iOS教程之添加和定制视图

    Xamarin iOS教程之添加和定制视图 Xamarin iOS用户界面——视图 在iPhone或者iPad中,用户看到的摸到的都是视图.视图是用户界面的重要组成元素.例如,想要让用户实现文本输入时 ...

  4. Xamarin iOS教程之警告视图

    Xamarin iOS教程之警告视图 Xamarin iOS警告视图 如果需要向用户显示一条非常重要的消息时,警告视图(UIAlertView类)就可以派上用场了.它的功能是把需要注意的信息显示给用户 ...

  5. Xamarin iOS教程之显示和编辑文本

    Xamarin iOS教程之显示和编辑文本 Xamarin iOS显示和编辑文本 在一个应用程序中,文字是非常重要的.它就是这些不会说话的设备的嘴巴.通过这些文字,可以很清楚的指定这些应用程序要表达的 ...

  6. Xamarin iOS教程之自定义视图

    Xamarin iOS教程之自定义视图 Xamarin iOS自定义视图 工具栏中的视图在实际应用开发中用的很多,但是为了吸引用户的眼球,开发者可以做出一些自定义的视图. [示例2-33]以下将实现一 ...

  7. Xamarin iOS教程之进度条和滚动视图

    Xamarin iOS教程之进度条和滚动视图 Xamarin iOS 进度条 进度条可以看到每一项任务现在的状态.例如在下载的应用程序中有进度条,用户可以很方便的看到当前程序下载了多少,还剩下多少.Q ...

  8. Xamarin.iOS开发初体验

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKwAAAA+CAIAAAA5/WfHAAAJrklEQVR4nO2c/VdTRxrH+wfdU84pW0

  9. 【Xamarin挖墙脚系列:Xamarin.IOS的程序的结构】

    原文:[Xamarin挖墙脚系列:Xamarin.IOS的程序的结构] 开始熟悉Xamarin在开发IOS的结构!!!!!!! 先看官方 这个是以一个单页面的程序进行讲述的. 1 程序引用的程序集,核 ...

随机推荐

  1. textarea格式显示问题

    在 textarea 表单标签中, 当保存有换行的样式时,一般的方法有: 注:这里的info 为要显示的内容: 一.保存后在textarea 表单标签中显示时: info.replace(/\n/g, ...

  2. cvInRangeS函数演示

    camshift算法中,用到了cvInRangeS函数,作为初学者,对这个函数很不理解,所以就写了个程序演示效果,加强理解. 代码: #include "cv.h" #includ ...

  3. 数学对象-Math

    Math 属性: PI        圆周率 例子:var x=Math.xxxx(); sqrt()  一个非负数的平方根    nan pow()   x的y次幂的值      Math.pow( ...

  4. js动态生成二维码图片

    1.html代码 <div id="qrcode" style="width:200px; height:200px;position: fixed;bottom: ...

  5. DOCTYPE的详细图解

    之前有一次写代码的时候忘记写了<!DOCTYPE html> 导致样式的效果一直有点问题,查了很久才发现时候这个的锅.之后自己详细的来查找了DOCTYPE的作用. 在目前,基本上都是采用浏 ...

  6. MvcPager 免费开源分页控件3.0版发布!

    MvcPager 3.0版在原2.0版的基础上进行了较大的升级,对MvcPager脚本插件重写并进行了大量优化.修复了部分bug并新增了客户端Javascript API等功能,使用更方便,功能更强大 ...

  7. webform 之LINQde 简单操作

    LinQ: LinQ to Sql类它是一个集成化的数据访问类,微软将原本需要我们自己动手去编写的一些代码,集成到了这个类中,会自动生成. 数据库数据访问,能大大减少代码量. 那就是代码量减少 EF框 ...

  8. angular之自定义过滤器的使用

    自定义过滤器需要使用filter函数,格式如下: filter("filterName',function(){ return function(target,args){ .... } } ...

  9. webDriver环境搭建与测试

    1.安装jdk 2.安装eclipse 3.安装selenium 由于使用的是开发语言是java,因此需要安装java版的selenium包.下载地址:http://pan.baidu.com/s/1 ...

  10. js 字符串转换成数字(转)

    转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把值转换成浮点数.只有对String类型调用这些方法,这两个函数才能正确运行:对其他类型返回的 ...