title: swift 3: create a material-design-chip
body: <p>heyhey,</p>
  
  <p>since a few days I attempt to create the "Material-Design-Chip", but only with half success.</p>
  
  <p>The attempt with the most success I had, is to make a subclass from "Button" (Button is a subclass from UIButton created from <a href="https://github.com/CosmicMind/Material" rel="nofollow">cosmicmind</a> in his MaterialDesign-Framework for swift).</p>
  
  <p>For the people who doesn't know I mean with "chips": <a href="https://material.google.com/components/chips.html#chips-specs" rel="nofollow">click here</a></p>
  
  <p>my examples:</p>
  
  <h2>The simple / non-deletable chip</h2>
  
  <pre><code>import UIKit
  import Material
  
  class ChipButton: Button {
      override func prepare() {
          super.prepare()
  
          cornerRadiusPreset      = .cornerRadius5
          backgroundColor         = UIColor.lightGray
          titleColor              = Color.darkText.primary
          pulseAnimation          = .none
          contentEdgeInsets       = EdgeInsets(top: 0, left: 12, bottom: 0, right: 12)
          isUserInteractionEnabled = false
          titleLabel?.font        = RobotoFont.regular
          isOpaque                = true
      }
  }
  </code></pre>
  
  <p>and to create this button:</p>
  
  <pre><code>let button = ChipButton()
      button.title = "default chip"
  
      view.layout(button).height(32).center(offsetY: -150)
  </code></pre>
  
  <h2>The contact-chip / icon-chip</h2>
  
  <pre><code>import UIKit
  import Material
  
  class ChipIconButton: ChipButton {
      /*override func prepare() {
          super.prepare()
  
          contentEdgeInsets       = EdgeInsets(top: 0, left: 16, bottom: 0, right: 12)
      }*/
  
      public convenience init(image: UIImage?, title: String?){
          self.init()
          prepare(with: image, title: title)
      }
  
      private func prepare(with image: UIImage?, title: String?) {
          self.image = image
          self.title = title
  
          self.imageView?.backgroundColor = UIColor.darkGray // this works
          self.imageView?.cornerRadiusPreset = .cornerRadius4 // this works
          self.imageView?.tintColor  = Color.black // this doesn't work
  
          self.imageEdgeInsets    = EdgeInsets(top: 0, left: -8, bottom: 0, right: 12)
          self.titleEdgeInsets    = EdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
          self.contentEdgeInsets  = EdgeInsets(top: 0, left: 8, bottom: 0, right: 12)
      }
  }
  </code></pre>
  
  <p>here I want to  </p>
  
  <ol>
  <li><p>resize the UIImageView to the height of the chip (which is 32 points)</p>
  
  <pre><code>I tried with self.imageView?.frame = CGRect(x: 50, y: 50, width: 32, height: 32) but nothing changed
  </code></pre></li>
  <li><p>resize the UIImage little bit smaller (to 20 points)</p></li>
  <li><p>to change the tintColor of the UIImage</p>
  
  <pre><code>I tryed with self.imageView?.tintColor = Color.black but nothing changed
  </code></pre></li>
  </ol>
  
  <h2>The deletable chip</h2>
  
  <pre><code>import UIKit
  import Material
  
  class ChipDeleteableButton: ChipButton {
  
      override func prepare() {
          super.prepare()
  
          self.image = #imageLiteral(resourceName: "ic_close_white_24px")
          self.title = title
  
          //self.frame = CGRect(x: 50, y: 50, width: 32, height: 32)
          self.imageView?.backgroundColor = UIColor.darkGray
          self.imageView?.cornerRadiusPreset = .cornerRadius4
          self.imageView?.tintColor  = Color.black
  
          self.imageEdgeInsets    = EdgeInsets(top: 0, left: self.frame.size.width, bottom: 0, right: 0)
          self.titleEdgeInsets    = EdgeInsets(top: 0, left: 0, bottom: 0, right: self.frame.size.width)
          self.contentEdgeInsets  = EdgeInsets(top: 0, left: 8, bottom: 0, right: 12)
      }
  }
  </code></pre>
  
  <p>here I tried to switch the positions of the label and with imageEdgeInsets and titleEdgeInsets, but self.frame.size.width returns a incorrect width (maybe couse of AutoLayout but i'm not sure)</p>
  
  <h2>help</h2>
  
  <p>hope that somebody can help me!</p>
  
  <p>ps. I'm little newbe at swift/xcode</p>