AppleWatch开发入门四——Table视图的应用

AppleWatch开发入门四——Table视图的应用

一、Watch上的Table

        WatchOS中的TableView和iOS中的TableView还是有很大的区别,在开发之前,首先我们应该明白WatchOS中的Table有哪些局限性和特点。下面几点是我总结WatchOS中Table的特殊之处:

1、Table只有行的概念,没有分区的概念,没有头尾视图的概念。

2、可以通过创建多个Table,来实现分区的效果。

3、因为Watch上是通过Gruop进行布局适应的,所以没有行高等设置。

4、Table没有代理,所有行的数据都是采用静态配置的方式,后面会介绍。

5、点击Table中的行触发的方法,是通过重写Interface中的方法来实现的。

二、创建一个Table

        在storyBoard中拖入你的Table,如下:

        

在Table上拉两个label:

每一个Table中包含一个TableRowController,实际上我们Table上的控件都是通过这个TableRowController进行管理的,因此如果我们需要在代码中控制TableRow上的内容,我们需要创建一个文件作为Table的TableRowController:

将storyBoard中TableRowController的类修改为我们创建的类并指定一个identifier:

                 

然后,我们将两个label关联到TableRowController中:

?


1

2

3

4

5

6

import WatchKit

class TableRowController: NSObject {

 

    @IBOutlet var numberLabel: WKInterfaceLabel!

    @IBOutlet var titleLabel: WKInterfaceLabel!

}

将Table关联到interfaceController中:

?


1

2

3

4

5

class InterfaceControllerMain: WKInterfaceController {

     

    @IBOutlet var Table: WKInterfaceTable!

 

}

下面,我们开始在interface中对Table做相关配置,首先我们可以先观察一下WKInterfaceTable中有哪些方法和属性:

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

public class WKInterfaceTable : WKInterfaceObject {

    //设置行的类型,数组中对应存放行的类型,数组元素的个数,就是行数

    /*

    通过这个方法,我们可以创建每一行样式都不同的table,行的类型

    实际上就是我们刚才用到的TableRowController,我们可以进行自定义

    */

    public func setRowTypes(rowTypes: [String]) 

    //设置行数和类型 用于创建单一行类型的table

    public func setNumberOfRows(numberOfRows: Int, withRowType rowType: String) // repeating row name

    //这个get方法获取行数,用于我们遍历table中的行,进行内容设置

    public var numberOfRows: Int { get }

    //这个方法会返回某一行,我们可以获取到后进行内容设置

    public func rowControllerAtIndex(index: Int) -> AnyObject?

    //插入一行

    public func insertRowsAtIndexes(rows: NSIndexSet, withRowType rowType: String)

    //删除一行

    public func removeRowsAtIndexes(rows: NSIndexSet)

    //滑动到某一行

    public func scrollToRowAtIndex(index: Int)

}

了解了上面的方法,可以看出,WatchOS的Table配置非常简单易用,例如我们如下配置:

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

@IBOutlet var Table: WKInterfaceTable!

 

    override func awakeWithContext(context: AnyObject?) {

        super.awakeWithContext(context)

        let dic:Dictionary<String,String> = ["中国建设银行":"¥1000","中国农业银行":"¥5000","中国银行":"20000","招商银行":"¥401","中国邮政储蓄":"1100"]

        //设置行数与类型

        Table.setNumberOfRows(dic.count, withRowType: "TableRowController")

        //遍历进行设置

        let titleArray:Array<String> = Array(dic.keys)

        for var i=0 ; i < dic.count ; i++ {

            let row:TableRowController = Table.rowControllerAtIndex(i) as! TableRowController

            row.titleLabel.setText(titleArray[i])

            row.numberLabel.setText(dic[titleArray[i]])

            row.numberLabel.setTextColor(UIColor.grayColor())

        }

        // Configure interface objects here.

    }

这样一个展示银行卡余额的界面我们就创建完成了,效果如下:

三、关于Table的点击事件

        上面我们提到,Table没有所谓代理方法,点击row的时候,我们也是通过两种方式进行逻辑跳转的,一种是在storyBoard中,我们通过拉线跳转,这时如需传值,我们需在interface中实现如下方法:

?


1

 public func contextForSegueWithIdentifier(segueIdentifier: String, inTable table: WKInterfaceTable, rowIndex: Int) -> AnyObject?

        另一种方式,我们可以重写实现InterfaceController中的如下方法,来处理Table的点击事件:

?


1

public func table(table: WKInterfaceTable, didSelectRowAtIndex rowIndex: Int)

        无论哪种方式,我们都可以通过参数table和rowIndex来确认点击的具体是那个table和哪一行,进行传值和处理我们的逻辑。             

时间: 2024-11-29 18:29:02

AppleWatch开发入门四——Table视图的应用的相关文章

AppleWatch开发入门二——界面布局

AppleWatch开发入门二--界面布局 一.简介         在iphone开发中,最基本的布局方式是通过frame,将控件的位置和大小固定在屏幕上,后来,由于手机屏幕的尺寸有了略微变化,有了autoresizing的布局框架,我们可以设置子视图随父视图的改变做一些相应的变化,再后来,iphone的尺寸与分辨率也越来越多,适配各个屏幕也成为了iOS开发者遇到的新的问题,幸运的是,autolayout机制的出现,大大减小了开发者在适配方面的成本.以上提到的两种布局方式,在以前博客中有讨论:

AppleWatch开发入门七——watchOS中通知的应用

AppleWatch开发入门七--watchOS中通知的应用 一.引言         在iOS系统中,支持的通知有两种类型:本地通知和远程通知.本地通知多用于计时类通知,远程的又称推送,多用于一些提示动态的提示信息.这里有相关通知的一些知识总结: 本地推送:http://my.oschina.net/u/2340880/blog/405491. 远程推送:http://my.oschina.net/u/2340880/blog/413584.         在watch中,通知是和iphon

AppleWatch开发入门五——菜单控件的使用

AppleWatch开发入门五--菜单控件的使用 一.简介         菜单也是WatchOS中一个重要的交互方式,限于Watch的屏幕尺寸,若将所有用户交互控件都紧密的排列进展示的UI中,那样难免会使用户操作困难,也会影响界面布局的简洁美观.因此,WatchOS的菜单机制是一层覆盖在屏幕上的交互界面,有如下的特点: 1.菜单是内置于InterfaceController中的,不需显式处理,只需对齐菜单项进行添加设置. 2.菜单最多可以容乃四个选项按钮. 3.通过重按可以呼出和隐藏菜单. 二

AppleWatch开发入门九——Watch帧动画的实现

AppleWatch开发入门九--Watch帧动画的实现         动画一直是iOS系统的一大亮点,CoreAnimation和粒子效果的支持,开发者可以很容易的做出效果炫酷的动画特效.在watchOS中,由于性能和屏幕尺寸的限制,对于动画,并没有强大的框架支持,但是这并不是说开发者就没办法在watch上添加动画的特效了.在watchOS中唯一可以让开发者用于动画操作的就是帧动画.         和iOS类似,watchOS中的真动画也是通过UIImage对象的合集来展示的.只是设置和用

AppleWatch开发入门三——代码交互与控制器生命周期

AppleWatch开发入门三--代码交互与控制器生命周期 一.引言         在前两篇博客中,讨论了关于watch开发中框架与界面布局相关,然而主要的逻辑,终究还是要通过代码来实现的,在我们创建了项目之后,就会生成InterfaceController这个文件,它就是我们storyBoard中的入口视图控制器. 二.代码交互与控制器声明周期         storyBoard中的控件我们可以通过拖拽的方式关联到文件中,Action和Outlet两种关联方式基本可以达到我们修改控件和处理

Windows 8风格应用开发入门 七 页面视图概览

Windows 8风格应用中包含哪些视图 常用的几种视图包括: 开发入门 七 页面视图概览-页面视图"> 1. FullScreenLandscape(水平方向全屏视图) 2. Filled(填充视图) 3. Snap view(贴靠视图) 4. FullScreenPortrait(竖直方向全屏视图) 最小视图状态分辨率支持1024*768,全屏视图状态分辨率为1366*768以上. 注意:实现贴靠视图的最小分辨率为1366*768. Visual Studio 2012和模拟器中如何开

iOS开发入门:iOS视图生命周期与视图控制器关系

iOS中视图是一个应用的重要组成部分,功能的实现与其息息相关,而视图控制器控制着视图,其重要性在整个应用中不言而喻. 视图生命周期与视图控制器关系 以视图的5种状态为基础,我们来系统的了解一下视图控制器的生命周期.在视图不同的生命周期,视图控制器会回调不同的方法. 开发入门:iOS视图生命周期与视图控制器关系-"> viewDidLoad方法:视图控制器已被实例化,在视图被加载到内存中的时候调用该方法,这个时候视图并未出现.在该方法中通常进行的是对所控制的视图进行初始化处理. 视 图可见前

AppleWatch开发入门一——Watch的开发思路与应用框架

AppleWatch开发入门一--Watch的开发思路与应用框架 一.引言         Apple Watch无疑是apple在智能手表领域的一次革命,如何在Watch上开发出实用且具有美感的应用,是iOS开发者们开始思考的一个问题,由于watch的随身性和快捷性,在某些方面,它有比iphone更加大的优势,要抓住watch的这些特点,开发出淋漓尽致的应用,就需要改变一些在iphone开发的思路,正如一句话:只有忘掉经验,才会有意想不到的突破.         这一系列博客,首先是总结我在公

AppleWatch开发入门六——Glance(预览)扩展的应用

AppleWatch开发入门六--Glance(预览)扩展的应用 一.简介         Glance是watchOS中类似iOS的today插件一样的预览扩展.提供了Glance功能的WatchApp可以在手表主页上唤起Glance,展示app相关信息,然而这个扩展只能作为展示作用,并不能进行太多的交互,界面的布局也有很大的限制,因此,Glance的应用主要在于展示备忘信息等.特点如下: 1.扩展的样式布局我们并不能完全个性化,只能通过系统模板来布局. 2.扩展中不能添加交互功能,只能展示信