Code Monkey home page Code Monkey logo

materialkit's Introduction

MaterialKit

Platform Language License Issues

NOTE: This project is unmaintained.

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 supporting @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

  • MKActivityIndicator

  • MKRefreshControl

  • MKNavigationBar

Components

MKButton

  • There are 3 types of main buttons: Floating Action Button, Raised Button, Flat Button
  • Customizable 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
  • Customizable 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

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

MKRefreshControl

  • Customizable attributes: color, height
var refreshControl = MKRefreshControl()
refreshControl.addToScrollView(self.tableView, withRefreshBlock: { () -> Void in
	self.tableViewRefresh()
})
refreshControl.beginRefreshing()

MKImageView (BarButtonItem), MKActivityIndicator

  • Customizable 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

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

MKNavigationBar

A custom UINavigationBar which supports elevation and adding a tint above itself

  • Customizable attributes: color, dark color, elevation, shadow opacity, tint color...
  • Set the class of the navigation bar in the storyboard designer to MKNavigationBar and set the custom properties

MKSwitch

On/off switches toggle the state of a single settings option. The option that the switch controls, as well as the state it’s in, should be made clear from the corresponding inline label. Switches take on the same visual properties of the radio button.

Installation

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

Requirements

  • iOS 8.0+
  • Xcode 6.1

License

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

materialkit's People

Contributors

countcain avatar evermeer avatar ken0nek avatar mharoonbaig avatar nghialv avatar rahuliyer95 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

materialkit's Issues

Xcode 6.3 beta 2 (and beta 3)

in the Classes
MKimageView.swift
MKLayer.swift
MKTableViewCell.swift

The following lines of code appear

  • override public func touchesBegan(touches: NSSet, withEvent event: UIEvent) {
    super.touchesBegan(touches, withEvent: event)
  •    if let firstTouch = touches.anyObject() as? UITouch {
    

Which will need to be changed to the following in order to compile in the beta.

  • override public func touchesBegan(touches: Set, withEvent event: UIEvent) {
    super.touchesBegan(touches, withEvent: event)
    + if let firstTouch = touches.first as? UITouch {

I am merely advising this course of action and thought it would save you some time and trouble.

Autolayout problems

The moment I add the auto layout constraints from the storyboard, the ripple animation is messed up.
screencast6664
The ripple location is set to .TapLocation here.

Error on buid

Hey guys!
i'm getting this error on build time :

MKTableViewCell.swift:54:48: Use of undeclared type 'Set'

override public func touchesBegan(touches: Set<NSObject>, withEvent event: UIEvent) {

I'm pretty new to swift, so any help would be much appreciated πŸ‘

Update Cocoapods

Please create a new tag and push it to trunk so one can use the current version (Swift 2 compatibility) without specifying :head in the Podfile, thanks πŸ‘

Error in swift 4

Hi

I am trying to implement below screenshot scenario, but I am facing the issue so can you please help me in out.
screen shot 2017-09-20 at 11 30 46 am

use uncleard type MKTextField

i copied sources to my project but return use uncleard type MKTextField !!!
or i cannot write instanse var for build button

screen shot 1396-01-30 at 11 23 57

screen shot 1396-01-30 at 11 24 05

Is this abandoned?

Is MaterialKit dead/abandoned now? Seems like there's not any owner activity with issues or pull requests in some time.

MKTextField error state support

It would be great to be able to pass an error message to a text field to change the bottom border to a error state color and display the message below that.

textField.showErrorMessage("Username or Password is incorrect.")

To balance the api out, it would be nice to add a 'clearErrorMessage' function.

RIght alignment of text

When I am right aligning the textfield text become right aligned but placeholder isn't and sometime placeholder enter into right side and only some texts are visible

How to build hybrid app using materializecss

I have completed the designing part using materialize css. But they are simple html pages.How do I make apk file as well one for ios app.
Please provide details.
Thank you in advance

MKTextField floating placeholder doesn't work with `attributedPlaceholder`

When setting up the placeholder this way:

var str = NSMutableAttributedString(string: "some strings", attributes: nil)
str.addAttribute(NSForegroundColorAttributeName, value: UIColor.redColor(), range: NSMakeRange(0, str.length))
textField.attributedPlaceHolder = str

the floating placeholder is not visible.

.rippleLocation

I'm using MaterialKit with my first project, and I'm currently using MKButton. In the read me, the description calls for 1) UIColor.MKColor.color and 2) button.rippleLocation = .TapLocation. Xcode is complaining about "UIColor" has no member "MKColor" and likewise with "rippleLocation." I'm using the current version of Cocoapods and Xcode 7.3.1.

MKLayer Ripple issue

I am using following GitHub library for the menu :-
https://github.com/yannickl/FlowingMenu

When I push any viewcontroller on the controller that is showing menu the ripple effects stops working in all the controllers.

Consider I have HomeViewController which has menu button to show menu. Once the menu is displayed after that in any viewcontroller I use UITextfield with subclass of MaterialKit the ripple effect stops working.

I know it's not the issue of your library but just wanted to know any workaround I can solve the issue. While debugging I got to know "clearEffects" method in the MKLayer method is not getting called after I tap on any textfield.

So is there is any way I can solve this issue.

Support for Swift 2.0 ?

After I installed this MaterialKit using pod, it doesn't seem to support Swift 2.0. I was wondering if this is true or something is wrong with my settings. Thanks

Support tap instead of touch?

Anyone know how one would implement the animations with tap instead of touch? The textfield for example:

 override public func beginTrackingWithTouch(touch: UITouch, withEvent event: UIEvent) -> Bool {
    mkLayer.didChangeTapLocation(touch.locationInView(self))

    mkLayer.animateScaleForCircleLayer(0.45, toScale: 1.0, timingFunction: MKTimingFunction.Linear, duration: CFTimeInterval(self.rippleAniDuration))
    mkLayer.animateAlphaForBackgroundLayer(MKTimingFunction.Linear, duration: CFTimeInterval(self.backgroundAniDuration))

    return super.beginTrackingWithTouch(touch, withEvent: event)
}

MKTextField attributed placeholder support

Here code for attributed placeholder support:

override var attributedPlaceholder: NSAttributedString! {
        didSet {
            floatingLabel.text = attributedPlaceholder.string
            floatingLabel.sizeToFit()
            setFloatingLabelOverlapTextField()
        }
    }

I also wrote wrapped method for setting attributed placeholder:

func setAttributedPlaceholder(text : NSString) {
        var attrs = [NSFontAttributeName : self.font, NSForegroundColorAttributeName : UIColor.grayColor()]
        var str = NSAttributedString(string: text, attributes: attrs)

        self.attributedPlaceholder = str
    }

Carthage Support?

Hi,

What do you think about add option to install this kit via Carthage? I would like to use it this way. Thanks

MKTextField Ripple effect

If you add a MKTextField into a ScrollView or TableView, ripple effect does not play on tap, how can we solve this issue?

List apps using MaterialKit

If there are any apps using this kit, it would be helpful to list them somewhere. For example, in the readme.

MKTextField bottomBorder not working

I'm using Material kit in my project. materialKit integrated using pod.

I'm using MKTextfield like:

@IBOutlet  var verifyPinTextField: MKTextField!

verifyTextField.layer.borderColor = UIColor.clearColor().CGColor
verifyTextField.floatingPlaceholderEnabled = true
verifyTextField.placeholder = "Github"
verifyTextField.tintColor = UIColor.MKColor.Orange
verifyTextField.rippleLocation = .Right
verifyTextField.cornerRadius = 0
verifyTextField.bottomBorderEnabled = true
verifyTextField.bottomBorderColor = UIColor.MKColor.Orange

But bottomBorder not shown while editing text in textfield. Also placeholder not shown not float position.

Dropdown List

Tx for you brilliant code..

Would you consider adding a dropdown/combobox?

Thank you so much!

iPhone 4S simulator

Hi -

I am sorry this is not an issue with the library but something I am facing in my workspace.

the library is giving lot of compilation errors when I build by selecting iPhone 4s (iOS >= 8.1) simulators. It builds properly in iPhone 5S and above simulators. Do you know what could be the reason?

Thank you for the library and help.

Sample compilation error

"MaterialKit.MKTableViewCell.rippleScaleRatio.getter : CoreGraphics.CGFloat", referenced from:
OBJC_CLASS$__TtC11SoccerScorer22ScoreTableViewCell in ScoreTableViewCell.o

Thank you

TextField gives Unknown Class crash when running on device

I get the following error message when I run on a device from time to time.

Unknown class _TtC8Material9TextField in Interface Builder file.

And also, sometimes getting the text on textfields returns nil and causes app to crash. I think this might be a version problem but I am not sure and don't know how to resolve the issue. Can anyone give a hand please?

cocoapods support

Your library can't be used with cocapods, you need to make all those class public.

MKBarButtonItem

A bar button item that supports the ripple animation would be highly appreciated!

I can only get a square ripple

image

I can not get a circle ripple in my project!
I just change the "custom class" to MKTableViewCell in the storyboard and it can only perform a square ripple. Same issues in TextField.

But if i copy one from your storyboard directly, it works.

MKTextField

Failed to render instance of MKTextField: Rendering the view took longer than 200 ms. Your drawing code may suffer from slow performance.

Compilation errors with Swift 2.0

I tried 0.3.5 out on a Swift 2.0/Xcode 7 project, but there are a number of compilation errors. Is Swift 2.0 support on the radar?

Button and TextField Selection

After auto re sizing Button and Text Field width, I found the selection highlighter have not covered for the full width.
Is there any way to fix this issue.
Below I have added the screenshot for your reference.

button

textfield

MKView

HI,

Could you make MKView in your library?

Converting MKTextField to a string

I'm still new to swift so this may be an easy answer.

Is there a way to convert an MKTextField into a string? I'm using alamofire to create HTTP requests for login, however it doesn't support MKTextFields.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.