teacup 2.0.6 → 2.1.0

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    teacup (2.0.6)
+    teacup (2.1.0)
 
 GEM
   remote: https://rubygems.org/

data/README.md

@@ -141,6 +141,8 @@ constraints.  Teacup can also integrate with the [motion-layout][] gem!
   * [Style via UIView Class](#style-via-uiview-class)
   * [Importing stylesheets](#importing-stylesheets)
   * [Style via UIAppearance](#style-via-uiappearance) (iOS only)
+* [UITableViews](#uitableviews) - This is important if you are using styles and
+  constraints in a `UITableViewDelegate`.
 * [More Teacup features](#more-teacup-features)
   * [Styling View Properties](#styling-view-properties)
   * [Orientation Styles](#orientation-styles) (iOS only)
@@ -156,7 +158,7 @@ constraints.  Teacup can also integrate with the [motion-layout][] gem!
 * [Showdown](#showdown)
 * [The Nitty Gritty](#the-nitty-gritty)
 * [Advanced Teacup Tricks](#advanced-teacup-tricks)
-  * [UITableViewCell](#uitableviewcell)
+  * [Including `Teacup::Layout` on arbitrary classes](#including-teacup-layout-on-arbitrary-classes)
   * [Sweettea](#sweettea)
 * [Misc notes](#misc-notes)
 * [The Dummy](#the-dummy)
@@ -633,6 +635,49 @@ end
 @label.style(textColor: UIColor.blueColor, text: 'Blue Label')
 ```
 
+UITableViews
+------------
+
+Teacup is designed to be used in coordination with the controller life cycle,
+but there are other life cycles that need to be considered as well.
+UITableViews maintain a "queue" of cells that can be reused, and they need to be
+restyled when the cell is created and re-used.
+
+The solution is to apply the styles and layout constraints inside the
+`tableView:willDisplayCell:forRowAtIndexPath:` delegate method.  In your
+delegate, if you include the `Teacup::TableViewDelegate` module, you'll get this
+behavior for free, and if you override this method, you can call `super` to have
+the Teacup method run.
+
+```ruby
+class TableViewController < UITableViewController
+  include Teacup::TableViewDelegate
+
+  stylesheet :table
+
+  def tableView(table_view, cellForRowAtIndexPath:index_path)
+    cell = table_view.dequeueReusableCellWithIdentifier('cell id')
+
+    layout(cell.contentView, :root) do
+      cell.title_label = subview(UILabel, :title_label, :text => "title #{index_path.row}")
+      cell.details_label = subview(UILabel, :details_label, :text => "details #{index_path.row}")
+      cell.other_label = subview(UILabel, :other_label, :text => "other #{index_path.row}")
+    end
+
+    return cell
+  end
+
+  # This method is implemented by the Teacup::TableViewDelegate.  If you need
+  # to implement it, be sure to call super.
+  # def tableView(tableView, willDisplayCell:cell, forRowAtIndexPath:indexPath)
+  #   super
+  # end
+end
+```
+
+Constraints and styles get applied before the view appears, even if the cell is
+reused later.
+
 More Teacup features
 --------------------
 
@@ -1224,7 +1269,7 @@ More examples!
 
 ```ruby
 class MyController < UIViewController
-  stylyesheet :my_sheet
+  stylesheet :my_sheet
   layout do
     subview(UILabel, :label, text: 'overrides')
   end
@@ -1276,17 +1321,19 @@ not in the context of a `UIViewController` that things get hairy.
 If this is the case, you should get some pretty obvious warning messages,
 something along the lines of `Could not find :superview`.
 
-### UITableViewCell
-
-If you are using your controller as your tableview dataSource this is not a big
-deal, the `subview` and `layout` methods continue to work as you expect them to.
+### Including `Teacup::Layout` on arbitrary classes
 
 I don't know about you, but I often write helper classes for tableviews that
 appear on many screens in an app.  You should not shy away from adding teacup's
 `Layout` module to these helper classes.
 
+If you are using your controller as your table view dataSource, the `subview`
+and `layout` methods continue to work as you expect them to.  This is for the
+case when you are using a helper class.
+
 ```ruby
 class TableHelper
+  include Teacup::TableViewDelegate
   include Teacup::Layout
 
   stylesheet :table_helper

data/app/app_delegate.rb

@@ -6,7 +6,9 @@ class AppDelegate
     application.setStatusBarHidden(true, withAnimation:UIStatusBarAnimationSlide)
 
     @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds)
-    ctlr = MotionLayoutController.new
+    # change this controller to whatever controller you want to test, or are
+    # writing tests for.
+    ctlr = TableViewController.new
     @window.rootViewController = ctlr
     @window.rootViewController.wantsFullScreenLayout = true
     @window.makeKeyAndVisible

data/app/controllers/table_view_controller.rb

@@ -0,0 +1,106 @@
+class TableViewController < UITableViewController
+  include Teacup::TableViewDelegate
+
+  stylesheet :table
+
+  def viewDidLoad
+    self.view.registerClass(CustomCell, forCellReuseIdentifier:'cell id')
+  end
+
+  def numberOfSectionsInTableView(table_view)
+    1
+  end
+
+  def tableView(table_view, numberOfRowsInSection:section)
+    10
+  end
+
+  def tableView(tableView, heightForRowAtIndexPath:index_path)
+    100
+  end
+
+  def tableView(table_view, cellForRowAtIndexPath:index_path)
+    cell = table_view.dequeueReusableCellWithIdentifier('cell id')
+
+    # for testing cell reuse
+    if cell.is_reused.nil?
+      cell.is_reused = false
+    else
+      cell.is_reused ||= true
+    end
+
+    cell.accessoryType = UITableViewCellAccessoryDetailDisclosureButton
+
+    cell.backgroundView = layout(UIView, :bg)
+
+    layout(cell.contentView, :root) do
+      subview(UIView, :padding) do
+        cell.title_label = subview(UILabel, :cell_title_label, :text => "title #{index_path.row}")
+        cell.details_label = subview(UILabel, :cell_details_label, :text => "details #{index_path.row}")
+        cell.other_label = subview(UILabel, :cell_other_label, :text => "other #{index_path.row}")
+      end
+    end
+
+    return cell
+  end
+
+  def tableView(table_view, didSelectRowAtIndexPath:index_path)
+    table_view.deselectRowAtIndexPath(index_path, animated:true)
+  end
+
+  def tableView(tableView, willDisplayCell:cell, forRowAtIndexPath:indexPath)
+    super
+    # one more change, to prove that this method can be overridden
+    cell.title_label.textColor = UIColor.blueColor
+  end
+
+end
+
+
+class CustomCell < UITableViewCell
+  attr_accessor :title_label, :details_label, :other_label, :is_reused
+end
+
+
+Teacup::Stylesheet.new :table do
+  style :bg,
+    backgroundColor: UIColor.colorWithRed(247.0 / 256.0, green:221.0 / 256.0, blue:186.0 / 256.0, alpha:1)
+
+  style :padding,
+   backgroundColor: UIColor.greenColor,
+   constraints: [
+     constrain(:width).equals(:superview, :width).times(0.96),
+     constrain(:height).equals(:superview, :height).times(0.96),
+     constrain(:center_x).equals(:superview, :center_x),
+     constrain(:center_y).equals(:superview, :center_y)
+   ]
+
+  style :cell_title_label,
+    font: UIFont.boldSystemFontOfSize(17),
+    constraints: [
+      constrain_height(20),
+      constrain(:top).equals(:superview, :top),
+      constrain(:width).equals(:superview, :width),
+      constrain(:center_x).equals(:superview, :center_x)
+    ]
+
+  style :cell_details_label,
+      font: UIFont.systemFontOfSize(14),
+      color: UIColor.grayColor,
+      constraints: [
+        constrain_height(17),
+        constrain_below(:cell_title_label, 5),
+        constrain(:width).equals(:superview, :width),
+        constrain(:center_x).equals(:superview, :center_x)
+      ]
+
+  style :cell_other_label,
+      font: UIFont.systemFontOfSize(14),
+      color: UIColor.grayColor,
+      constraints: [
+        constrain_height(17),
+        constrain_below(:cell_details_label, 5),
+        constrain(:width).equals(:superview, :width),
+        constrain(:center_x).equals(:superview, :center_x)
+      ]
+end

data/lib/teacup/version.rb

@@ -1,5 +1,5 @@
 module Teacup
 
-  VERSION = '2.0.6'
+  VERSION = '2.1.0'
 
 end

data/lib/teacup-ios/table_view/table_view_delegate.rb

@@ -0,0 +1,12 @@
+module Teacup
+
+  module TableViewDelegate
+
+    def tableView(tableView, willDisplayCell:cell, forRowAtIndexPath:indexPath)
+      cell.restyle!
+      cell.apply_constraints
+    end
+
+  end
+
+end

data/spec/ios/table_view/table_view_spec.rb

@@ -0,0 +1,93 @@
+describe "TableViewCells" do
+  tests TableViewController
+
+  describe "Style tests on cell[0]" do
+    before do
+      path = NSIndexPath.indexPathWithIndex(0).indexPathByAddingIndex(0)
+      @cell = controller.view.cellForRowAtIndexPath(path)
+      @padding = @cell.contentView.subviews[0]
+    end
+
+    it "should have styled padding" do
+      @padding.backgroundColor.should == UIColor.greenColor
+      @padding.center.x.should == @padding.superview.bounds.size.width / 2
+      @padding.center.y.should == @padding.superview.bounds.size.height / 2
+      @padding.frame.size.width.should < @padding.superview.bounds.size.width
+      @padding.frame.size.height.should < @padding.superview.bounds.size.height
+    end
+
+    it "should have styled title" do
+      @cell.title_label.text.should =~ /^title/
+      @cell.title_label.frame.origin.x.should == 0
+      @cell.title_label.frame.origin.y.should == 0
+      @cell.title_label.frame.size.height.should == 20
+      @cell.title_label.frame.size.width.should == @padding.frame.size.width
+      @cell.title_label.textColor.should == UIColor.blueColor
+    end
+
+    it "should have styled details" do
+      @cell.details_label.text.should =~ /^details/
+      @cell.details_label.frame.origin.x.should == 0
+      @cell.details_label.frame.origin.y.should == CGRectGetMaxY(@cell.title_label.frame) + 5
+      @cell.details_label.frame.size.height.should == 17
+      @cell.details_label.frame.size.width.should == @padding.frame.size.width
+    end
+
+    it "should have styled other" do
+      @cell.other_label.text.should =~ /^other/
+      @cell.other_label.frame.origin.x.should == 0
+      @cell.other_label.frame.origin.y.should == CGRectGetMaxY(@cell.details_label.frame) + 5
+      @cell.other_label.frame.size.height.should == 17
+      @cell.other_label.frame.size.width.should == @padding.frame.size.width
+    end
+
+  end
+
+  describe "Style tests on cell[9]" do
+    before do
+      path = NSIndexPath.indexPathWithIndex(0).indexPathByAddingIndex(9)
+      controller.view.scrollToRowAtIndexPath(path, atScrollPosition:UITableViewScrollPositionBottom, animated:false)
+      @cell = controller.view.cellForRowAtIndexPath(path)
+      @padding = @cell.contentView.subviews[0]
+    end
+
+    it "should be a reused cell" do
+      @cell.is_reused.should == true
+    end
+
+    it "should have styled padding" do
+      @padding.backgroundColor.should == UIColor.greenColor
+      @padding.center.x.should == @padding.superview.bounds.size.width / 2
+      @padding.center.y.should == @padding.superview.bounds.size.height / 2
+      @padding.frame.size.width.should < @padding.superview.bounds.size.width
+      @padding.frame.size.height.should < @padding.superview.bounds.size.height
+    end
+
+    it "should have styled title" do
+      @cell.title_label.text.should =~ /^title/
+      @cell.title_label.frame.origin.x.should == 0
+      @cell.title_label.frame.origin.y.should == 0
+      @cell.title_label.frame.size.height.should == 20
+      @cell.title_label.frame.size.width.should == @padding.frame.size.width
+      @cell.title_label.textColor.should == UIColor.blueColor
+    end
+
+    it "should have styled details" do
+      @cell.details_label.text.should =~ /^details/
+      @cell.details_label.frame.origin.x.should == 0
+      @cell.details_label.frame.origin.y.should == CGRectGetMaxY(@cell.title_label.frame) + 5
+      @cell.details_label.frame.size.height.should == 17
+      @cell.details_label.frame.size.width.should == @padding.frame.size.width
+    end
+
+    it "should have styled other" do
+      @cell.other_label.text.should =~ /^other/
+      @cell.other_label.frame.origin.x.should == 0
+      @cell.other_label.frame.origin.y.should == CGRectGetMaxY(@cell.details_label.frame) + 5
+      @cell.other_label.frame.size.height.should == 17
+      @cell.other_label.frame.size.width.should == @padding.frame.size.width
+    end
+
+  end
+
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: teacup
 version: !ruby/object:Gem::Version
-  version: 2.0.6
+  version: 2.1.0
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-06-26 00:00:00.000000000 Z
+date: 2013-06-28 00:00:00.000000000 Z
 dependencies: []
 description: ! 'Teacup is a community-driven DSL for making CSS-like styling, and
   layouts for
@@ -43,6 +43,7 @@ files:
 - app/controllers/main_controller.rb
 - app/controllers/motion_layout_controller.rb
 - app/controllers/present_modal_controller.rb
+- app/controllers/table_view_controller.rb
 - app/controllers/tableview_controller.rb
 - app/custom_class.rb
 - app/styles/appearance.rb
@@ -57,6 +58,7 @@ files:
 - lib/teacup-ios/style.rb
 - lib/teacup-ios/stylesheet_extensions/autoresize.rb
 - lib/teacup-ios/stylesheet_extensions/device.rb
+- lib/teacup-ios/table_view/table_view_delegate.rb
 - lib/teacup-osx/core_extensions/ns_view.rb
 - lib/teacup-osx/core_extensions/ns_view_controller.rb
 - lib/teacup-osx/core_extensions/ns_window.rb
@@ -143,6 +145,7 @@ files:
 - spec/ios/stylesheet_extensions/autoresize_spec.rb
 - spec/ios/stylesheet_extensions/device_spec.rb
 - spec/ios/stylesheet_spec.rb
+- spec/ios/table_view/table_view_spec.rb
 - spec/ios/ui_view_getters_spec.rb
 - spec/ios/uiswitch_spec.rb
 - spec/ios/view_spec.rb
@@ -186,6 +189,7 @@ test_files:
 - spec/ios/stylesheet_extensions/autoresize_spec.rb
 - spec/ios/stylesheet_extensions/device_spec.rb
 - spec/ios/stylesheet_spec.rb
+- spec/ios/table_view/table_view_spec.rb
 - spec/ios/ui_view_getters_spec.rb
 - spec/ios/uiswitch_spec.rb
 - spec/ios/view_spec.rb