Commit 5a342f4a by Daniel Dahan

updated README with example 4 for CardView

parent 8b24655c
......@@ -29,7 +29,8 @@ class ViewController: UIViewController {
// the comments below.
// prepareGeneralCardViewExample()
// prepareCardViewWithoutPulseBackgroundImageExample()
prepareCardViewWithAlteredAlignmentExample()
// prepareCardViewWithAlteredAlignmentExample()
prepareCardViewButtonBar()
}
/**
......@@ -50,7 +51,7 @@ class ViewController: UIViewController {
// Title label.
let titleLabel: UILabel = UILabel()
titleLabel.text = "Welcome Back!"
titleLabel.textColor = MaterialColor.teal.darken1
titleLabel.textColor = MaterialColor.blue.darken1
titleLabel.font = RobotoFont.mediumWithSize(20)
cardView.titleLabel = titleLabel
......@@ -62,19 +63,19 @@ class ViewController: UIViewController {
// Yes button.
let btn1: FlatButton = FlatButton()
btn1.pulseColor = MaterialColor.teal.lighten1
btn1.pulseColor = MaterialColor.blue.lighten1
btn1.pulseFill = true
btn1.pulseScale = false
btn1.setTitle("YES", forState: .Normal)
btn1.setTitleColor(MaterialColor.teal.darken1, forState: .Normal)
btn1.setTitleColor(MaterialColor.blue.darken1, forState: .Normal)
// No button.
let btn2: FlatButton = FlatButton()
btn2.pulseColor = MaterialColor.teal.lighten1
btn2.pulseColor = MaterialColor.blue.lighten1
btn2.pulseFill = true
btn2.pulseScale = false
btn2.setTitle("NO", forState: .Normal)
btn2.setTitleColor(MaterialColor.teal.darken1, forState: .Normal)
btn2.setTitleColor(MaterialColor.blue.darken1, forState: .Normal)
// Add buttons to left side.
cardView.leftButtons = [btn1, btn2]
......@@ -147,7 +148,7 @@ class ViewController: UIViewController {
cardView.pulseColor = MaterialColor.teal.lighten4
// Image.
cardView.image = UIImage(named: "GraphKit")?.resize(toWidth: 300)
cardView.image = UIImage(named: "GraphKit")
cardView.contentsGravity = .TopLeft
// Title label.
......@@ -179,5 +180,54 @@ class ViewController: UIViewController {
MaterialLayout.alignFromTop(view, child: cardView, top: 100)
MaterialLayout.alignToParentHorizontally(view, child: cardView, left: 20, right: 20)
}
/**
:name: prepareCardViewButtonBar
:description: An example of the CardView with only buttons to create a button bar.
*/
private func prepareCardViewButtonBar() {
let cardView: CardView = CardView()
cardView.divider = false
cardView.pulseColor = nil
cardView.pulseScale = false
cardView.backgroundColor = MaterialColor.blueGrey.darken4
// Favorite button.
let img1: UIImage? = UIImage(named: "ic_search_white")
let btn1: FlatButton = FlatButton()
btn1.pulseColor = MaterialColor.white
btn1.pulseFill = true
btn1.pulseScale = false
btn1.setImage(img1, forState: .Normal)
btn1.setImage(img1, forState: .Highlighted)
// BUTTON 1 button.
let btn2: FlatButton = FlatButton()
btn2.pulseColor = MaterialColor.teal.lighten3
btn2.pulseFill = true
btn2.pulseScale = false
btn2.setTitle("BUTTON 1", forState: .Normal)
btn2.setTitleColor(MaterialColor.teal.lighten3, forState: .Normal)
// BUTTON 2 button.
let btn3: FlatButton = FlatButton()
btn3.pulseColor = MaterialColor.teal.lighten3
btn3.pulseFill = true
btn3.pulseScale = false
btn3.setTitle("BUTTON 2", forState: .Normal)
btn3.setTitleColor(MaterialColor.teal.lighten3, forState: .Normal)
// Add buttons to left side.
cardView.leftButtons = [btn1]
// Add buttons to right side.
cardView.rightButtons = [btn2, btn3]
// To support orientation changes, use MaterialLayout.
view.addSubview(cardView)
cardView.translatesAutoresizingMaskIntoConstraints = false
MaterialLayout.alignFromTop(view, child: cardView, top: 100)
MaterialLayout.alignToParentHorizontally(view, child: cardView, left: 20, right: 20)
}
}
......@@ -240,7 +240,7 @@ class ViewController: UIViewController {
let navigationBarView: NavigationBarView = NavigationBarView()
// Stylize.
navigationBarView.backgroundColor = MaterialColor.blue.darken1
navigationBarView.backgroundColor = MaterialColor.indigo.darken1
// To lighten the status bar add the "View controller-based status bar appearance = NO"
// to you info.plist file and set the following property.
......
......@@ -32,6 +32,10 @@ Adjust the alignment of the UI elements to create different configurations of th
![MaterialKitCardViewDataDriven](http://www.materialkit.io/MK/MaterialKitCardViewDataDriven.gif)
CardViews are so flexible they create entirely new components by removing all but certain elements. For example, bellow is a button bar by only setting the button values of the CardView.
![MaterialKitCardViewButtonBar](http://www.materialkit.io/MK/MaterialKitCardViewButtonBar.gif)
### ImageCardView
Bold and attractive, ImageCardView is
......
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