中心的UIButton文本浮動操作按鈕狀的Inbox應用

Question

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!) 

下面是結果：

正如你所看到的加號按鈕沒有正確對齊到中心。如何在不添加UILabel作爲子視圖的情況下將它放在正確的位置？

Answer 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() 
    } 
} 

而你的結果將是：

你可以參考THIS樣本項目的更多信息。你可以根據你的需要修改它。

希望它會幫助你。

Answer 2

如下設置您的標題邊緣插入。更改其值並設置標題中間。

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

根據下面的函數改變值。

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

Answer 3

嗯，我認爲一個更簡單的方法是剛剛設置的背景圖像它

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

你可以申請從谷歌

變換或找到類似的圖像背景圖片在這裏

Answer 4

試試這個代碼：

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)