中心UIButton文本的浮动操作按钮,如收件箱应用程序

时间:2015-06-24 11:57:53

标签: ios swift uibutton uilabel

floatingButton = UIButton(x: blocx, y:blocy, width: imageSize, height: imageSize, target: self, action: "clickedFloatingButton")
floatingButton!.backgroundColor = CozyColors.StatCardSkip
floatingButton!.layer.cornerRadius = floatingButton!.frame.size.width / 2
floatingButton!.setTitle("+", forState: UIControlState.Normal)
floatingButton!.setTitleColor(CozyColors.ThemeWhite, forState: UIControlState.Normal)
floatingButton!.titleLabel?.font = UIFont(name: CozyStyles.ThemeFontName, size: imageSize*2/3)
view.addSubview(floatingButton!)

结果如下:

inbox app floating button action

如您所见,加号按钮未正确对齐中心。如何在不添加UILabel作为子视图的情况下将其正确放在中间?

4 个答案:

答案 0 :(得分:3)

试试这段代码:

    var floatingButton = UIButton(frame: CGRectMake(10, 20, 50, 50))
    floatingButton.backgroundColor = UIColor.redColor()
    floatingButton.layer.cornerRadius = floatingButton.frame.size.width / 2
    floatingButton.setTitle("+", forState: UIControlState.Normal)
    floatingButton.setTitleColor(UIColor.whiteColor(), forState: UIControlState.Normal)
    floatingButton.titleLabel?.font = UIFont(name: floatingButton.titleLabel!.font.familyName , size: 50)
    floatingButton.titleEdgeInsets = UIEdgeInsetsMake(-10, 0, 0, 0)
    view.addSubview(floatingButton)

答案 1 :(得分:2)

您可以如下设置标题边缘插入。更改其值并将标题设置为中间。

floatingButton.titleEdgeInsets = UIEdgeInsetsMake(-24, 0, 0, 0);

根据以下功能变化值。

func UIEdgeInsetsMake(top: CGFloat, left: CGFloat, bottom: CGFloat, right: CGFloat) -> UIEdgeInsets

答案 2 :(得分:2)

嗯,我认为更简单的方法就是为它设置背景图像

    floatingButton.setBackgroundImage(UIImage(named: "icon.png"), forState: UIControlState.Normal)

您可以应用转换或从Google

中查找类似的图片

enter image description here

背景图片在这里

enter image description here

答案 3 :(得分:1)

您只需使用UIBezierPath绘制按钮,这是您的代码:

import UIKit

class PushButtonView: UIButton {

    override func drawRect(rect: CGRect) {
        var path = UIBezierPath(ovalInRect: rect)
        UIColor.redColor().setFill()
        path.fill()

        //set up the width and height variables
        //for the horizontal stroke
        let plusHeight: CGFloat = 3.0
        let plusWidth: CGFloat = min(bounds.width, bounds.height) * 0.6

        //create the path
        var plusPath = UIBezierPath()

        //set the path's line width to the height of the stroke
        plusPath.lineWidth = plusHeight

        //move the initial point of the path
        //to the start of the horizontal stroke
        plusPath.moveToPoint(CGPoint(x:bounds.width/2 - plusWidth/2 + 0.5, y:bounds.height/2 + 0.5))

        //add a point to the path at the end of the stroke
        plusPath.addLineToPoint(CGPoint(x:bounds.width/2 + plusWidth/2 + 0.5, y:bounds.height/2 + 0.5))

        //Vertical Line

        //move to the start of the vertical stroke
        plusPath.moveToPoint(CGPoint(x:bounds.width/2 + 0.5, y:bounds.height/2 - plusWidth/2 + 0.5))

        //add the end point to the vertical stroke
        plusPath.addLineToPoint(CGPoint(x:bounds.width/2 + 0.5, y:bounds.height/2 + plusWidth/2 + 0.5))

        //set the stroke color
        UIColor.whiteColor().setStroke()

        //draw the stroke
        plusPath.stroke()
    }
}

你的结果将是:

enter image description here

您可以参考THIS示例项目获取更多信息。您可以根据需要进行修改。

希望它会对你有所帮助。