Skip to content

Material design components for iOS written in Swift

License

Notifications You must be signed in to change notification settings

jpaas/MaterialKit

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

78 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MaterialKit

Platform Language License Issues

Material design components (inspired by Google Material Design) for iOS written in Swift

Please feel free to make pull requests.

Features

  • Highly customizable

  • Complete example

  • Supports @IBDesignable to live-render the component in the Interface Builder

  • By suporting @IBInspectable, the class properties can be exposed in the Interface Builder, and you can edit these properties in realtime

  • MKButton: floating action button, raised button, flat button, ripple effect

  • MKTextField: ripple effect, floating placeholder

  • MKTableViewCell

  • MKLabel

  • MKImageView

  • MKLayer

  • MKColor

Components

MKButton

  • There are 3 types of main buttons: Floating Action Button, Raised Button, Flat Button
  • Custommizable attributes: color, ripple location, animation timing function, animation duration...
	let button = MKButton(frame: CGRect(x: 10, y: 10, width: 100, height: 35))
	button.maskEnabled = true
	button.rippleLocation = .TapLocation
	button.rippleLayerColor = UIColor.MKColor.LightGreen

MKTextField

  • Single-line text field
  • Floating placeholder
  • Ripple Animation
  • Custommizable attributes: color, ripple location, bottom border, animation timing function, animation duration...
	textField.rippleLocation = .Left
	textField.floatingPlaceholderEnabled = true
	textField.placeholder = "Description"
	textField.layer.borderColor = UIColor.MKColor.Green.CGColor
	textField.rippleLayerColor = UIColor.MKColor.LightGreen

MKTableViewCell

  • Custommizable attributes: color, ripple location, animation timing function, animation duration...
	var cell = tableView.dequeueReusableCellWithIdentifier("MyCell") as MyCell
	cell.rippleLocation = .Center
	cell.rippleLayerColor = UIColor.MKColor.Blue

MKLabel, MKImageView (BarButtonItem)

  • Custommizable attributes: color, ripple location, animation timing function, animation duration...

  • Play ripple animation whenever you want by calling animateRipple method or by setting userInteractionEnabled = true ripple animation will be played when the label/imageview is tapped

  • Easy to customize UIBarButtonItem or UITabBarButton by using MKLabel or MKImageView

	// customize UIBarButtonItem by using MKImageView
	let imgView = MKImageView(frame: CGRect(x: 0, y: 0, width: 44, height: 32))
	imgView.image = UIImage(named: "uibaritem_icon.png")
	imgView.rippleLocation = .Center
	imgView.userInteractionEnabled = true

	let rightBarButton = UIBarButtonItem(customView: imgView)
	self.navigationItem.rightBarButtonItem = rightBarButton

MKProgressView (Coming Soon)

MKLayer

A subclass of CALayer.

MKColor

A category for UIColor that adds some methods to get flat colors designed by Google

	// get color from UIColor
	let lightBlueColor = UIColor.MKColor.LightBlue

TODO

  • MKTextView
  • MKActivityIndicator (In progress)

Installation

  • Installation with CocoaPods
	pod 'MaterialKit'
  • Copying all the files into your project
  • Using submodule

Requirements

  • iOS 7.0+
  • Xcode 6.1

License

MaterialKit is released under the MIT license. See LICENSE for details.

About

Material design components for iOS written in Swift

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Swift 98.2%
  • Ruby 1.8%