Skip to content

M
Material
Commit 15fe53a5 by Daniel Dahan
Options

development: updated all Card samples

parent 418f4090
Showing with 313 additions and 108 deletions
Examples/Programmatic/Card/Card/Assets.xcassets/AppIcon.appiconset/Contents.json
...@@ -2,6 +2,16 @@ ...@@ -2,6 +2,16 @@
"images" : [ "images" : [
{ {
"idiom" : "iphone", "idiom" : "iphone",
"size" : "20x20",
"scale" : "2x"
},
{
"idiom" : "iphone",
"size" : "20x20",
"scale" : "3x"
},
{
"idiom" : "iphone",
"size" : "29x29", "size" : "29x29",
"scale" : "2x" "scale" : "2x"
}, },
...@@ -32,6 +42,16 @@ ...@@ -32,6 +42,16 @@
}, },
{ {
"idiom" : "ipad", "idiom" : "ipad",
"size" : "20x20",
"scale" : "1x"
},
{
"idiom" : "ipad",
"size" : "20x20",
"scale" : "2x"
},
{
"idiom" : "ipad",
"size" : "29x29", "size" : "29x29",
"scale" : "1x" "scale" : "1x"
}, },
...@@ -59,6 +79,11 @@ ...@@ -59,6 +79,11 @@
"idiom" : "ipad", "idiom" : "ipad",
"size" : "76x76", "size" : "76x76",
"scale" : "2x" "scale" : "2x"
},
{
"idiom" : "ipad",
"size" : "83.5x83.5",
"scale" : "2x"
} }
], ],
"info" : { "info" : {
......
Examples/Programmatic/Card/Card/Assets.xcassets/Contents.json 0 → 100644
{
"info" : {
"version" : 1,
"author" : "xcode"
}
}
\ No newline at end of file
Examples/Programmatic/Card/Card/Assets.xcassets/CosmicMind.imageset/Contents.json 0 → 100644
{
"images" : [
{
"idiom" : "universal",
"filename" : "CosmicMind.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
\ No newline at end of file
Examples/Programmatic/Card/Card/ViewController.swift
...@@ -32,27 +32,77 @@ import UIKit ...@@ -32,27 +32,77 @@ import UIKit
import Material import Material
class ViewController: UIViewController { class ViewController: UIViewController {
private var toolbar: Toolbar!
private var contentView: UILabel! private var contentView: UILabel!
/// Bottom Bar views.
private var bottomBar: Bar! private var bottomBar: Bar!
private var favoriteButton: IconButton! private var favoriteButton: FlatButton!
private var shareButton: FlatButton!
private var starButton: FlatButton!
/// Toolbar views.
private var toolbar: Toolbar!
private var moreButton: IconButton!
private var authorView: View!
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
view.backgroundColor = Color.grey.lighten5 view.backgroundColor = Color.grey.lighten5
prepareFavoriteButton() prepareFavoriteButton()
prepareShareButton()
prepareStarButton()
prepareMoreButton()
prepareAuthorView()
prepareToolbar() prepareToolbar()
prepareContentView() prepareContentView()
prepareBottomBar() prepareBottomBar()
prepareCard() prepareImageCard()
}
private func prepareFavoriteButton() {
favoriteButton = FlatButton(image: Icon.favorite, tintColor: Color.grey.base)
favoriteButton.grid.columns = 4
}
private func prepareShareButton() {
shareButton = FlatButton(image: Icon.cm.share, tintColor: Color.grey.base)
shareButton.grid.columns = 4
}
private func prepareStarButton() {
starButton = FlatButton(image: Icon.cm.star, tintColor: Color.grey.base)
starButton.grid.columns = 4
}
private func prepareMoreButton() {
moreButton = IconButton(image: Icon.cm.moreVertical, tintColor: Color.grey.base)
}
private func prepareAuthorView() {
authorView = View()
authorView.width = 24
authorView.image = UIImage(named: "CosmicMind")
authorView.backgroundColor = nil
authorView.contentsGravityPreset = .ResizeAspect
} }
private func prepareToolbar() { private func prepareToolbar() {
toolbar = Toolbar() toolbar = Toolbar()
toolbar.title = "Title"
toolbar.detail = "Detail Description"
toolbar.backgroundColor = nil toolbar.backgroundColor = nil
toolbar.title = "CosmicMind"
toolbar.titleLabel.textAlignment = .left
toolbar.detail = "Build Beautiful Software"
toolbar.detailLabel.textAlignment = .left
let insets = EdgeInsetsPresetToValue(preset: .square2)
toolbar.height += insets.top + insets.bottom
toolbar.contentEdgeInsetsPreset = .square2
toolbar.leftViews.append(authorView)
toolbar.rightViews.append(moreButton)
} }
private func prepareContentView() { private func prepareContentView() {
...@@ -62,25 +112,27 @@ class ViewController: UIViewController { ...@@ -62,25 +112,27 @@ class ViewController: UIViewController {
contentView.font = RobotoFont.regular(with: 14) contentView.font = RobotoFont.regular(with: 14)
} }
private func prepareFavoriteButton() {
favoriteButton = IconButton(image: Icon.favorite, tintColor: Color.blue.base)
favoriteButton.pulse.color = Color.blue.base
}
private func prepareBottomBar() { private func prepareBottomBar() {
bottomBar = Bar() bottomBar = Bar()
bottomBar.backgroundColor = nil bottomBar.backgroundColor = Color.grey.lighten4
bottomBar.leftViews = [favoriteButton] bottomBar.contentEdgeInsetsPreset = .square1
bottomBar.cornerRadiusPreset = .cornerRadius1
bottomBar.divider.color = Color.grey.lighten3
bottomBar.divider.alignment = .top
bottomBar.contentView.grid.views = [favoriteButton, shareButton, starButton]
} }
private func prepareCard() { private func prepareImageCard() {
let card = Card() let card = Card()
card.toolbar = toolbar card.toolbar = toolbar
card.contentView = contentView card.contentView = contentView
card.bottomBar = bottomBar card.bottomBar = bottomBar
card.cornerRadiusPreset = .cornerRadius1 card.cornerRadiusPreset = .cornerRadius1
card.contentEdgeInsetsPreset = .square3
view.layout(card).top(100).left(20).right(20) view.layout(card).horizontally(left: 20, right: 20).center()
} }
} }
Examples/Programmatic/ImageCard/ImageCard/ViewController.swift
...@@ -33,20 +33,30 @@ import Material ...@@ -33,20 +33,30 @@ import Material
class ViewController: UIViewController { class ViewController: UIViewController {
private var imageView: UIImageView! private var imageView: UIImageView!
private var toolbar: Toolbar!
private var contentView: UILabel! private var contentView: UILabel!
/// Bottom Bar views.
private var bottomBar: Bar! private var bottomBar: Bar!
private var favoriteButton: IconButton! private var favoriteButton: FlatButton!
private var shareButton: FlatButton!
private var starButton: FlatButton!
/// Toolbar views.
private var toolbar: Toolbar!
private var moreButton: IconButton!
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
view.backgroundColor = Color.grey.lighten5 view.backgroundColor = Color.grey.lighten5
prepareFavoriteButton()
prepareBottomBar()
prepareImageView() prepareImageView()
prepareFavoriteButton()
prepareShareButton()
prepareStarButton()
prepareMoreButton()
prepareToolbar() prepareToolbar()
prepareContentView() prepareContentView()
prepareBottomBar()
prepareImageCard() prepareImageCard()
} }
...@@ -54,12 +64,32 @@ class ViewController: UIViewController { ...@@ -54,12 +64,32 @@ class ViewController: UIViewController {
imageView = UIImageView() imageView = UIImageView()
imageView.image = UIImage(named: "frontier.jpg")?.resize(toWidth: view.width) imageView.image = UIImage(named: "frontier.jpg")?.resize(toWidth: view.width)
imageView.clipsToBounds = true imageView.clipsToBounds = true
imageView.contentMode = .scaleAspectFill
imageView.cornerRadiusPreset = .cornerRadius1 imageView.cornerRadiusPreset = .cornerRadius1
imageView.contentMode = .scaleAspectFill
}
private func prepareFavoriteButton() {
favoriteButton = FlatButton(image: Icon.favorite, tintColor: Color.grey.base)
favoriteButton.grid.columns = 4
}
private func prepareShareButton() {
shareButton = FlatButton(image: Icon.cm.share, tintColor: Color.grey.base)
shareButton.grid.columns = 4
}
private func prepareStarButton() {
starButton = FlatButton(image: Icon.cm.star, tintColor: Color.grey.base)
starButton.grid.columns = 4
}
private func prepareMoreButton() {
moreButton = IconButton(image: Icon.cm.moreHorizontal, tintColor: Color.white)
} }
private func prepareToolbar() { private func prepareToolbar() {
toolbar = Toolbar() toolbar = Toolbar()
toolbar.backgroundColor = nil
toolbar.title = "CosmicMind" toolbar.title = "CosmicMind"
toolbar.titleLabel.textAlignment = .left toolbar.titleLabel.textAlignment = .left
...@@ -69,8 +99,11 @@ class ViewController: UIViewController { ...@@ -69,8 +99,11 @@ class ViewController: UIViewController {
toolbar.detailLabel.textAlignment = .left toolbar.detailLabel.textAlignment = .left
toolbar.detailLabel.textColor = Color.white toolbar.detailLabel.textColor = Color.white
let insets = EdgeInsetsPresetToValue(preset: .square3)
toolbar.height += insets.top + insets.bottom
toolbar.contentEdgeInsetsPreset = .square3 toolbar.contentEdgeInsetsPreset = .square3
toolbar.backgroundColor = nil
toolbar.rightViews.append(moreButton)
} }
private func prepareContentView() { private func prepareContentView() {
...@@ -80,16 +113,16 @@ class ViewController: UIViewController { ...@@ -80,16 +113,16 @@ class ViewController: UIViewController {
contentView.font = RobotoFont.regular(with: 14) contentView.font = RobotoFont.regular(with: 14)
} }
private func prepareFavoriteButton() {
favoriteButton = IconButton(image: Icon.favorite, tintColor: Color.grey.base)
favoriteButton.pulse.color = Color.grey.base
}
private func prepareBottomBar() { private func prepareBottomBar() {
bottomBar = Bar() bottomBar = Bar()
bottomBar.backgroundColor = nil bottomBar.backgroundColor = Color.grey.lighten4
bottomBar.contentEdgeInsetsPreset = .square1 bottomBar.contentEdgeInsetsPreset = .square1
bottomBar.rightViews = [favoriteButton] bottomBar.cornerRadiusPreset = .cornerRadius1
bottomBar.divider.color = Color.grey.lighten3
bottomBar.divider.alignment = .top
bottomBar.contentView.grid.views = [favoriteButton, shareButton, starButton]
} }
private func prepareImageCard() { private func prepareImageCard() {
...@@ -98,11 +131,10 @@ class ViewController: UIViewController { ...@@ -98,11 +131,10 @@ class ViewController: UIViewController {
card.toolbar = toolbar card.toolbar = toolbar
card.contentView = contentView card.contentView = contentView
card.bottomBar = bottomBar card.bottomBar = bottomBar
card.contentEdgeInsetsPreset = .square3
card.cornerRadiusPreset = .cornerRadius1 card.cornerRadiusPreset = .cornerRadius1
card.contentEdgeInsetsPreset = .square3
imageView?.layout(toolbar!).height(toolbar!.height + 32) view.layout(card).horizontally(left: 20, right: 20).center()
view.layout(card).top(100).left(20).right(20)
} }
} }
Examples/Programmatic/PresenterCard/PresenterCard/Assets.xcassets/CosmicMind.imageset/Contents.json 0 → 100644
{
"images" : [
{
"idiom" : "universal",
"filename" : "CosmicMind.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
\ No newline at end of file
Examples/Programmatic/PresenterCard/PresenterCard/ViewController.swift
...@@ -33,13 +33,19 @@ import Material ...@@ -33,13 +33,19 @@ import Material
class ViewController: UIViewController { class ViewController: UIViewController {
private var imageView: UIImageView! private var imageView: UIImageView!
private var toolbar: Toolbar!
private var contentView: UILabel! private var contentView: UILabel!
/// Bottom Bar views.
private var bottomBar: Bar! private var bottomBar: Bar!
private var favoriteButton: FlatButton! private var favoriteButton: FlatButton!
private var shareButton: FlatButton! private var shareButton: FlatButton!
private var starButton: FlatButton! private var starButton: FlatButton!
/// Toolbar views.
private var toolbar: Toolbar!
private var moreButton: IconButton!
private var authorView: View!
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
view.backgroundColor = Color.grey.lighten5 view.backgroundColor = Color.grey.lighten5
...@@ -48,6 +54,8 @@ class ViewController: UIViewController { ...@@ -48,6 +54,8 @@ class ViewController: UIViewController {
prepareFavoriteButton() prepareFavoriteButton()
prepareShareButton() prepareShareButton()
prepareStarButton() prepareStarButton()
prepareMoreButton()
prepareAuthorView()
prepareToolbar() prepareToolbar()
prepareContentView() prepareContentView()
prepareBottomBar() prepareBottomBar()
...@@ -59,29 +67,51 @@ class ViewController: UIViewController { ...@@ -59,29 +67,51 @@ class ViewController: UIViewController {
imageView.image = UIImage(named: "frontier.jpg")?.resize(toWidth: view.width) imageView.image = UIImage(named: "frontier.jpg")?.resize(toWidth: view.width)
imageView.clipsToBounds = true imageView.clipsToBounds = true
imageView.contentMode = .scaleAspectFill imageView.contentMode = .scaleAspectFill
imageView.cornerRadiusPreset = .cornerRadius1 }
private func prepareFavoriteButton() {
favoriteButton = FlatButton(image: Icon.favorite, tintColor: Color.grey.base)
favoriteButton.grid.columns = 4
}
private func prepareShareButton() {
shareButton = FlatButton(image: Icon.cm.share, tintColor: Color.grey.base)
shareButton.grid.columns = 4
}
private func prepareStarButton() {
starButton = FlatButton(image: Icon.cm.star, tintColor: Color.grey.base)
starButton.grid.columns = 4
}
private func prepareMoreButton() {
moreButton = IconButton(image: Icon.cm.moreVertical, tintColor: Color.grey.base)
}
private func prepareAuthorView() {
authorView = View()
authorView.width = 24
authorView.image = UIImage(named: "CosmicMind")
authorView.backgroundColor = nil
authorView.contentsGravityPreset = .ResizeAspect
} }
private func prepareToolbar() { private func prepareToolbar() {
toolbar = Toolbar() toolbar = Toolbar()
toolbar.backgroundColor = nil
toolbar.title = "CosmicMind" toolbar.title = "CosmicMind"
toolbar.titleLabel.textAlignment = .left toolbar.titleLabel.textAlignment = .left
toolbar.titleLabel.textColor = Color.white
toolbar.detail = "Build Beautiful Software" toolbar.detail = "Build Beautiful Software"
toolbar.detailLabel.textAlignment = .left toolbar.detailLabel.textAlignment = .left
toolbar.detailLabel.textColor = Color.white
toolbar.contentEdgeInsetsPreset = .square3 let insets = EdgeInsetsPresetToValue(preset: .square2)
toolbar.backgroundColor = nil toolbar.height += insets.top + insets.bottom
toolbar.contentEdgeInsetsPreset = .square2
toolbar.rightViews.append(starButton) toolbar.leftViews.append(authorView)
} toolbar.rightViews.append(moreButton)
@objc
internal func handleButton(button: UIButton) {
print("hello")
} }
private func prepareContentView() { private func prepareContentView() {
...@@ -91,30 +121,16 @@ class ViewController: UIViewController { ...@@ -91,30 +121,16 @@ class ViewController: UIViewController {
contentView.font = RobotoFont.regular(with: 14) contentView.font = RobotoFont.regular(with: 14)
} }
private func prepareFavoriteButton() {
favoriteButton = FlatButton(image: Icon.favorite, tintColor: Color.grey.base)
favoriteButton.pulse.color = Color.grey.base
favoriteButton.grid.columns = 4
}
private func prepareShareButton() {
shareButton = FlatButton(image: Icon.cm.share, tintColor: Color.grey.base)
shareButton.pulse.color = Color.grey.base
shareButton.grid.columns = 4
}
private func prepareStarButton() {
starButton = FlatButton(image: Icon.cm.star, tintColor: Color.grey.base)
starButton.pulse.color = Color.green.base
starButton.addTarget(self, action: #selector(handleButton(button:)), for: .touchUpInside)
// starButton.grid.columns = 4
}
private func prepareBottomBar() { private func prepareBottomBar() {
bottomBar = Bar() bottomBar = Bar()
bottomBar.backgroundColor = nil bottomBar.backgroundColor = Color.grey.lighten4
bottomBar.contentEdgeInsetsPreset = .square1 bottomBar.contentEdgeInsetsPreset = .square1
bottomBar.contentView.grid.views = [favoriteButton, shareButton] bottomBar.cornerRadiusPreset = .cornerRadius1
bottomBar.divider.color = Color.grey.lighten3
bottomBar.divider.alignment = .top
bottomBar.contentView.grid.views = [favoriteButton, shareButton, starButton]
} }
private func prepareImageCard() { private func prepareImageCard() {
...@@ -123,11 +139,10 @@ class ViewController: UIViewController { ...@@ -123,11 +139,10 @@ class ViewController: UIViewController {
card.toolbar = toolbar card.toolbar = toolbar
card.contentView = contentView card.contentView = contentView
card.bottomBar = bottomBar card.bottomBar = bottomBar
card.contentEdgeInsetsPreset = .square3
card.cornerRadiusPreset = .cornerRadius1 card.cornerRadiusPreset = .cornerRadius1
card.contentEdgeInsetsPreset = .square3
imageView?.layout(toolbar!).height(toolbar!.height + 32) view.layout(card).horizontally(left: 20, right: 20).center()
view.layout(card).top(100).left(20).right(20)
} }
} }
Sources/iOS/Card.swift
...@@ -138,7 +138,7 @@ open class Card: PulseView { ...@@ -138,7 +138,7 @@ open class Card: PulseView {
if let v = toolbar { if let v = toolbar {
format += "[toolbar]" format += "[toolbar]"
views["toolbar"] = v views["toolbar"] = v
layout(v).horizontally() layout(v).horizontally().height(v.height)
} }
if let v = contentView { if let v = contentView {
...@@ -150,7 +150,7 @@ open class Card: PulseView { ...@@ -150,7 +150,7 @@ open class Card: PulseView {
if let v = bottomBar { if let v = bottomBar {
format += "[bottomBar]" format += "[bottomBar]"
views["bottomBar"] = v views["bottomBar"] = v
layout(v).horizontally() layout(v).horizontally().height(v.height)
} }
guard 0 < views.count else { guard 0 < views.count else {
......
Sources/iOS/ImageCard.swift
...@@ -30,15 +30,70 @@ ...@@ -30,15 +30,70 @@
import UIKit import UIKit
open class ImageCard: PresenterCard { @objc(ToolbarAlignment)
public enum ToolbarAlignment: Int {
case top
case bottom
}
open class ImageCard: Card {
/// A reference to the imageView. /// A reference to the imageView.
@IBInspectable @IBInspectable
open var imageView: UIImageView? { open var imageView: UIImageView? {
get { didSet {
return presenterView as? UIImageView layoutSubviews()
}
}
/// An ImageCardToolbarAlignment value.
open var toolbarAlignment = ToolbarAlignment.bottom {
didSet {
layoutSubviews()
}
}
open override func layout() {
guard let iv = imageView else {
super.layout()
return
}
var format = "V:|"
var views = [String: Any]()
format += "[imageView]"
views["imageView"] = iv
layout(iv).horizontally()
if let v = toolbar {
iv.layout(v).horizontally().height(v.height)
if .top == toolbarAlignment {
iv.layout(v).top()
} else {
iv.layout(v).bottom()
}
}
if let v = contentView {
format += "-(top)-[contentView]-(bottom)-"
views["contentView"] = v
layout(v).horizontally(left: contentEdgeInsets.left, right: contentEdgeInsets.right)
}
if let v = bottomBar {
format += "[bottomBar]"
views["bottomBar"] = v
layout(v).horizontally().height(v.height)
} }
set(value) {
presenterView = value guard 0 < views.count else {
return
} }
var metrics = [String: Any]()
metrics["top"] = contentEdgeInsets.top
metrics["bottom"] = contentEdgeInsets.bottom
addConstraints(Layout.constraint(format: "\(format)|", options: [], metrics: metrics, views: views))
} }
} }
Sources/iOS/PresenterCard.swift
...@@ -30,12 +30,6 @@ ...@@ -30,12 +30,6 @@
import UIKit import UIKit
@objc(ToolbarAlignment)
public enum ToolbarAlignment: Int {
case top
case bottom
}
open class PresenterCard: Card { open class PresenterCard: Card {
/// A reference to the presenterView. /// A reference to the presenterView.
@IBInspectable @IBInspectable
...@@ -45,33 +39,20 @@ open class PresenterCard: Card { ...@@ -45,33 +39,20 @@ open class PresenterCard: Card {
} }
} }
/// An ImageCardToolbarAlignment value.
open var toolbarAlignment = ToolbarAlignment.bottom {
didSet {
layoutSubviews()
}
}
open override func layout() { open override func layout() {
guard let pv = presenterView else {
super.layout()
return
}
var format = "V:|" var format = "V:|"
var views = [String: Any]() var views = [String: Any]()
format += "[presenterView]"
views["presenterView"] = pv
layout(pv).horizontally()
if let v = toolbar { if let v = toolbar {
pv.layout(v).horizontally().bottom() format += "[toolbar]"
if .top == toolbarAlignment { views["toolbar"] = v
pv.layout(v).top() layout(v).horizontally().height(v.height)
} else { }
pv.layout(v).bottom()
} if let v = presenterView {
format += "[presenterView]"
views["presenterView"] = v
layout(v).horizontally()
} }
if let v = contentView { if let v = contentView {
...@@ -83,7 +64,7 @@ open class PresenterCard: Card { ...@@ -83,7 +64,7 @@ open class PresenterCard: Card {
if let v = bottomBar { if let v = bottomBar {
format += "[bottomBar]" format += "[bottomBar]"
views["bottomBar"] = v views["bottomBar"] = v
layout(v).horizontally() layout(v).horizontally().height(v.height)
} }
guard 0 < views.count else { guard 0 < views.count else {
...@@ -95,11 +76,5 @@ open class PresenterCard: Card { ...@@ -95,11 +76,5 @@ open class PresenterCard: Card {
metrics["bottom"] = contentEdgeInsets.bottom metrics["bottom"] = contentEdgeInsets.bottom
addConstraints(Layout.constraint(format: "\(format)|", options: [], metrics: metrics, views: views)) addConstraints(Layout.constraint(format: "\(format)|", options: [], metrics: metrics, views: views))
presenterView?.zPosition = 0
toolbar?.zPosition = 1000
visualLayer.zPosition = 1
contentView?.zPosition = 2
bottomBar?.zPosition = 2
} }
} }
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