这篇指南将教你如何用Core Data为Pomotion计时器添加Persistence,关于这点,可以参考我之前所写的《RubyMotion新手指南( RubyMotion Tutorial for Beginners )》系列。
如果熟悉RubyMotion,建议从GitHub储存库( The GitHub Repository )下载完整代码,跟着练练手; 如果还是新手,建议先去读前两篇指南入门,再来读这一篇。
为确保 达到预期的指导效果,读者最好满足以下条件:
当然,如果用过 Core Data或ActiveRecord就更好了,但并不是硬性条件。
首先从 之前的系列指南 或 GitHub 上下载最终方案(final project):
打开 Terminal,转到根目录,运行以下命令,确保App创建成功:
rake device_name="iPhone 4s"
注意 :RubyMotion 3为rake命令新添了 device_name
,以区分运行app的不同设备模拟器。我个人倾向于iPhone 4s模拟器,因为它尺寸更小,屏幕内容一目了然。
如果屏幕显示如下,那就对了——如果不是,那就问问自己是否完全遵照了安装指南和之前 Pomotion指南中的所有步骤。
开始的屏幕显示是这样的。
然后运行 Pomotion后,准备工作就做好了。
依赖项( Dependency)更新: 很久没用过 RubyMotion的需要更新一些gems。具体来说是bundler gem,在Terminal里运行以下命令即可: gem update bundler
。
此外,可能会出现 Bundler::GemNotFound: Couldn ’ t find sass-3.4.2 in any of the sources 这种错误。要解决这个问题就用 gem install sass -v 3.4.2
来安装 Sass v3.4.2。
为 Pomotion计时器添加任务列表,相当于用户的每日待办事项列表,可以添加、删除或选择当前任务。 当用户点下导航栏上的按钮时,就能打开任务列表,所以先从添加任务按钮开始。
挑一个用得最顺手的文本编辑器,打开 app/controllers/main_view_controller.rb ,在 timer_button
定义方法( method definition)下添加以下代码:
def tasks_button @tasks_button ||= UIBarButtonItem.alloc.initWithImage(tasks_image, style: UIBarButtonItemStylePlain, target: self, action: nil) end def tasks_image @tasks_image ||= UIImage.imageNamed('todo.png') end
这样就在 MainViewController 类上定义了两个属性:一个命名为 tasks_button
的 UIBarButtonItem ,另一个命名为 tasks_image
的 UIImage 。
改动过后,运行之前,需要为 App资源添加 tasks_image 方法引用过的图片文件。
下载 图片文件 ,保存在 App的 resources 目录下,命名为 todo.png 。
还是在 app/controllers/main_view_controller.rb 上,在 tasks_image
方法下面添加下面的方法:
def viewDidLoad super self.title = "Pomotion" self.navigationItem.rightBarButtonItem = tasks_button end
这样就为 MainViewController 导航栏添加了 tasks_button
。还是老方法创建,运行App,看看有什么变化。
rake device_name="iPhone 4s"
进展不错!但A pp的配色是红、白、绿,而蓝色的 tasks_button
看起来有点扎眼,对吧?别担心,小 case!
还记得 Pomotion指南的内容吗?用 PixateFreestyle 为 App外观添加CSS样式(styles),可以在 resources/default.css 文件中找到样式定义( style definition)。
打开 resources/default.css ,为 navigation-bar 选择器添加以下代码:
-ios-tint-color: white;
蓝色导航栏变白了。想了解更多知识,请参阅 Pixate reference 。
保存文件,再次用 rake device_name="iPhone 4s"
创建,运行App,导航栏由蓝色变成了白色。
很简单吧?
试着点下 tasks_button ,啊哦,为啥一点儿反应都没有呢?哦,原来是因为没有定义“点击屏幕即调用”的 action。