Skip to content

M
Material
Commit 884b03ab by Daniel Dahan
Options

updated pulse animation

parent af8066c7
Showing with 208 additions and 178 deletions
Examples/Programmatic/CardView/CardView/Assets.xcassets/GraphKit.imageset/Contents.json → Examples/Programmatic/CardView/CardView/Assets.xcassets/Graph.imageset/Contents.json
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"images" : [ "images" : [
{ {
"idiom" : "universal", "idiom" : "universal",
"filename" : "GraphKit.png", "filename" : "Graph.png",
"scale" : "1x" "scale" : "1x"
}, },
{ {
......
Examples/Programmatic/CardView/CardView/ViewController.swift
...@@ -41,7 +41,7 @@ class ViewController: UIViewController { ...@@ -41,7 +41,7 @@ class ViewController: UIViewController {
// the comments below. // the comments below.
prepareGeneralCardViewExample() prepareGeneralCardViewExample()
// prepareCardViewWithoutPulseBackgroundImageExample() // prepareCardViewWithoutPulseBackgroundImageExample()
// prepareCardViewWithAlteredAlignmentExample() // prepareCardViewWithPulseBackgroundImageExample()
// prepareCardViewButtonBarExample() // prepareCardViewButtonBarExample()
} }
...@@ -145,41 +145,42 @@ class ViewController: UIViewController { ...@@ -145,41 +145,42 @@ class ViewController: UIViewController {
} }
/** /**
:name: prepareCardViewWithAlteredAlignmentExample :name: prepareCardViewWithPulseBackgroundImageExample
:description: An example of the CardView with an altered alignment of the UI elements. :description: An example of the CardView with the pulse animation and an added background image.
*/ */
private func prepareCardViewWithAlteredAlignmentExample() { private func prepareCardViewWithPulseBackgroundImageExample() {
let cardView: CardView = CardView() let cardView: CardView = CardView()
cardView.dividerInset.left = 100 cardView.backgroundColor = MaterialColor.blue.base
cardView.titleLabelInset.left = 100 cardView.divider = false
cardView.detailLabelInset.left = 100
cardView.pulseColor = MaterialColor.teal.lighten4
// Image. // Image.
cardView.image = UIImage(named: "GraphKit")?.resize(toHeight: 100) cardView.image = UIImage(named: "Graph")?.resize(toHeight: 150)
cardView.contentsGravity = .TopLeft cardView.contentsGravity = .Right
// Title label. // Title label.
let titleLabel: UILabel = UILabel() let titleLabel: UILabel = UILabel()
titleLabel.text = "GraphKit" titleLabel.text = "Graph"
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." detailLabel.text = "Data-Driven Framework"
detailLabel.textColor = MaterialColor.white
detailLabel.numberOfLines = 0 detailLabel.numberOfLines = 0
cardView.detailLabel = detailLabel cardView.detailLabel = detailLabel
// LEARN MORE button. // Favorite button.
let img1: UIImage? = UIImage(named: "ic_favorite_white")
let btn1: FlatButton = FlatButton() let btn1: FlatButton = FlatButton()
btn1.pulseColor = MaterialColor.teal.lighten1 btn1.pulseColor = MaterialColor.white
btn1.pulseScale = false btn1.pulseScale = false
btn1.setTitle("LEARN MORE", forState: .Normal) btn1.setImage(img1, forState: .Normal)
btn1.setTitleColor(MaterialColor.teal.darken1, forState: .Normal) 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)
......
Examples/Programmatic/ImageCardView/ImageCardView.xcodeproj/project.pbxproj
...@@ -11,8 +11,6 @@ ...@@ -11,8 +11,6 @@
967513F01C13EB69009F455A /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 967513EF1C13EB69009F455A /* ViewController.swift */; }; 967513F01C13EB69009F455A /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 967513EF1C13EB69009F455A /* ViewController.swift */; };
967513F51C13EB69009F455A /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 967513F41C13EB69009F455A /* Assets.xcassets */; }; 967513F51C13EB69009F455A /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 967513F41C13EB69009F455A /* Assets.xcassets */; };
967513F81C13EB69009F455A /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 967513F61C13EB69009F455A /* LaunchScreen.storyboard */; }; 967513F81C13EB69009F455A /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 967513F61C13EB69009F455A /* LaunchScreen.storyboard */; };
96FE30331C63ADE900548232 /* Material.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 96FE30321C63ADE900548232 /* Material.framework */; };
96FE30341C63ADE900548232 /* Material.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 96FE30321C63ADE900548232 /* Material.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
/* End PBXBuildFile section */ /* End PBXBuildFile section */
/* Begin PBXCopyFilesBuildPhase section */ /* Begin PBXCopyFilesBuildPhase section */
...@@ -22,7 +20,6 @@ ...@@ -22,7 +20,6 @@
dstPath = ""; dstPath = "";
dstSubfolderSpec = 10; dstSubfolderSpec = 10;
files = ( files = (
96FE30341C63ADE900548232 /* Material.framework in Embed Frameworks */,
); );
name = "Embed Frameworks"; name = "Embed Frameworks";
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
...@@ -36,7 +33,6 @@ ...@@ -36,7 +33,6 @@
967513F41C13EB69009F455A /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; }; 967513F41C13EB69009F455A /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
967513F71C13EB69009F455A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; }; 967513F71C13EB69009F455A /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
967513F91C13EB69009F455A /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; }; 967513F91C13EB69009F455A /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
96FE30321C63ADE900548232 /* Material.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; name = Material.framework; path = "/Users/danieldahan/Library/Developer/Xcode/DerivedData/Material-hbpnflxhoouqxebjcyhbbhqyesjd/Build/Products/Debug-iphoneos/Material.framework"; sourceTree = "<absolute>"; };
/* End PBXFileReference section */ /* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */ /* Begin PBXFrameworksBuildPhase section */
...@@ -44,7 +40,6 @@ ...@@ -44,7 +40,6 @@
isa = PBXFrameworksBuildPhase; isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647; buildActionMask = 2147483647;
files = ( files = (
96FE30331C63ADE900548232 /* Material.framework in Frameworks */,
); );
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
}; };
...@@ -54,7 +49,6 @@ ...@@ -54,7 +49,6 @@
967513E11C13EB69009F455A = { 967513E11C13EB69009F455A = {
isa = PBXGroup; isa = PBXGroup;
children = ( children = (
96FE30321C63ADE900548232 /* Material.framework */,
967513EC1C13EB69009F455A /* ImageCardView */, 967513EC1C13EB69009F455A /* ImageCardView */,
967513EB1C13EB69009F455A /* Products */, 967513EB1C13EB69009F455A /* Products */,
); );
......
Examples/Programmatic/ImageCardView/ImageCardView/ViewController.swift
...@@ -39,8 +39,8 @@ class ViewController: UIViewController { ...@@ -39,8 +39,8 @@ class ViewController: UIViewController {
// Examples of using ImageCardView. // Examples of using ImageCardView.
// Uncomment different examples and read // Uncomment different examples and read
// the comments below. // the comments below.
prepareGeneralImageCardViewExample() // prepareGeneralImageCardViewExample()
// prepareImageCardViewWithoutDetailLabelAndDividerExample() prepareImageCardViewWithoutDetailLabelAndDividerExample()
} }
/** /**
......
Examples/Programmatic/MaterialButton/MaterialButton.xcodeproj/project.pbxproj
...@@ -11,8 +11,6 @@ ...@@ -11,8 +11,6 @@
965E8E741C14A4950035A270 /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 965E8E731C14A4950035A270 /* ViewController.swift */; }; 965E8E741C14A4950035A270 /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 965E8E731C14A4950035A270 /* ViewController.swift */; };
965E8E791C14A4950035A270 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 965E8E781C14A4950035A270 /* Assets.xcassets */; }; 965E8E791C14A4950035A270 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 965E8E781C14A4950035A270 /* Assets.xcassets */; };
965E8E7C1C14A4950035A270 /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 965E8E7A1C14A4950035A270 /* LaunchScreen.storyboard */; }; 965E8E7C1C14A4950035A270 /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 965E8E7A1C14A4950035A270 /* LaunchScreen.storyboard */; };
96FE30391C63B00200548232 /* Material.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 96FE30381C63B00200548232 /* Material.framework */; };
96FE303A1C63B00200548232 /* Material.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 96FE30381C63B00200548232 /* Material.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
/* End PBXBuildFile section */ /* End PBXBuildFile section */
/* Begin PBXCopyFilesBuildPhase section */ /* Begin PBXCopyFilesBuildPhase section */
...@@ -22,7 +20,6 @@ ...@@ -22,7 +20,6 @@
dstPath = ""; dstPath = "";
dstSubfolderSpec = 10; dstSubfolderSpec = 10;
files = ( files = (
96FE303A1C63B00200548232 /* Material.framework in Embed Frameworks */,
); );
name = "Embed Frameworks"; name = "Embed Frameworks";
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
...@@ -36,7 +33,6 @@ ...@@ -36,7 +33,6 @@
965E8E781C14A4950035A270 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; }; 965E8E781C14A4950035A270 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
965E8E7B1C14A4950035A270 /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; }; 965E8E7B1C14A4950035A270 /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
965E8E7D1C14A4950035A270 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; }; 965E8E7D1C14A4950035A270 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
96FE30381C63B00200548232 /* Material.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; name = Material.framework; path = "/Users/danieldahan/Library/Developer/Xcode/DerivedData/Material-hbpnflxhoouqxebjcyhbbhqyesjd/Build/Products/Debug-iphoneos/Material.framework"; sourceTree = "<absolute>"; };
/* End PBXFileReference section */ /* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */ /* Begin PBXFrameworksBuildPhase section */
...@@ -44,7 +40,6 @@ ...@@ -44,7 +40,6 @@
isa = PBXFrameworksBuildPhase; isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647; buildActionMask = 2147483647;
files = ( files = (
96FE30391C63B00200548232 /* Material.framework in Frameworks */,
); );
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
}; };
...@@ -54,7 +49,6 @@ ...@@ -54,7 +49,6 @@
965E8E651C14A4950035A270 = { 965E8E651C14A4950035A270 = {
isa = PBXGroup; isa = PBXGroup;
children = ( children = (
96FE30381C63B00200548232 /* Material.framework */,
965E8E701C14A4950035A270 /* MaterialButton */, 965E8E701C14A4950035A270 /* MaterialButton */,
965E8E6F1C14A4950035A270 /* Products */, 965E8E6F1C14A4950035A270 /* Products */,
); );
......
Examples/Programmatic/MaterialLayer/MaterialLayer/Assets.xcassets/CosmicMindInverted.imageset/Contents.json → Examples/Programmatic/MaterialLayer/MaterialLayer/Assets.xcassets/iTunesArtwork.imageset/Contents.json
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"images" : [ "images" : [
{ {
"idiom" : "universal", "idiom" : "universal",
"filename" : "CosmicMindInverted.png", "filename" : "iTunesArtwork.png",
"scale" : "1x" "scale" : "1x"
}, },
{ {
......
Examples/Programmatic/MaterialLayer/MaterialLayer/ViewController.swift
...@@ -65,11 +65,11 @@ class ViewController: UIViewController { ...@@ -65,11 +65,11 @@ class ViewController: UIViewController {
materialLayer.shape = .Circle materialLayer.shape = .Circle
materialLayer.depth = .Depth2 materialLayer.depth = .Depth2
UIImage.contentsOfURL(NSURL(string: "http://www.cosmicmind.io/CM/CosmicMindInverted.png")!) { (image: UIImage?, error: NSError?) in UIImage.contentsOfURL(NSURL(string: "http://www.cosmicmind.io/CM/iTunesArtwork.png")!) { (image: UIImage?, error: NSError?) in
if let v: UIImage = image { if let v: UIImage = image {
materialLayer.image = v materialLayer.image = v
} else { } else {
materialLayer.image = UIImage(named: "CosmicMindInverted") materialLayer.image = UIImage(named: "iTunesArtWork")
} }
} }
...@@ -77,7 +77,9 @@ class ViewController: UIViewController { ...@@ -77,7 +77,9 @@ class ViewController: UIViewController {
view.layer.addSublayer(materialLayer) view.layer.addSublayer(materialLayer)
// Add a rotate animation. // Add a rotate animation.
MaterialAnimation.delay(3) {
materialLayer.animate(MaterialAnimation.rotate(3, duration: 3)) materialLayer.animate(MaterialAnimation.rotate(3, duration: 3))
} }
}
} }
Examples/Programmatic/MaterialPulseView/MaterialPulseView.xcodeproj/project.pbxproj
...@@ -11,8 +11,6 @@ ...@@ -11,8 +11,6 @@
96DB1C611C14AA2800825BE6 /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 96DB1C601C14AA2800825BE6 /* ViewController.swift */; }; 96DB1C611C14AA2800825BE6 /* ViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 96DB1C601C14AA2800825BE6 /* ViewController.swift */; };
96DB1C661C14AA2800825BE6 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 96DB1C651C14AA2800825BE6 /* Assets.xcassets */; }; 96DB1C661C14AA2800825BE6 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 96DB1C651C14AA2800825BE6 /* Assets.xcassets */; };
96DB1C691C14AA2800825BE6 /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 96DB1C671C14AA2800825BE6 /* LaunchScreen.storyboard */; }; 96DB1C691C14AA2800825BE6 /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 96DB1C671C14AA2800825BE6 /* LaunchScreen.storyboard */; };
96FE30361C63AFAD00548232 /* Material.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 96FE30351C63AFAD00548232 /* Material.framework */; };
96FE30371C63AFAD00548232 /* Material.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 96FE30351C63AFAD00548232 /* Material.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
/* End PBXBuildFile section */ /* End PBXBuildFile section */
/* Begin PBXCopyFilesBuildPhase section */ /* Begin PBXCopyFilesBuildPhase section */
...@@ -22,7 +20,6 @@ ...@@ -22,7 +20,6 @@
dstPath = ""; dstPath = "";
dstSubfolderSpec = 10; dstSubfolderSpec = 10;
files = ( files = (
96FE30371C63AFAD00548232 /* Material.framework in Embed Frameworks */,
); );
name = "Embed Frameworks"; name = "Embed Frameworks";
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
...@@ -36,7 +33,6 @@ ...@@ -36,7 +33,6 @@
96DB1C651C14AA2800825BE6 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; }; 96DB1C651C14AA2800825BE6 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
96DB1C681C14AA2800825BE6 /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; }; 96DB1C681C14AA2800825BE6 /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
96DB1C6A1C14AA2800825BE6 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; }; 96DB1C6A1C14AA2800825BE6 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
96FE30351C63AFAD00548232 /* Material.framework */ = {isa = PBXFileReference; explicitFileType = wrapper.framework; name = Material.framework; path = "/Users/danieldahan/Library/Developer/Xcode/DerivedData/Material-hbpnflxhoouqxebjcyhbbhqyesjd/Build/Products/Debug-iphoneos/Material.framework"; sourceTree = "<absolute>"; };
/* End PBXFileReference section */ /* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */ /* Begin PBXFrameworksBuildPhase section */
...@@ -44,7 +40,6 @@ ...@@ -44,7 +40,6 @@
isa = PBXFrameworksBuildPhase; isa = PBXFrameworksBuildPhase;
buildActionMask = 2147483647; buildActionMask = 2147483647;
files = ( files = (
96FE30361C63AFAD00548232 /* Material.framework in Frameworks */,
); );
runOnlyForDeploymentPostprocessing = 0; runOnlyForDeploymentPostprocessing = 0;
}; };
...@@ -54,7 +49,6 @@ ...@@ -54,7 +49,6 @@
96DB1C521C14AA2800825BE6 = { 96DB1C521C14AA2800825BE6 = {
isa = PBXGroup; isa = PBXGroup;
children = ( children = (
96FE30351C63AFAD00548232 /* Material.framework */,
96DB1C5D1C14AA2800825BE6 /* MaterialPulseView */, 96DB1C5D1C14AA2800825BE6 /* MaterialPulseView */,
96DB1C5C1C14AA2800825BE6 /* Products */, 96DB1C5C1C14AA2800825BE6 /* Products */,
); );
......
Examples/Programmatic/MaterialPulseView/MaterialPulseView/Assets.xcassets/GraphKitAppIcon.imageset/Contents.json → Examples/Programmatic/MaterialPulseView/MaterialPulseView/Assets.xcassets/Graph.imageset/Contents.json
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"images" : [ "images" : [
{ {
"idiom" : "universal", "idiom" : "universal",
"filename" : "GraphKit-iTunesArtWork.png", "filename" : "Graph.png",
"scale" : "1x" "scale" : "1x"
}, },
{ {
......
Examples/Programmatic/MaterialPulseView/MaterialPulseView/ViewController.swift
...@@ -41,8 +41,7 @@ class ViewController: UIViewController { ...@@ -41,8 +41,7 @@ class ViewController: UIViewController {
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
prepareView() prepareView()
// prepareGeneralMaterialPulseViewExample() prepareGeneralMaterialPulseViewExample()
prepareMaterialPulseViewAnimationExample()
} }
/// General preparation statements. /// General preparation statements.
...@@ -52,37 +51,22 @@ class ViewController: UIViewController { ...@@ -52,37 +51,22 @@ class ViewController: UIViewController {
/// Prepares the MaterialPulseView example. /// Prepares the MaterialPulseView example.
private func prepareGeneralMaterialPulseViewExample() { private func prepareGeneralMaterialPulseViewExample() {
let pulseView: MaterialPulseView = MaterialPulseView(frame: CGRectMake(132, 132, 150, 150)) let point: CGFloat = (UIScreen.mainScreen().bounds.width - 150) / 2
pulseView.image = UIImage(named: "GraphKitAppIcon")
pulseView.shape = .Square
pulseView.depth = .Depth2
pulseView.cornerRadius = .Radius4
// Add pulseView to UIViewController. let pulseView: MaterialPulseView = MaterialPulseView(frame: CGRectMake(point, point, 150, 150))
view.addSubview(pulseView) pulseView.image = UIImage(named: "Graph")
}
/// Prepares the MaterialPulseView animation example.
private func prepareMaterialPulseViewAnimationExample() {
let pulseView: MaterialPulseView = MaterialPulseView(frame: CGRectMake(132, 132, 150, 150))
pulseView.image = UIImage(named: "GraphKitAppIcon")
pulseView.shape = .Square pulseView.shape = .Square
pulseView.depth = .Depth2 pulseView.depth = .Depth2
pulseView.cornerRadius = .Radius3 pulseView.cornerRadius = .Radius3
print(pulseView)
// Add materialView to UIViewController. // Add pulseView to UIViewController.
view.addSubview(pulseView) view.addSubview(pulseView)
pulseView.animate(MaterialAnimation.rotate(3, duration: 3)) // Trigger the pulse animation.
MaterialAnimation.delay(2) {
UIView.animateWithDuration(0.5, pulseView.pulse()
delay: 3, }
usingSpringWithDamping: 0.6,
initialSpringVelocity: 0,
options: .AllowUserInteraction,
animations: {
pulseView.y = 300
}, completion: nil)
} }
} }
Examples/Programmatic/MaterialView/MaterialView/Assets.xcassets/FocusAppIcon.imageset/Contents.json → Examples/Programmatic/MaterialView/MaterialView/Assets.xcassets/Avatar.imageset/Contents.json
...@@ -2,15 +2,17 @@ ...@@ -2,15 +2,17 @@
"images" : [ "images" : [
{ {
"idiom" : "universal", "idiom" : "universal",
"filename" : "FocusAppIcon.png", "filename" : "Avatar.png",
"scale" : "1x" "scale" : "1x"
}, },
{ {
"idiom" : "universal", "idiom" : "universal",
"filename" : "Avatar@2x.png",
"scale" : "2x" "scale" : "2x"
}, },
{ {
"idiom" : "universal", "idiom" : "universal",
"filename" : "Avatar@3x.png",
"scale" : "3x" "scale" : "3x"
} }
], ],
......
Examples/Programmatic/MaterialView/MaterialView/ViewController.swift
...@@ -53,11 +53,12 @@ class ViewController: UIViewController { ...@@ -53,11 +53,12 @@ class ViewController: UIViewController {
/// Prepare the MaterialView. /// Prepare the MaterialView.
private func prepareGeneralMaterialViewExample() { private func prepareGeneralMaterialViewExample() {
let materialView: MaterialView = MaterialView(frame: CGRectMake(132, 132, 150, 150)) let point: CGFloat = (UIScreen.mainScreen().bounds.width - 150) / 2
materialView.image = UIImage(named: "FocusAppIcon")
materialView.shape = .Square let materialView: MaterialView = MaterialView(frame: CGRectMake(point, point, 150, 150))
materialView.image = UIImage(named: "Avatar")
materialView.shape = .Circle
materialView.depth = .Depth2 materialView.depth = .Depth2
materialView.cornerRadius = .Radius3
// Add materialView to UIViewController. // Add materialView to UIViewController.
view.addSubview(materialView) view.addSubview(materialView)
...@@ -65,23 +66,33 @@ class ViewController: UIViewController { ...@@ -65,23 +66,33 @@ class ViewController: UIViewController {
/// Prepares the MaterialView animation example. /// Prepares the MaterialView animation example.
private func prepareMaterialViewAnimationExample() { private func prepareMaterialViewAnimationExample() {
let materialView: MaterialView = MaterialView(frame: CGRectMake(132, 132, 150, 150)) let point: CGFloat = (UIScreen.mainScreen().bounds.width - 150) / 2
materialView.image = UIImage(named: "FocusAppIcon")
materialView.shape = .Square let materialView: MaterialView = MaterialView(frame: CGRectMake(point, point, 150, 150))
materialView.image = UIImage(named: "Avatar")
materialView.shape = .Circle
materialView.depth = .Depth2 materialView.depth = .Depth2
materialView.cornerRadius = .Radius3
// Add materialView to UIViewController. // Add materialView to UIViewController.
view.addSubview(materialView) view.addSubview(materialView)
UIView.animateWithDuration(0.5, UIView.animateWithDuration(0.5,
delay: 3, delay: 2,
usingSpringWithDamping: 0.6, usingSpringWithDamping: 0.6,
initialSpringVelocity: 0, initialSpringVelocity: 0,
options: .AllowUserInteraction, options: .AllowUserInteraction,
animations: { animations: {
materialView.y = 300 materialView.y = 300
}) { _ in
UIView.animateWithDuration(0.5,
delay: 2,
usingSpringWithDamping: 0.6,
initialSpringVelocity: 0,
options: .AllowUserInteraction,
animations: {
materialView.y = point
}, completion: nil) }, completion: nil)
} }
}
} }
Examples/Programmatic/NavigationBarView/NavigationBarView/ViewController.swift
...@@ -239,7 +239,7 @@ class ViewController: UIViewController { ...@@ -239,7 +239,7 @@ class ViewController: UIViewController {
/// Prepares a text alignment example. /// Prepares a text alignment example.
private func prepareAlignTitleAndDetailLabelToLeftExample() { private func prepareAlignTitleAndDetailLabelToLeftExample() {
let navigationBarView: NavigationBarView = NavigationBarView() let navigationBarView: NavigationBarView = NavigationBarView()
navigationBarView.backgroundColor = MaterialColor.blue.base navigationBarView.backgroundColor = MaterialColor.deepPurple.base
/* /*
To lighten the status bar - add the To lighten the status bar - add the
......
Material.podspec
Pod::Spec.new do |s| Pod::Spec.new do |s|
s.name = 'Material' s.name = 'Material'
s.version = '1.29.4' s.version = '1.30.0'
s.license = 'BSD' s.license = 'BSD'
s.summary = 'A beautiful graphics framework for Material Design in Swift.' s.summary = 'A beautiful graphics framework for Material Design in Swift.'
s.homepage = 'http://cosmicmind.io' s.homepage = 'http://cosmicmind.io'
......
README.md
...@@ -49,16 +49,16 @@ Material is a growing project and will encounter changes throughout its developm ...@@ -49,16 +49,16 @@ Material is a growing project and will encounter changes throughout its developm
## A Tour ## A Tour
* [MaterialColor](#materialcolor) * [MaterialColor](#materialcolor)
* [SideNavigationViewController](#sidenavigationviewcontroller)
* [NavigationBarView](#navigationbarview)
* [TextField](#textfield)
* [TextView](#textview)
* [MaterialLayer](#materiallayer) * [MaterialLayer](#materiallayer)
* [MaterialView](#materialview) * [MaterialView](#materialview)
* [MaterialPulseView](#materialpulseview) * [MaterialPulseView](#materialpulseview)
* [TextField](#textfield)
* [TextView](#textview)
* [FlatButton](#flatbutton) * [FlatButton](#flatbutton)
* [RaisedButton](#raisedbutton) * [RaisedButton](#raisedbutton)
* [FabButton](#fabbutton) * [FabButton](#fabbutton)
* [NavigationBarView](#navigationbarview)
* [SideNavigationViewController](#sidenavigationviewcontroller)
* [CardView](#cardview) * [CardView](#cardview)
* [ImageCardView](#imagecardview) * [ImageCardView](#imagecardview)
* [CaptureView](#captureview) * [CaptureView](#captureview)
...@@ -86,23 +86,32 @@ MaterialColor is a complete Material Design color library. It uses base color va ...@@ -86,23 +86,32 @@ MaterialColor is a complete Material Design color library. It uses base color va
[Learn More About MaterialColor](https://github.com/CosmicMind/Material/wiki/MaterialColor) [Learn More About MaterialColor](https://github.com/CosmicMind/Material/wiki/MaterialColor)
<a name="sidenavigationviewcontroller"></a> <a name="materiallayer"></a>
## SideNavigationViewController ## MaterialLayer
The SideNavigationViewController is an app wide navigation pattern. It generally provides overall app navigation with other useful items. Use the Left position for global app navigation, and the Right position for view navigation. MaterialLayer is a lightweight CAShapeLayer used throughout Material. It is designed to easily take shape, depth, and animations.
![MaterialSideNavigationViewController](http://www.cosmicmind.io/MK/MaterialSideNavigationViewController.gif) ![MaterialMaterialLayer](http://www.cosmicmind.io/MK/MaterialMaterialLayer.gif)
[Learn More About SideNavigationViewController](https://github.com/CosmicMind/Material/wiki/SideNavigationViewController) [Learn More About MaterialLayer](https://github.com/CosmicMind/Material/wiki/MaterialLayer)
<a name="navigationbarview"></a> <a name="materialview"></a>
## NavigationBarView ## MaterialView
A NavigationBarView is a fully featured navigation bar that supports orientation changes, background images, title and detail labels, both left and right button sets, and status bar settings. MaterialView is the base UIView class used throughout Material. Like MaterialLayer, it is designed to easily take shape, depth, and animations. The major difference is that MaterialView has all the added features of the UIView class.
![MaterialNavigationBarView](http://www.cosmicmind.io/MK/MaterialNavigationBarView.gif) ![MaterialMaterialView](http://www.cosmicmind.io/MK/MaterialMaterialView.gif)
[Learn More About NavigationBarView](https://github.com/CosmicMind/Material/wiki/NavigationBarView) [Learn More About MaterialView](https://github.com/CosmicMind/Material/wiki/MaterialView)
<a name="materialpulseview"></a>
## MaterialPulseView
MaterialPulseView is at the heart of all pulse animations. Any view that subclasses MaterialPulseView instantly inherits the pulse animation with full customizability.
![MaterialMaterialPulseView](http://www.cosmicmind.io/MK/MaterialMaterialPulseView.gif)
[Learn More About MaterialPulseView](https://github.com/CosmicMind/Material/wiki/MaterialPulseView)
<a name="textfield"></a> <a name="textfield"></a>
## TextField ## TextField
...@@ -125,33 +134,6 @@ A TextView is an excellent way to improve UX. TextViews offer details that descr ...@@ -125,33 +134,6 @@ A TextView is an excellent way to improve UX. TextViews offer details that descr
[Learn More About TextView](https://github.com/CosmicMind/Material/wiki/TextView) [Learn More About TextView](https://github.com/CosmicMind/Material/wiki/TextView)
<a name="materiallayer"></a>
## MaterialLayer
MaterialLayer is a lightweight CAShapeLayer used throughout Material. It is designed to easily take shape, depth, and animations.
![MaterialMaterialLayer](http://www.cosmicmind.io/MK/MaterialMaterialLayer.gif)
[Learn More About MaterialLayer](https://github.com/CosmicMind/Material/wiki/MaterialLayer)
<a name="materialview"></a>
## MaterialView
MaterialView is the base UIView class used throughout Material. Like MaterialLayer, it is designed to easily take shape, depth, and animations. The major difference is that MaterialView has all the added features of the UIView class.
![MaterialMaterialView](http://www.cosmicmind.io/MK/MaterialMaterialView.gif)
[Learn More About MaterialView](https://github.com/CosmicMind/Material/wiki/MaterialView)
<a name="materialpulseview"></a>
## MaterialPulseView
MaterialPulseView is at the heart of all pulse animations. Any view that subclasses MaterialPulseView instantly inherits the pulse animation with full customizability.
![MaterialMaterialPulseView](http://www.cosmicmind.io/MK/MaterialMaterialPulseView.gif)
[Learn More About MaterialPulseView](https://github.com/CosmicMind/Material/wiki/MaterialPulseView)
<a name="flatbutton"></a> <a name="flatbutton"></a>
## FlatButton ## FlatButton
...@@ -179,6 +161,24 @@ A FabButton is essential to Material Design's overall look. Below showcases its ...@@ -179,6 +161,24 @@ A FabButton is essential to Material Design's overall look. Below showcases its
[Learn More About FabButton](https://github.com/CosmicMind/Material/wiki/FabButton) [Learn More About FabButton](https://github.com/CosmicMind/Material/wiki/FabButton)
<a name="navigationbarview"></a>
## NavigationBarView
A NavigationBarView is a fully featured navigation bar that supports orientation changes, background images, title and detail labels, both left and right button sets, and status bar settings.
![MaterialNavigationBarView](http://www.cosmicmind.io/MK/MaterialNavigationBarView.gif)
[Learn More About NavigationBarView](https://github.com/CosmicMind/Material/wiki/NavigationBarView)
<a name="sidenavigationviewcontroller"></a>
## SideNavigationViewController
The SideNavigationViewController is an app wide navigation pattern. It generally provides overall app navigation with other useful items. Use the Left position for global app navigation, and the Right position for view navigation.
![MaterialSideNavigationViewController](http://www.cosmicmind.io/MK/MaterialSideNavigationViewController.gif)
[Learn More About SideNavigationViewController](https://github.com/CosmicMind/Material/wiki/SideNavigationViewController)
<a name="cardview"></a> <a name="cardview"></a>
## CardView ## CardView
...@@ -194,7 +194,7 @@ Easily remove the pulse animation and add a background image for an entirely new ...@@ -194,7 +194,7 @@ Easily remove the pulse animation and add a background image for an entirely new
Adjust the alignment of the UI elements to create different configurations of the CardView. Adjust the alignment of the UI elements to create different configurations of the CardView.
![MaterialCardViewDataDriven](http://www.cosmicmind.io/MK/MaterialCardViewDataDriven.gif) ![MaterialCardViewDataDriven](http://www.cosmicmind.io/MK/MaterialCardViewFavoritePulse.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. 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.
......
Sources/Info.plist
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
<key>CFBundlePackageType</key> <key>CFBundlePackageType</key>
<string>FMWK</string> <string>FMWK</string>
<key>CFBundleShortVersionString</key> <key>CFBundleShortVersionString</key>
<string>1.29.4</string> <string>1.30.0</string>
<key>CFBundleSignature</key> <key>CFBundleSignature</key>
<string>????</string> <string>????</string>
<key>CFBundleVersion</key> <key>CFBundleVersion</key>
......
Sources/MaterialButton.swift
...@@ -366,7 +366,7 @@ public class MaterialButton : UIButton { ...@@ -366,7 +366,7 @@ public class MaterialButton : UIButton {
*/ */
public override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) { public override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
super.touchesBegan(touches, withEvent: event) super.touchesBegan(touches, withEvent: event)
pulse(layer.convertPoint(touches.first!.locationInView(self), fromLayer: layer)) pulseAnimation(layer.convertPoint(touches.first!.locationInView(self), fromLayer: layer))
} }
/** /**
...@@ -391,8 +391,66 @@ public class MaterialButton : UIButton { ...@@ -391,8 +391,66 @@ public class MaterialButton : UIButton {
shrinkAnimation() shrinkAnimation()
} }
/// Triggers the pulse animation. /**
public func pulse(point: CGPoint) { Triggers the pulse animation.
- Parameter point: A Optional point to pulse from, otherwise pulses
from the center.
*/
public func pulse(var point: CGPoint? = nil) {
if nil == point {
point = CGPointMake(CGFloat(width / 2), CGFloat(height / 2))
}
if let v: CFTimeInterval = pulseAnimation(point!) {
MaterialAnimation.delay(v) { [unowned self] in
self.shrinkAnimation()
}
}
}
/**
Prepares the view instance when intialized. When subclassing,
it is recommended to override the prepareView method
to initialize property values and other setup operations.
The super.prepareView method should always be called immediately
when subclassing.
*/
public func prepareView() {
prepareVisualLayer()
shadowColor = MaterialColor.black
borderColor = MaterialColor.black
pulseColor = MaterialColor.white
pulseColorOpacity = 0.25
}
/// Prepares the visualLayer property.
internal func prepareVisualLayer() {
visualLayer.zPosition = 0
visualLayer.masksToBounds = true
layer.addSublayer(visualLayer)
}
/// Manages the layout for the visualLayer property.
internal func layoutVisualLayer() {
visualLayer.frame = bounds
visualLayer.position = CGPointMake(width / 2, height / 2)
visualLayer.cornerRadius = layer.cornerRadius
}
/// Manages the layout for the shape of the view instance.
internal func layoutShape() {
if .Circle == shape {
layer.cornerRadius = width / 2
}
}
/**
Triggers the pulse animation.
- Parameter point: A point to pulse from.
- Returns: A Ooptional CFTimeInternal if the point exists within
the view. The time internal represents the animation time.
*/
internal func pulseAnimation(point: CGPoint) -> CFTimeInterval? {
if true == layer.containsPoint(point) { if true == layer.containsPoint(point) {
let r: CGFloat = (width < height ? height : width) / 2 let r: CGFloat = (width < height ? height : width) / 2
let f: CGFloat = 3 let f: CGFloat = 3
...@@ -435,44 +493,10 @@ public class MaterialButton : UIButton { ...@@ -435,44 +493,10 @@ public class MaterialButton : UIButton {
if pulseScale { if pulseScale {
layer.addAnimation(MaterialAnimation.scale(s, duration: t), forKey: nil) layer.addAnimation(MaterialAnimation.scale(s, duration: t), forKey: nil)
return t
} }
} }
} return nil
/**
Prepares the view instance when intialized. When subclassing,
it is recommended to override the prepareView method
to initialize property values and other setup operations.
The super.prepareView method should always be called immediately
when subclassing.
*/
public func prepareView() {
prepareVisualLayer()
shadowColor = MaterialColor.black
borderColor = MaterialColor.black
pulseColor = MaterialColor.white
pulseColorOpacity = 0.25
}
/// Prepares the visualLayer property.
internal func prepareVisualLayer() {
visualLayer.zPosition = 0
visualLayer.masksToBounds = true
layer.addSublayer(visualLayer)
}
/// Manages the layout for the visualLayer property.
internal func layoutVisualLayer() {
visualLayer.frame = bounds
visualLayer.position = CGPointMake(width / 2, height / 2)
visualLayer.cornerRadius = layer.cornerRadius
}
/// Manages the layout for the shape of the view instance.
internal func layoutShape() {
if .Circle == shape {
layer.cornerRadius = width / 2
}
} }
/// Executes the shrink animation for the pulse effect. /// Executes the shrink animation for the pulse effect.
......
Sources/MaterialPulseView.swift
...@@ -48,7 +48,7 @@ public class MaterialPulseView : MaterialView { ...@@ -48,7 +48,7 @@ public class MaterialPulseView : MaterialView {
*/ */
public override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) { public override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
super.touchesBegan(touches, withEvent: event) super.touchesBegan(touches, withEvent: event)
pulse(layer.convertPoint(touches.first!.locationInView(self), fromLayer: layer)) pulseAnimation(layer.convertPoint(touches.first!.locationInView(self), fromLayer: layer))
} }
/** /**
...@@ -73,8 +73,42 @@ public class MaterialPulseView : MaterialView { ...@@ -73,8 +73,42 @@ public class MaterialPulseView : MaterialView {
shrinkAnimation() shrinkAnimation()
} }
/// Triggers the pulse animation. /**
public func pulse(point: CGPoint) { Triggers the pulse animation.
- Parameter point: A Optional point to pulse from, otherwise pulses
from the center.
*/
public func pulse(var point: CGPoint? = nil) {
if nil == point {
point = CGPointMake(CGFloat(width / 2), CGFloat(height / 2))
}
if let v: CFTimeInterval = pulseAnimation(point!) {
MaterialAnimation.delay(v) { [unowned self] in
self.shrinkAnimation()
}
}
}
/**
Prepares the view instance when intialized. When subclassing,
it is recommended to override the prepareView method
to initialize property values and other setup operations.
The super.prepareView method should always be called immediately
when subclassing.
*/
public override func prepareView() {
super.prepareView()
pulseColor = MaterialColor.white
}
/**
Triggers the pulse animation.
- Parameter point: A point to pulse from.
- Returns: A Ooptional CFTimeInternal if the point exists within
the view. The time internal represents the animation time.
*/
internal func pulseAnimation(point: CGPoint) -> CFTimeInterval? {
if true == layer.containsPoint(point) { if true == layer.containsPoint(point) {
let r: CGFloat = (width < height ? height : width) / 2 let r: CGFloat = (width < height ? height : width) / 2
let f: CGFloat = 3 let f: CGFloat = 3
...@@ -117,20 +151,10 @@ public class MaterialPulseView : MaterialView { ...@@ -117,20 +151,10 @@ public class MaterialPulseView : MaterialView {
if pulseScale { if pulseScale {
layer.addAnimation(MaterialAnimation.scale(s, duration: t), forKey: nil) layer.addAnimation(MaterialAnimation.scale(s, duration: t), forKey: nil)
return t
} }
} }
} return nil
/**
Prepares the view instance when intialized. When subclassing,
it is recommended to override the prepareView method
to initialize property values and other setup operations.
The super.prepareView method should always be called immediately
when subclassing.
*/
public override func prepareView() {
super.prepareView()
pulseColor = MaterialColor.white
} }
/// Executes the shrink animation for the pulse effect. /// Executes the shrink animation for the pulse effect.
......
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