swift 3:创建材料设计芯片
swift 3:创建材料设计芯片
提问于 2016-10-04 13:43:53
嘿嘿，
从几天以来，我试图创造“材料-设计-芯片”，但只有一半成功。
我最成功的尝试是从"Button“创建一个子类(Button是从UIButton创建的一个子类，由宇宙心智在他的MaterialDesign中创建)。
对于那些不知道的人来说，我的意思是“薯片”：单击此处
我的例子：
简单/不可脱的芯片
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
}
}要创建这个按钮：
let button = ChipButton()
button.title = "default chip"
view.layout(button).height(32).center(offsetY: -150)接触式芯片/图标芯片
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)
}
}在这里我想
- 将UIImageView调整为芯片的高度( 32点) 我尝试使用self.imageView?.frame = CGRect(x: 50，y: 50，宽度: 32，身高: 32)，但是没有什么变化。
- 调整UIImage的大小，稍微小一点(到20点)
- 更改tintColor的UIImage 我试着使用self.imageView?.tintColor = Color.black，但是没有什么改变
可拆化芯片
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)
}
}在这里，我试图切换标签的位置，并使用imageEdgeInsets和titleEdgeInsets，但是self.frame.size.width返回了一个不正确的宽度(可能是AutoLayout，但我不确定)
帮助
希望有人能帮我！
ps。我是斯威夫特/xcode的新手
回答 1
Stack Overflow用户
发布于 2016-10-06 06:03:05
简单/不可脱的芯片
这里什么都没变。看看这个问题。
接触式芯片/图标芯片
import UIKit
import Material
class ChipIconButton: ChipButton {
public convenience init(image: UIImage?, title: String?){
self.init()
prepare(with: image, title: title)
}
private func prepare(with image: UIImage?, title: String?) {
//self.imageView?.frame = CGRect(x: 0, y: 0, width: 60, height: 60)
let myThumb = image?.resize(toWidth: 20)?.resize(toHeight: 20)
let shapeView = UIView(frame: CGRect(x: 0, y: 0, width: 32, height: 32))
shapeView.backgroundColor = UIColor.darkGray
shapeView.cornerRadiusPreset = .cornerRadius5
shapeView.zPosition = (self.imageView?.zPosition)! - 1
self.addSubview(shapeView)
self.image = myThumb?.withRenderingMode(.alwaysTemplate)
self.title = title
self.imageView?.tintColor = self.backgroundColor
self.imageEdgeInsets = EdgeInsets(top: 0, left: -28, bottom: 0, right: 0)
self.titleEdgeInsets = EdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
self.contentEdgeInsets = EdgeInsets(top: 0, left: 20, bottom: 0, right: 12)
}
}造物被剪短：
open func prepareChipIconButton () {
let icon: UIImage? = #imageLiteral(resourceName: "ic_close_white_24px")
let button = ChipIconButton(image: icon, title: "icon chip")
view.layout(button).height(32).center(offsetY: 0)
}可拆化芯片
import UIKit
import Material
class ChipDeleteableButton: ChipButton {
override func prepare() {
super.prepare()
let img = #imageLiteral(resourceName: "ic_close_white_24px").resize(toHeight:18)?.resize(toWidth: 18)
let myThumb = img?.withRenderingMode(.alwaysTemplate)
self.image = myThumb
self.title = title
self.imageView?.tintColor = self.backgroundColor
self.isUserInteractionEnabled = true
self.addTarget(self, action: #selector(clickAction), for: .touchUpInside)
self.imageView?.isUserInteractionEnabled = false
}
open func swapLabelWithImage() {
let rightLableSize = self.titleLabel?.sizeThatFits((self.titleLabel?.frame.size)!)
self.imageEdgeInsets = EdgeInsets(top: 0, left: (rightLableSize?.width)! - 4, bottom: 0, right: 0)
self.titleEdgeInsets = EdgeInsets(top: 0, left: -54, bottom: 0, right: 0)
self.contentEdgeInsets = EdgeInsets(top: 0, left: 20, bottom: 0, right: 4)
let shapeView = UIView(frame: CGRect(x: self.imageEdgeInsets.left + 19, y: 6, width: 20, height: 20))
shapeView.backgroundColor = UIColor.darkGray
shapeView.cornerRadius = shapeView.frame.size.width/2
shapeView.zPosition = (self.imageView?.zPosition)! - 1
shapeView.isUserInteractionEnabled = false
self.addSubview(shapeView)
}
internal func clickAction(sender: ChipDeleteableButton) {
print("do something")
}
}造物被剪短：
open func prepareChipDeleteableButton () {
let button = ChipDeleteableButton()
button.title = "deleteable chip"
button.swapLabelWithImage()
view.layout(button).height(32).center(offsetY: 150)
}更多信息：
- 在我的ViewController中调用的创建函数r，在viewWillAppear()中
- 为什么我有一个额外的功能，我的可去食芯片？？因为我让AutoLayout做他的工作，然后我可以得到它的标签的必要的“字符串宽度”与let
rightLableSize = self.titleLabel?.sizeThatFits((self.titleLabel?.frame.size)!)。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/39853952
复制相关文章
相似问题
腾讯云开发者
