Commit f59dc603 by Daniel Dahan

updated README with CardView example 3

parent f8d2977c
...@@ -27,9 +27,9 @@ class ViewController: UIViewController { ...@@ -27,9 +27,9 @@ class ViewController: UIViewController {
// Examples of using CardView. // Examples of using CardView.
// Uncomment different examples and read // Uncomment different examples and read
// the comments below. // the comments below.
// prepareGeneralCardView() // prepareGeneralCardViewExample()
// prepareCardViewWithoutDivider() // prepareCardViewWithoutPulseBackgroundImageExample()
prepareCardViewWithBackgroundImage() prepareCardViewWithAlteredAlignmentExample()
} }
/** /**
...@@ -41,10 +41,10 @@ class ViewController: UIViewController { ...@@ -41,10 +41,10 @@ class ViewController: UIViewController {
} }
/** /**
:name: prepareGeneralCardView :name: prepareGeneralCardViewExample
:description: General usage example. :description: General usage example.
*/ */
private func prepareGeneralCardView() { private func prepareGeneralCardViewExample() {
let cardView: CardView = CardView() let cardView: CardView = CardView()
// Title label. // Title label.
...@@ -88,24 +88,30 @@ class ViewController: UIViewController { ...@@ -88,24 +88,30 @@ class ViewController: UIViewController {
} }
/** /**
:name: prepareCardViewWithoutDivider :name: prepareCardViewWithoutPulseBackgroundImageExample
:description: An example of the CardView without the divider line between buttons. :description: An example of the CardView without the pulse animation and an added background image.
*/ */
private func prepareCardViewWithoutDivider() { private func prepareCardViewWithoutPulseBackgroundImageExample() {
let cardView: CardView = CardView() let cardView: CardView = CardView()
cardView.divider = false cardView.divider = false
cardView.backgroundColor = MaterialColor.teal.darken1 cardView.backgroundColor = MaterialColor.red.darken1
cardView.pulseScale = false
cardView.pulseColor = nil
// Image.
cardView.image = UIImage(named: "iTunesArtwork")?.resize(toWidth: 400)
cardView.contentsGravity = .BottomRight
// Title label. // Title label.
let titleLabel: UILabel = UILabel() let titleLabel: UILabel = UILabel()
titleLabel.text = "Data-Driven" titleLabel.text = "MaterialKit"
titleLabel.textColor = MaterialColor.white titleLabel.textColor = MaterialColor.white
titleLabel.font = RobotoFont.mediumWithSize(24) titleLabel.font = RobotoFont.mediumWithSize(24)
cardView.titleLabel = titleLabel cardView.titleLabel = titleLabel
// Detail label // Detail label
let detailLabel: UILabel = UILabel() let detailLabel: UILabel = UILabel()
detailLabel.text = "Build scalable data-driven apps with GraphKit." detailLabel.text = "Build beautiful software."
detailLabel.textColor = MaterialColor.white detailLabel.textColor = MaterialColor.white
detailLabel.numberOfLines = 0 detailLabel.numberOfLines = 0
cardView.detailLabel = detailLabel cardView.detailLabel = detailLabel
...@@ -119,8 +125,8 @@ class ViewController: UIViewController { ...@@ -119,8 +125,8 @@ class ViewController: UIViewController {
btn1.setImage(img1, forState: .Normal) btn1.setImage(img1, forState: .Normal)
btn1.setImage(img1, forState: .Highlighted) btn1.setImage(img1, forState: .Highlighted)
// Add buttons to right side. // Add buttons to left side.
cardView.rightButtons = [btn1] cardView.leftButtons = [btn1]
// To support orientation changes, use MaterialLayout. // To support orientation changes, use MaterialLayout.
view.addSubview(cardView) view.addSubview(cardView)
...@@ -130,10 +136,10 @@ class ViewController: UIViewController { ...@@ -130,10 +136,10 @@ class ViewController: UIViewController {
} }
/** /**
:name: prepareCardViewWithBackgroundImage :name: prepareCardViewWithAlteredAlignmentExample
:description: An example of the CardView with a background image. :description: An example of the CardView with an altered alignment of the UI elements.
*/ */
private func prepareCardViewWithBackgroundImage() { private func prepareCardViewWithAlteredAlignmentExample() {
let cardView: CardView = CardView() let cardView: CardView = CardView()
cardView.dividerInsetsRef.left = 100 cardView.dividerInsetsRef.left = 100
cardView.titleLabelInsetsRef.left = 100 cardView.titleLabelInsetsRef.left = 100
......
...@@ -24,10 +24,18 @@ Right out of the box to a fully customized configuration, CardView always stands ...@@ -24,10 +24,18 @@ Right out of the box to a fully customized configuration, CardView always stands
![MaterialKitCardView](http://www.materialkit.io/MK/MaterialKitCardView.gif) ![MaterialKitCardView](http://www.materialkit.io/MK/MaterialKitCardView.gif)
![MaterialKitCardViewDataDriven](http://www.materialkit.io/MK/MaterialKitCardViewDataDriven.gif) Easily remove the pulse animation and add a background image for an entirely new feel.
![MaterialKitCardViewFavorite](http://www.materialkit.io/MK/MaterialKitCardViewFavorite.gif)
Adjust the alignment of the UI elements to create different configurations of the CardView.
![MaterialKitCardViewFocus](http://www.materialkit.io/MK/MaterialKitCardViewFocus.gif) ![MaterialKitCardViewFocus](http://www.materialkit.io/MK/MaterialKitCardViewFocus.gif)
### ImageCardView
Bold and attractive, ImageCardView is
### License ### License
[AGPL-3.0](http://choosealicense.com/licenses/agpl-3.0/) [AGPL-3.0](http://choosealicense.com/licenses/agpl-3.0/)
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