Skip to content

M
Material
Commit b1f97f5c by Daniel Dahan
Options

development: reworking internals for Cards

parent 71b92d5c
Showing with 161 additions and 142 deletions
Examples/Programmatic/Card/Card/ViewController.swift
......@@ -68,6 +68,7 @@ class ViewController: UIViewController {
dateFormatter.dateStyle = .medium
dateFormatter.timeStyle = .none
}
private func prepareDateLabel() {
dateLabel = UILabel()
dateLabel.font = RobotoFont.regular(with: 12)
......
Examples/Programmatic/ImageCard/ImageCard/Assets.xcassets/frontier.imageset/frontier.jpg
This image diff could not be displayed because it is too large. You can view the blob instead.
Examples/Programmatic/ImageCard/ImageCard/ViewController.swift
......@@ -32,95 +32,76 @@ import UIKit
import Material
class ViewController: UIViewController {
private var card: ImageCard!
/// Conent area.
private var imageView: UIImageView!
private var contentView: UILabel!
/// Bottom Bar views.
private var bottomBar: Bar!
private var favoriteButton: FlatButton!
private var shareButton: FlatButton!
private var starButton: FlatButton!
/// Toolbar views.
private var toolbar: Toolbar!
private var moreButton: IconButton!
/// View.
internal var imageCard: ImageCard!
override func viewDidLoad() {
super.viewDidLoad()
view.backgroundColor = Color.grey.lighten5
prepareImageView()
prepareFavoriteButton()
prepareShareButton()
prepareStarButton()
prepareMoreButton()
// Prepare view.
prepareImageCard()
}
}
/// ImageCard.
extension ViewController {
internal func prepareImageCard() {
imageCard = ImageCard()
view.layout(imageCard).horizontally(left: 20, right: 20).center()
prepareToolbar()
prepareImageView()
prepareContentView()
prepareBottomBar()
prepareImageCard()
}
private func prepareImageView() {
imageView = UIImageView()
imageView.image = UIImage(named: "frontier.jpg")?.resize(toWidth: view.width)
imageView.contentMode = .scaleAspectFill
}
private func prepareFavoriteButton() {
favoriteButton = FlatButton(image: Icon.favorite, tintColor: Color.blueGrey.base)
}
private func prepareShareButton() {
shareButton = FlatButton(image: Icon.cm.share, tintColor: Color.blueGrey.base)
}
private func prepareStarButton() {
starButton = FlatButton(image: Icon.cm.star, tintColor: Color.blueGrey.base)
}
private func prepareMoreButton() {
moreButton = IconButton(image: Icon.cm.moreHorizontal, tintColor: .white)
}
private func prepareToolbar() {
toolbar = Toolbar()
toolbar.backgroundColor = nil
imageCard.toolbar = Toolbar()
imageCard.toolbar?.backgroundColor = .clear
imageCard.toolbarEdgeInsetsPreset = .square3
toolbar.title = "CosmicMind"
toolbar.titleLabel.textColor = .white
// Use the property subscript to access the model data.
imageCard.toolbar?.title = "Graph"
imageCard.toolbar?.titleLabel.textColor = .white
toolbar.detail = "Build Beautiful Software"
toolbar.detailLabel.textColor = .white
imageCard.toolbar?.detail = "Build Data-Driven Software"
imageCard.toolbar?.detailLabel.textColor = .white
}
private func prepareContentView() {
contentView = UILabel()
contentView.numberOfLines = 0
contentView.text = "Build beautiful applications that are intelligently driven using Material, Graph, and Algorithm."
contentView.font = RobotoFont.regular(with: 14)
private func prepareImageView() {
imageCard.imageView = UIImageView()
imageCard.imageView?.image = UIImage(named: "frontier.jpg")?.resize(toWidth: view.width)
}
private func prepareBottomBar() {
bottomBar = Bar(centerViews: [favoriteButton, shareButton, starButton])
private func prepareContentView() {
let label = UILabel()
label.numberOfLines = 0
label.text = "Graph is a semantic database that is used to create data-driven applications."
label.font = RobotoFont.regular(with: 14)
imageCard.contentView = label
imageCard.contentViewEdgeInsetsPreset = .square3
}
private func prepareImageCard() {
card = ImageCard()
card.imageView = imageView
card.toolbar = toolbar
card.toolbarEdgeInsetsPreset = .square3
private func prepareBottomBar() {
let shareButton = IconButton(image: Icon.cm.share, tintColor: Color.blueGrey.base)
let favoriteButton = IconButton(image: Icon.favorite, tintColor: Color.red.base)
card.contentView = contentView
card.contentViewEdgeInsetsPreset = .square3
let label = UILabel()
label.text = "CosmicMind"
label.textAlignment = .center
label.textColor = Color.blueGrey.base
label.font = RobotoFont.regular(with: 12)
card.bottomBar = bottomBar
imageCard.bottomBar = Bar()
imageCard.bottomBarEdgeInsetsPreset = .wideRectangle2
imageCard.bottomBarEdgeInsets.top = 0
imageCard.bottomBar?.contentViewAlignment = .center
view.layout(card).horizontally(left: 20, right: 20).center()
imageCard.bottomBar?.leftViews = [favoriteButton]
imageCard.bottomBar?.centerViews = [label]
imageCard.bottomBar?.rightViews = [shareButton]
}
}
Examples/Programmatic/Layer/Layer/ViewController.swift
......@@ -49,7 +49,7 @@ class ViewController: UIViewController {
layer = Layer(frame: CGRect(x: (w - d) / 2, y: (h - d) / 2, width: d, height: d))
layer.depthPreset = .depth3
layer.shapePreset = .circle
layer.bgColor = .white
layer.backgroundColor = Color.white.cgColor
layer.image = UIImage(named: "CosmicMind")
view.layer.addSublayer(layer)
......
Examples/Programmatic/TabBar/TabBar/ViewController.swift
......@@ -55,6 +55,30 @@ class ViewController: UIViewController {
let btn3 = FlatButton(title: "Video", titleColor: Color.blueGrey.base)
btn3.pulseAnimation = .none
buttons.append(btn3)
let btn4 = FlatButton(title: "Video", titleColor: Color.blueGrey.base)
btn4.pulseAnimation = .none
buttons.append(btn4)
let btn5 = FlatButton(title: "Video 1", titleColor: Color.blueGrey.base)
btn5.pulseAnimation = .none
buttons.append(btn5)
//
// let btn6 = FlatButton(title: "Video 2", titleColor: Color.blueGrey.base)
// btn6.pulseAnimation = .none
// buttons.append(btn6)
//
// let btn7 = FlatButton(title: "Video 3", titleColor: Color.blueGrey.base)
// btn7.pulseAnimation = .none
// buttons.append(btn7)
//
// let btn8 = FlatButton(title: "Video 4", titleColor: Color.blueGrey.base)
// btn8.pulseAnimation = .none
// buttons.append(btn8)
//
// let btn9 = FlatButton(title: "Video 5", titleColor: Color.blueGrey.base)
// btn9.pulseAnimation = .none
// buttons.append(btn9)
}
private func prepareTabBar() {
......
Sources/iOS/Bar.swift
......@@ -125,15 +125,12 @@ open class Bar: View {
}
/// Center UIViews.
open var centerViews: [UIView] {
get {
return contentView.grid.views
}
set(value) {
for v in contentView.grid.views {
open var centerViews = [UIView]() {
didSet {
for v in oldValue {
v.removeFromSuperview()
}
contentView.grid.views = value
layoutSubviews()
}
}
......@@ -168,12 +165,13 @@ open class Bar: View {
- Parameter centerViews: An Array of UIViews that go in the center.
*/
public init(leftViews: [UIView]? = nil, rightViews: [UIView]? = nil, centerViews: [UIView]? = nil) {
super.init(frame: .zero)
self.leftViews = leftViews ?? []
self.rightViews = rightViews ?? []
super.init(frame: .zero)
self.centerViews = centerViews ?? []
frame.size = intrinsicContentSize
}
open override func layoutSubviews() {
super.layoutSubviews()
guard willLayout else {
......@@ -224,6 +222,7 @@ open class Bar: View {
}
contentView.grid.begin()
contentView.grid.views = centerViews
if .center == contentViewAlignment {
if lc < rc {
......
Sources/iOS/Button.swift
......@@ -79,7 +79,7 @@ open class Button: UIButton {
@IBInspectable
open override var backgroundColor: UIColor? {
didSet {
layer.bgColor = backgroundColor
layer.backgroundColor = backgroundColor?.cgColor
}
}
......@@ -192,6 +192,8 @@ open class Button: UIButton {
}
Animation.pulseContractAnimation(layer: s.layer, visualLayer: s.visualLayer, pulse: &s.pulse)
}
bringImageViewToFront()
}
/**
......@@ -203,6 +205,8 @@ open class Button: UIButton {
open override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
super.touchesBegan(touches, with: event)
Animation.pulseExpandAnimation(layer: layer, visualLayer: visualLayer, point: layer.convert(touches.first!.location(in: self), from: layer), width: width, height: height, pulse: &pulse)
bringImageViewToFront()
}
/**
......@@ -227,6 +231,14 @@ open class Button: UIButton {
Animation.pulseContractAnimation(layer: layer, visualLayer: visualLayer, pulse: &pulse)
}
open func bringImageViewToFront() {
guard let v = imageView else {
return
}
bringSubview(toFront: v)
}
/**
Prepares the view instance when intialized. When subclassing,
it is recommended to override the prepare method
......
Sources/iOS/CapturePreview.swift
......@@ -70,7 +70,7 @@ open class CapturePreview: View {
/// Prepares the previewLayer.
private func preparePreviewLayer() {
layer.bgColor = .black
layer.backgroundColor = Color.black.cgColor
layer.masksToBounds = true
(layer as! AVCaptureVideoPreviewLayer).videoGravity = AVLayerVideoGravityResizeAspectFill
}
......
Sources/iOS/Card.swift
......@@ -178,7 +178,7 @@ open class Card: PulseView {
/// Reloads the layout.
open func reload() {
// Clear constraints so new ones do not conflict.
container.removeConstraints(constraints)
container.removeConstraints(container.constraints)
for v in container.subviews {
v.removeFromSuperview()
}
......@@ -193,9 +193,7 @@ open class Card: PulseView {
format += "-(toolbarTop)-[toolbar]-(toolbarBottom)"
views["toolbar"] = v
container.layout(v).horizontally(left: toolbarEdgeInsets.left, right: toolbarEdgeInsets.right).height(v.height)
v.grid.reload()
v.divider.reload()
container.layout(v).horizontally(left: toolbarEdgeInsets.left, right: toolbarEdgeInsets.right)
}
if let v = contentView {
......@@ -211,6 +209,7 @@ open class Card: PulseView {
views["contentView"] = v
container.layout(v).horizontally(left: contentViewEdgeInsets.left, right: contentViewEdgeInsets.right)
v.grid.reload()
v.divider.reload()
}
......@@ -230,9 +229,7 @@ open class Card: PulseView {
}
views["bottomBar"] = v
container.layout(v).horizontally(left: bottomBarEdgeInsets.left, right: bottomBarEdgeInsets.right).height(v.height)
v.grid.reload()
v.divider.reload()
container.layout(v).horizontally(left: bottomBarEdgeInsets.left, right: bottomBarEdgeInsets.right)
}
guard 0 < views.count else {
......
Sources/iOS/CollectionReusableView.swift
......@@ -186,7 +186,7 @@ open class CollectionReusableView: UICollectionReusableView {
/// A property that accesses the backing layer's background
@IBInspectable open override var backgroundColor: UIColor? {
didSet {
layer.bgColor = backgroundColor
layer.backgroundColor = backgroundColor?.cgColor
}
}
......
Sources/iOS/CollectionViewCell.swift
......@@ -193,7 +193,7 @@ open class CollectionViewCell: UICollectionViewCell {
@IBInspectable
open override var backgroundColor: UIColor? {
didSet {
layer.bgColor = backgroundColor
layer.backgroundColor = backgroundColor?.cgColor
}
}
......
Sources/iOS/Font.swift
......@@ -32,31 +32,31 @@ import UIKit
public protocol FontType {}
public struct Font: FontType {
public struct Font {
/// Size of font.
public static let pointSize: CGFloat = 16
/**
Retrieves the system font with a specified size.
- Parameter fontName: A String font name.
- Parameter ofSize size: A CGFloat.
*/
public static func systemFontWithSize(size: CGFloat) -> UIFont {
public static func systemFont(ofSize size: CGFloat) -> UIFont {
return UIFont.systemFont(ofSize: size)
}
/**
Retrieves the bold system font with a specified size..
- Parameter fontName: A String font name.
- Parameter ofSize size: A CGFloat.
*/
public static func boldSystemFontWithSize(size: CGFloat) -> UIFont {
public static func boldSystemFont(ofSize size: CGFloat) -> UIFont {
return UIFont.boldSystemFont(ofSize: size)
}
/**
Retrieves the italic system font with a specified size.
- Parameter fontName: A String font name.
- Parameter ofSize size: A CGFloat.
*/
public static func italicSystemFontWithSize(size: CGFloat) -> UIFont {
public static func italicSystemFont(ofSize size: CGFloat) -> UIFont {
return UIFont.italicSystemFont(ofSize: size)
}
......
Sources/iOS/ImageCard.swift
......@@ -74,7 +74,7 @@ open class ImageCard: Card {
}
// Clear constraints so new ones do not conflict.
container.removeConstraints(constraints)
container.removeConstraints(container.constraints)
for v in container.subviews {
v.removeFromSuperview()
}
......@@ -89,18 +89,16 @@ open class ImageCard: Card {
format += "-(imageViewTop)-[imageView]-(imageViewBottom)"
views["imageView"] = iv
container.layout(iv).horizontally(left: imageViewEdgeInsets.left, right: imageViewEdgeInsets.right)
iv.grid.reload()
iv.divider.reload()
if let v = toolbar {
iv.layout(v).horizontally(left: toolbarEdgeInsets.left, right: toolbarEdgeInsets.right).height(v.height)
iv.layoutIfNeeded()
if .top == toolbarAlignment {
iv.layout(v).top(toolbarEdgeInsets.top)
} else {
iv.layout(v).bottom(toolbarEdgeInsets.bottom)
}
v.grid.reload()
v.divider.reload()
container.layout(v)
.horizontally(left: toolbarEdgeInsets.left, right: toolbarEdgeInsets.right)
.top(.top == toolbarAlignment ? toolbarEdgeInsets.top : iv.height - v.height - toolbarEdgeInsets.bottom)
}
if let v = contentView {
......@@ -110,6 +108,7 @@ open class ImageCard: Card {
format += "-[contentView]-(contentViewBottom)"
views["contentView"] = v
container.layout(v).horizontally(left: contentViewEdgeInsets.left, right: contentViewEdgeInsets.right)
v.grid.reload()
v.divider.reload()
}
......@@ -126,9 +125,7 @@ open class ImageCard: Card {
}
views["bottomBar"] = v
container.layout(v).horizontally(left: bottomBarEdgeInsets.left, right: bottomBarEdgeInsets.right).height(v.height)
v.grid.reload()
v.divider.reload()
container.layout(v).horizontally(left: bottomBarEdgeInsets.left, right: bottomBarEdgeInsets.right)
}
guard 0 < views.count else {
......
Sources/iOS/Material+CALayer.swift
......@@ -248,16 +248,6 @@ extension CALayer {
}
}
/// A UIColor reference to the `backgroundColor`.
open var bgColor: UIColor? {
get {
return nil == backgroundColor ? nil : UIColor(cgColor: backgroundColor!)
}
set(value) {
backgroundColor = bgColor?.cgColor
}
}
/**
A method that accepts CAAnimation objects and executes them on the
view's backing layer.
......
Sources/iOS/NavigationBar.swift
......@@ -220,6 +220,8 @@ open class NavigationBar: UINavigationBar {
}
item.contentView.grid.begin()
item.contentView.grid.views = item.centerViews
if .center == item.contentViewAlignment {
if lc < rc {
item.contentView.grid.columns = columns - 2 * rc
......
Sources/iOS/NavigationItem.swift
......@@ -57,6 +57,9 @@ public class NavigationItem: NSObject {
/// Left items.
public var leftViews = [UIView]() {
didSet {
for v in oldValue {
v.removeFromSuperview()
}
navigationBar?.layoutSubviews()
}
}
......@@ -64,6 +67,9 @@ public class NavigationItem: NSObject {
/// Right items.
public var rightViews = [UIView]() {
didSet {
for v in oldValue {
v.removeFromSuperview()
}
navigationBar?.layoutSubviews()
}
}
......@@ -71,6 +77,9 @@ public class NavigationItem: NSObject {
/// Center items.
public var centerViews = [UIView]() {
didSet {
for v in oldValue {
v.removeFromSuperview()
}
navigationBar?.layoutSubviews()
}
}
......@@ -205,13 +214,10 @@ extension UINavigationItem {
/// Center UIViews.
open var centerViews: [UIView] {
get {
return navigationItem.contentView.grid.views
return navigationItem.centerViews
}
set(value) {
for v in navigationItem.contentView.grid.views {
v.removeFromSuperview()
}
navigationItem.contentView.grid.views = value
navigationItem.centerViews = value
}
}
}
Sources/iOS/PresenterCard.swift
......@@ -56,7 +56,7 @@ open class PresenterCard: Card {
open override func reload() {
// Clear constraints so new ones do not conflict.
container.removeConstraints(constraints)
container.removeConstraints(container.constraints)
for v in container.subviews {
v.removeFromSuperview()
}
......@@ -71,9 +71,7 @@ open class PresenterCard: Card {
format += "-(toolbarTop)-[toolbar]-(toolbarBottom)"
views["toolbar"] = v
container.layout(v).horizontally(left: toolbarEdgeInsets.left, right: toolbarEdgeInsets.right).height(v.height)
v.grid.reload()
v.divider.reload()
container.layout(v).horizontally(left: toolbarEdgeInsets.left, right: toolbarEdgeInsets.right)
}
if let v = presenterView {
......@@ -89,6 +87,7 @@ open class PresenterCard: Card {
views["presenterView"] = v
container.layout(v).horizontally(left: presenterViewEdgeInsets.left, right: presenterViewEdgeInsets.right)
v.grid.reload()
v.divider.reload()
}
......@@ -109,6 +108,7 @@ open class PresenterCard: Card {
views["contentView"] = v
container.layout(v).horizontally(left: contentViewEdgeInsets.left, right: contentViewEdgeInsets.right)
v.grid.reload()
v.divider.reload()
}
......@@ -131,9 +131,7 @@ open class PresenterCard: Card {
}
views["bottomBar"] = v
container.layout(v).horizontally(left: bottomBarEdgeInsets.left, right: bottomBarEdgeInsets.right).height(v.height)
v.grid.reload()
v.divider.reload()
container.layout(v).horizontally(left: bottomBarEdgeInsets.left, right: bottomBarEdgeInsets.right)
}
guard 0 < views.count else {
......
Sources/iOS/PulseAnimation.swift
......@@ -66,6 +66,8 @@ internal extension Animation {
bLayer.addSublayer(pLayer)
pulse.layers.insert(bLayer, at: 0)
visualLayer.addSublayer(bLayer)
bLayer.zPosition = 0
pLayer.zPosition = 0
visualLayer.masksToBounds = !(.centerRadialBeyondBounds == pulse.animation || .radialBeyondBounds == pulse.animation)
......@@ -81,7 +83,7 @@ internal extension Animation {
}
pLayer.cornerRadius = n / 2
pLayer.bgColor = pulse.color.withAlphaComponent(pulse.opacity)
pLayer.backgroundColor = pulse.color.withAlphaComponent(pulse.opacity).cgColor
pLayer.transform = CATransform3DMakeAffineTransform(CGAffineTransform(scaleX: 0, y: 0))
})
......
Sources/iOS/RobotoFont.swift
......@@ -68,10 +68,12 @@ public struct RobotoFont: FontType {
*/
public static func thin(with size: CGFloat) -> UIFont {
Font.loadFontIfNeeded(name: "Roboto-Thin")
if let f = UIFont(name: "Roboto-Thin", size: size) {
if let f = UIFont(name: "Roboto-Thin", size: size) {
return f
}
return Font.systemFontWithSize(size: size)
return Font.systemFont(ofSize: size)
}
/**
......@@ -81,10 +83,12 @@ public struct RobotoFont: FontType {
*/
public static func light(with size: CGFloat) -> UIFont {
Font.loadFontIfNeeded(name: "Roboto-Light")
if let f = UIFont(name: "Roboto-Light", size: size) {
if let f = UIFont(name: "Roboto-Light", size: size) {
return f
}
return Font.systemFontWithSize(size: size)
return Font.systemFont(ofSize: size)
}
/**
......@@ -94,10 +98,12 @@ public struct RobotoFont: FontType {
*/
public static func regular(with size: CGFloat) -> UIFont {
Font.loadFontIfNeeded(name: "Roboto-Regular")
if let f = UIFont(name: "Roboto-Regular", size: size) {
if let f = UIFont(name: "Roboto-Regular", size: size) {
return f
}
return Font.systemFontWithSize(size: size)
return Font.systemFont(ofSize: size)
}
/**
......@@ -107,10 +113,12 @@ public struct RobotoFont: FontType {
*/
public static func medium(with size: CGFloat) -> UIFont {
Font.loadFontIfNeeded(name: "Roboto-Medium")
if let f = UIFont(name: "Roboto-Medium", size: size) {
if let f = UIFont(name: "Roboto-Medium", size: size) {
return f
}
return Font.boldSystemFontWithSize(size: size)
return Font.boldSystemFont(ofSize: size)
}
/**
......@@ -120,9 +128,11 @@ public struct RobotoFont: FontType {
*/
public static func bold(with size: CGFloat) -> UIFont {
Font.loadFontIfNeeded(name: "Roboto-Bold")
if let f = UIFont(name: "Roboto-Bold", size: size) {
if let f = UIFont(name: "Roboto-Bold", size: size) {
return f
}
return Font.boldSystemFontWithSize(size: size)
return Font.boldSystemFont(ofSize: size)
}
}
Sources/iOS/TableViewCell.swift
......@@ -78,7 +78,7 @@ open class TableViewCell: UITableViewCell {
@IBInspectable
open override var backgroundColor: UIColor? {
didSet {
layer.bgColor = backgroundColor
layer.backgroundColor = backgroundColor?.cgColor
}
}
......
Sources/iOS/TextView.swift
......@@ -38,7 +38,7 @@ public class TextView: UITextView {
/// A property that accesses the backing layer's background
@IBInspectable public override var backgroundColor: UIColor? {
didSet {
layer.bgColor = backgroundColor
layer.backgroundColor = backgroundColor?.cgColor
}
}
......
Sources/iOS/View.swift
......@@ -120,7 +120,7 @@ open class View: UIView {
@IBInspectable
open override var backgroundColor: UIColor? {
didSet {
layer.bgColor = backgroundColor
layer.backgroundColor = backgroundColor?.cgColor
}
}
......
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