Skip to content

M
Material
Commit 0dd6009b by Daniel Dahan
Options

added column and row offset to Grid

parent 41b95b74
Showing with 72 additions and 49 deletions
Examples/Programmatic/GridView/GridView/ViewController.swift
...@@ -60,13 +60,13 @@ class ViewController: UIViewController { ...@@ -60,13 +60,13 @@ class ViewController: UIViewController {
var image: UIImage? = UIImage(named: "CosmicMindInverted") var image: UIImage? = UIImage(named: "CosmicMindInverted")
let imageView: MaterialView = MaterialView() let imageView: MaterialView = MaterialView()
imageView.grid.column = .Cell4 imageView.grid.column = .Column4
imageView.image = image imageView.image = image
imageView.contentsGravity = .ResizeAspectFill imageView.contentsGravity = .ResizeAspectFill
cardView.addSubview(imageView) cardView.addSubview(imageView)
let contentView: MaterialView = MaterialView() let contentView: MaterialView = MaterialView()
contentView.grid.column = .Cell8 contentView.grid.column = .Column8
contentView.grid.layout = .Vertical contentView.grid.layout = .Vertical
contentView.grid.contentInsetPreset = .Square3 contentView.grid.contentInsetPreset = .Square3
contentView.grid.spacing = 16 contentView.grid.spacing = 16
...@@ -74,21 +74,21 @@ class ViewController: UIViewController { ...@@ -74,21 +74,21 @@ class ViewController: UIViewController {
cardView.addSubview(contentView) cardView.addSubview(contentView)
let titleView: MaterialView = MaterialView() let titleView: MaterialView = MaterialView()
titleView.grid.column = .Cell8 titleView.grid.column = .Column8
titleView.grid.row = .Cell3 titleView.grid.row = .Row3
titleView.backgroundColor = MaterialColor.clear titleView.backgroundColor = MaterialColor.clear
contentView.addSubview(titleView) contentView.addSubview(titleView)
let titleLabel: UILabel = UILabel() let titleLabel: UILabel = UILabel()
titleLabel.grid.column = .Cell7 titleLabel.grid.column = .Column7
titleLabel.text = "Title" titleLabel.text = "Material"
titleLabel.textColor = MaterialColor.blueGrey.darken4 titleLabel.textColor = MaterialColor.blueGrey.darken4
titleLabel.backgroundColor = MaterialColor.clear titleLabel.backgroundColor = MaterialColor.clear
titleView.addSubview(titleLabel) titleView.addSubview(titleLabel)
image = UIImage(named: "ic_more_vert_white")?.imageWithRenderingMode(.AlwaysTemplate) image = UIImage(named: "ic_more_vert_white")?.imageWithRenderingMode(.AlwaysTemplate)
let moreButton: FlatButton = FlatButton() let moreButton: FlatButton = FlatButton()
moreButton.grid.column = .Cell1 moreButton.grid.column = .Column1
moreButton.contentInsetPreset = .None moreButton.contentInsetPreset = .None
moreButton.pulseColor = MaterialColor.blueGrey.darken4 moreButton.pulseColor = MaterialColor.blueGrey.darken4
moreButton.tintColor = MaterialColor.blueGrey.darken4 moreButton.tintColor = MaterialColor.blueGrey.darken4
...@@ -97,23 +97,23 @@ class ViewController: UIViewController { ...@@ -97,23 +97,23 @@ class ViewController: UIViewController {
titleView.addSubview(moreButton) titleView.addSubview(moreButton)
let detailLabel: UILabel = UILabel() let detailLabel: UILabel = UILabel()
detailLabel.grid.row = .Cell6 detailLabel.grid.row = .Row6
detailLabel.numberOfLines = 0 detailLabel.numberOfLines = 0
detailLabel.lineBreakMode = .ByTruncatingTail detailLabel.lineBreakMode = .ByTruncatingTail
detailLabel.font = RobotoFont.regularWithSize(12) detailLabel.font = RobotoFont.regularWithSize(12)
detailLabel.text = "There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable." detailLabel.text = "Material is a graphics and animation framework for Google's Material Design. It is designed to allow the creativity of others to easily be expressed."
detailLabel.textColor = MaterialColor.blueGrey.darken4 detailLabel.textColor = MaterialColor.blueGrey.darken4
detailLabel.backgroundColor = MaterialColor.clear detailLabel.backgroundColor = MaterialColor.clear
contentView.addSubview(detailLabel) contentView.addSubview(detailLabel)
let alarmView: MaterialView = MaterialView() let alarmView: MaterialView = MaterialView()
alarmView.grid.column = .Cell8 alarmView.grid.column = .Column8
alarmView.grid.row = .Cell3 alarmView.grid.row = .Row3
alarmView.backgroundColor = MaterialColor.clear alarmView.backgroundColor = MaterialColor.clear
contentView.addSubview(alarmView) contentView.addSubview(alarmView)
let alarmLabel: UILabel = UILabel() let alarmLabel: UILabel = UILabel()
alarmLabel.grid.column = .Cell7 alarmLabel.grid.column = .Column7
alarmLabel.font = RobotoFont.regularWithSize(12) alarmLabel.font = RobotoFont.regularWithSize(12)
alarmLabel.text = "34 min" alarmLabel.text = "34 min"
alarmLabel.textColor = MaterialColor.blueGrey.darken4 alarmLabel.textColor = MaterialColor.blueGrey.darken4
...@@ -122,7 +122,7 @@ class ViewController: UIViewController { ...@@ -122,7 +122,7 @@ class ViewController: UIViewController {
image = UIImage(named: "ic_alarm_white")?.imageWithRenderingMode(.AlwaysTemplate) image = UIImage(named: "ic_alarm_white")?.imageWithRenderingMode(.AlwaysTemplate)
let alarmButton: FlatButton = FlatButton() let alarmButton: FlatButton = FlatButton()
alarmButton.grid.column = .Cell1 alarmButton.grid.column = .Column1
alarmButton.contentInsetPreset = .None alarmButton.contentInsetPreset = .None
alarmButton.pulseColor = MaterialColor.blueGrey.darken4 alarmButton.pulseColor = MaterialColor.blueGrey.darken4
alarmButton.tintColor = MaterialColor.red.base alarmButton.tintColor = MaterialColor.red.base
...@@ -140,7 +140,7 @@ class ViewController: UIViewController { ...@@ -140,7 +140,7 @@ class ViewController: UIViewController {
private func prepareHorizontalGridViewExample() { private func prepareHorizontalGridViewExample() {
var image: UIImage? = UIImage(named: "ic_flash_auto_white")?.imageWithRenderingMode(.AlwaysTemplate) var image: UIImage? = UIImage(named: "ic_flash_auto_white")?.imageWithRenderingMode(.AlwaysTemplate)
let btn1: FlatButton = FlatButton() let btn1: FlatButton = FlatButton()
btn1.grid.column = .Cell3 btn1.grid.column = .Column3
btn1.pulseColor = MaterialColor.blueGrey.darken4 btn1.pulseColor = MaterialColor.blueGrey.darken4
btn1.tintColor = MaterialColor.blueGrey.darken4 btn1.tintColor = MaterialColor.blueGrey.darken4
btn1.backgroundColor = MaterialColor.grey.lighten3 btn1.backgroundColor = MaterialColor.grey.lighten3
...@@ -150,7 +150,7 @@ class ViewController: UIViewController { ...@@ -150,7 +150,7 @@ class ViewController: UIViewController {
image = UIImage(named: "ic_flash_off_white")?.imageWithRenderingMode(.AlwaysTemplate) image = UIImage(named: "ic_flash_off_white")?.imageWithRenderingMode(.AlwaysTemplate)
let btn2: FlatButton = FlatButton() let btn2: FlatButton = FlatButton()
btn2.grid.column = .Cell3 btn2.grid.column = .Column3
btn2.pulseColor = MaterialColor.blueGrey.darken4 btn2.pulseColor = MaterialColor.blueGrey.darken4
btn2.tintColor = MaterialColor.blueGrey.darken4 btn2.tintColor = MaterialColor.blueGrey.darken4
btn2.backgroundColor = MaterialColor.grey.lighten3 btn2.backgroundColor = MaterialColor.grey.lighten3
...@@ -160,7 +160,7 @@ class ViewController: UIViewController { ...@@ -160,7 +160,7 @@ class ViewController: UIViewController {
image = UIImage(named: "ic_flash_on_white")?.imageWithRenderingMode(.AlwaysTemplate) image = UIImage(named: "ic_flash_on_white")?.imageWithRenderingMode(.AlwaysTemplate)
let btn3: FlatButton = FlatButton() let btn3: FlatButton = FlatButton()
btn3.grid.column = .Cell3 btn3.grid.column = .Column3
btn3.pulseColor = MaterialColor.blueGrey.darken4 btn3.pulseColor = MaterialColor.blueGrey.darken4
btn3.tintColor = MaterialColor.blueGrey.darken4 btn3.tintColor = MaterialColor.blueGrey.darken4
btn3.backgroundColor = MaterialColor.grey.lighten3 btn3.backgroundColor = MaterialColor.grey.lighten3
...@@ -176,7 +176,7 @@ class ViewController: UIViewController { ...@@ -176,7 +176,7 @@ class ViewController: UIViewController {
label2.text = "B" label2.text = "B"
label2.backgroundColor = MaterialColor.blue.base label2.backgroundColor = MaterialColor.blue.base
view.grid.column = .Cell9 view.grid.column = .Column9
view.grid.spacing = 16 view.grid.spacing = 16
view.grid.contentInset.left = 16 view.grid.contentInset.left = 16
view.grid.contentInset.right = 16 view.grid.contentInset.right = 16
...@@ -197,7 +197,7 @@ class ViewController: UIViewController { ...@@ -197,7 +197,7 @@ class ViewController: UIViewController {
private func prepareVerticalGridViewExample() { private func prepareVerticalGridViewExample() {
var image: UIImage? = UIImage(named: "ic_flash_auto_white")?.imageWithRenderingMode(.AlwaysTemplate) var image: UIImage? = UIImage(named: "ic_flash_auto_white")?.imageWithRenderingMode(.AlwaysTemplate)
let btn1: FlatButton = FlatButton() let btn1: FlatButton = FlatButton()
btn1.grid.row = .Cell3 btn1.grid.row = .Row3
btn1.pulseColor = MaterialColor.blueGrey.darken4 btn1.pulseColor = MaterialColor.blueGrey.darken4
btn1.tintColor = MaterialColor.blueGrey.darken4 btn1.tintColor = MaterialColor.blueGrey.darken4
btn1.backgroundColor = MaterialColor.grey.lighten3 btn1.backgroundColor = MaterialColor.grey.lighten3
...@@ -207,7 +207,7 @@ class ViewController: UIViewController { ...@@ -207,7 +207,7 @@ class ViewController: UIViewController {
image = UIImage(named: "ic_flash_off_white")?.imageWithRenderingMode(.AlwaysTemplate) image = UIImage(named: "ic_flash_off_white")?.imageWithRenderingMode(.AlwaysTemplate)
let btn2: FlatButton = FlatButton() let btn2: FlatButton = FlatButton()
btn2.grid.row = .Cell3 btn2.grid.row = .Row3
btn2.pulseColor = MaterialColor.blueGrey.darken4 btn2.pulseColor = MaterialColor.blueGrey.darken4
btn2.tintColor = MaterialColor.blueGrey.darken4 btn2.tintColor = MaterialColor.blueGrey.darken4
btn2.backgroundColor = MaterialColor.grey.lighten3 btn2.backgroundColor = MaterialColor.grey.lighten3
...@@ -217,7 +217,7 @@ class ViewController: UIViewController { ...@@ -217,7 +217,7 @@ class ViewController: UIViewController {
image = UIImage(named: "ic_flash_on_white")?.imageWithRenderingMode(.AlwaysTemplate) image = UIImage(named: "ic_flash_on_white")?.imageWithRenderingMode(.AlwaysTemplate)
let btn3: FlatButton = FlatButton() let btn3: FlatButton = FlatButton()
btn3.grid.row = .Cell3 btn3.grid.row = .Row3
btn3.pulseColor = MaterialColor.blueGrey.darken4 btn3.pulseColor = MaterialColor.blueGrey.darken4
btn3.tintColor = MaterialColor.blueGrey.darken4 btn3.tintColor = MaterialColor.blueGrey.darken4
btn3.backgroundColor = MaterialColor.grey.lighten3 btn3.backgroundColor = MaterialColor.grey.lighten3
...@@ -234,7 +234,7 @@ class ViewController: UIViewController { ...@@ -234,7 +234,7 @@ class ViewController: UIViewController {
label2.backgroundColor = MaterialColor.blue.base label2.backgroundColor = MaterialColor.blue.base
view.grid.layout = .Vertical view.grid.layout = .Vertical
view.grid.row = .Cell9 view.grid.row = .Row9
view.grid.spacing = 16 view.grid.spacing = 16
view.grid.contentInset.left = 16 view.grid.contentInset.left = 16
view.grid.contentInset.right = 16 view.grid.contentInset.right = 16
......
Sources/Grid.swift
...@@ -30,19 +30,34 @@ ...@@ -30,19 +30,34 @@
import UIKit import UIKit
public enum Cell : Int { public enum GridRow : Int {
case Cell1 = 1 case Row1 = 1
case Cell2 = 2 case Row2 = 2
case Cell3 = 3 case Row3 = 3
case Cell4 = 4 case Row4 = 4
case Cell5 = 5 case Row5 = 5
case Cell6 = 6 case Row6 = 6
case Cell7 = 7 case Row7 = 7
case Cell8 = 8 case Row8 = 8
case Cell9 = 9 case Row9 = 9
case Cell10 = 10 case Row10 = 10
case Cell11 = 11 case Row11 = 11
case Cell12 = 12 case Row12 = 12
}
public enum GridColumn : Int {
case Column1 = 1
case Column2 = 2
case Column3 = 3
case Column4 = 4
case Column5 = 5
case Column6 = 6
case Column7 = 7
case Column8 = 8
case Column9 = 9
case Column10 = 10
case Column11 = 11
case Column12 = 12
} }
public enum GridLayout { public enum GridLayout {
...@@ -50,24 +65,30 @@ public enum GridLayout { ...@@ -50,24 +65,30 @@ public enum GridLayout {
case Vertical case Vertical
} }
public protocol GridCell {
/// Grid column size.
var column: Cell { get set }
/// Grid row size.
var row: Cell { get set }
}
public class Grid { public class Grid {
/// The row size. /// The row size.
public var row: Cell { public var row: GridRow {
didSet {
reloadLayout()
}
}
/// The row size.
public var rowOffset: GridRow? {
didSet {
reloadLayout()
}
}
/// The column size.
public var column: GridColumn {
didSet { didSet {
reloadLayout() reloadLayout()
} }
} }
/// The column size. /// The column size.
public var column: Cell { public var columnOffset: GridColumn? {
didSet { didSet {
reloadLayout() reloadLayout()
} }
...@@ -108,7 +129,7 @@ public class Grid { ...@@ -108,7 +129,7 @@ public class Grid {
} }
} }
public init(row: Cell = .Cell12, column: Cell = .Cell12, spacing: CGFloat = 0) { public init(row: GridRow = .Row12, column: GridColumn = .Column12, spacing: CGFloat = 0) {
self.row = row self.row = row
self.column = column self.column = column
self.spacing = spacing self.spacing = spacing
...@@ -126,13 +147,15 @@ public class Grid { ...@@ -126,13 +147,15 @@ public class Grid {
let h: CGFloat = (sv.bounds.height - contentInset.top - contentInset.bottom + spacing) / CGFloat(row.rawValue) let h: CGFloat = (sv.bounds.height - contentInset.top - contentInset.bottom + spacing) / CGFloat(row.rawValue)
let c: Int = view.grid.column.rawValue let c: Int = view.grid.column.rawValue
let r: Int = view.grid.row.rawValue let r: Int = view.grid.row.rawValue
let co: Int = nil == view.grid.columnOffset ? 0 : view.grid.columnOffset!.rawValue
let ro: Int = nil == view.grid.rowOffset ? 0 : view.grid.rowOffset!.rawValue
if .Horizontal == layout { if .Horizontal == layout {
// View height. // View height.
let vh: CGFloat = sv.bounds.height - contentInset.top - contentInset.bottom let vh: CGFloat = sv.bounds.height - contentInset.top - contentInset.bottom
// View left. // View left.
let vl: CGFloat = CGFloat(i + n) * w + contentInset.left let vl: CGFloat = CGFloat(i + n + co) * w + contentInset.left
// View width. // View width.
let vw: CGFloat = (w * CGFloat(c)) - spacing let vw: CGFloat = (w * CGFloat(c)) - spacing
...@@ -149,7 +172,7 @@ public class Grid { ...@@ -149,7 +172,7 @@ public class Grid {
let vw: CGFloat = sv.bounds.width - contentInset.left - contentInset.right let vw: CGFloat = sv.bounds.width - contentInset.left - contentInset.right
// View top. // View top.
let vt: CGFloat = CGFloat(i + m) * h + contentInset.top let vt: CGFloat = CGFloat(i + m + ro) * h + contentInset.top
// View height. // View height.
let vh: CGFloat = (h * CGFloat(r)) - spacing let vh: CGFloat = (h * CGFloat(r)) - spacing
...@@ -162,8 +185,8 @@ public class Grid { ...@@ -162,8 +185,8 @@ public class Grid {
view.frame = CGRectMake(contentInset.left, vt, vw, vh) view.frame = CGRectMake(contentInset.left, vt, vw, vh)
} }
} }
n += c - 1 n += c + co - 1
m += r - 1 m += r + ro - 1
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment