Skip to content

Latest commit

 

History

History
153 lines (121 loc) · 4.97 KB

README.md

File metadata and controls

153 lines (121 loc) · 4.97 KB

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

  • MKTextView (In progress)

  • MKSwitch (In progress)

  • MKAlert (In progress)

  • MKActivityIndicator (In progress)

  • 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.circleLayerColor = 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.circleLayerColor = 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.circleLayerColor = 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

  • pod file

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.