Swift設(shè)置UILabel內(nèi)邊距的實(shí)例代碼

更新時(shí)間：2021年10月13日 16:34:13 作者：我為雙魚(yú)狂

有時(shí)候,我們需要一個(gè)顯示文字,又想這些文字與邊界之間有自定義的邊距,所以下面這篇文章主要給大家介紹了關(guān)于Swift設(shè)置UILabel內(nèi)邊距的相關(guān)資料,需要的朋友可以參考下

摘要

拿來(lái)即用短時(shí)間效率雖然挺高的，但是拿來(lái)的東西沒(méi)有消化一次，就無(wú)法得心應(yīng)手的使用它。

這次的探索思路就是，查詢官方文檔，設(shè)置不同的值測(cè)試單個(gè)方法中參數(shù)的變化，之后測(cè)試兩個(gè)方法的執(zhí)行順序，處理的思路，最后思考總結(jié)。

在總結(jié)方法的處理邏輯時(shí)，使用偽代碼的方式梳理方法的執(zhí)行思路。避免解釋文本太多，增加理解的成本。

最近在學(xué)習(xí)小程序開(kāi)發(fā)，接觸到 flex 方式布局，很喜歡這種快速和方便的方式。所以當(dāng)遇到一個(gè)頁(yè)面上居中顯示文本的需求的時(shí)候，就想直接在 UIlabel 上處理，然后在UIlabel上設(shè)置它的內(nèi)邊距（類似 flex 布局）。而不是先放一個(gè) View。然后在這個(gè)view 上放置一個(gè) UILabel 控件，通過(guò)設(shè)置 UILabel 控件距離父 View 的距離實(shí)現(xiàn)。

先看代碼實(shí)現(xiàn)，下面的代碼，是搜索之后的解決方式，如果只是拿去使用，直接復(fù)制到項(xiàng)目中即可。需要在設(shè)置text前設(shè)置textInsets

class SHLabel: UILabel {

   var textInsets: UIEdgeInsets = .zero

   override func drawText(in rect: CGRect) {
       super.drawText(in: rect.inset(by: textInsets))
   }
   
   override func textRect(forBounds bounds: CGRect, limitedToNumberOfLines numberOfLines: Int) -> CGRect {
       
       let insets = textInsets
       var rect = super.textRect(forBounds: bounds.inset(by: insets), limitedToNumberOfLines: numberOfLines)
       
       rect.origin.x -= insets.left
       rect.origin.y -= insets.top
       rect.size.width += (insets.left + insets.right)
       rect.size.height += (insets.top + insets.bottom)
       return rect
   }
}

為什么這種方式可以實(shí)現(xiàn)內(nèi)邊距？

接下來(lái)是梳理一下，為什么這樣實(shí)現(xiàn)。首先查看開(kāi)發(fā)者文檔，看代碼塊中這兩個(gè)方法是做什么的

函數(shù)	drawText(in rect: CGRect)	textRect(forBounds bounds:, limitedToNumberOfLines numberOfLines) -> CGRect
標(biāo)題	在rect的區(qū)域中繪制文本或者陰影	返回文本的繪制的 rect 區(qū)域
詳細(xì)	如果需要修改 label 中的繪圖行為，需要重寫這個(gè)方法。這個(gè)方法已經(jīng)配置用于繪圖的默認(rèn)環(huán)境和文本顏色，在重寫的方法中，可以自定義繪制方法，然后調(diào)用super或者自己進(jìn)行繪圖。	在系統(tǒng)執(zhí)行其他文本計(jì)算之前重寫這個(gè)方法（這個(gè)太難理解），如果調(diào)用 sizeToFit()和sizeThatFits(_:)會(huì)觸發(fā)這個(gè)方法
鏈接	https://developer.apple.com/documentation/uikit/uilabel/1620527-drawtext	https://developer.apple.com/documentation/uikit/uilabel/1620545-textrect

之后驗(yàn)證這兩個(gè)方法的執(zhí)行順序，和各自的作用時(shí)，發(fā)現(xiàn)當(dāng) UILabel 的 text 賦值時(shí)，會(huì)首先調(diào)用textRect方法，之后drawText方法被調(diào)用。

textRect在當(dāng)文本rect的實(shí)際寬度大于設(shè)置UILabel的實(shí)際寬度時(shí)，會(huì)再次被調(diào)用，當(dāng)然drawText也是在textRect兩次調(diào)用之后被調(diào)用。

textRect 的作用

看到這里，似乎可以理解開(kāi)發(fā)者文檔中提到的在系統(tǒng)執(zhí)行其他文本計(jì)算之前重寫這個(gè)方法了。這個(gè)方法的作用就是先獲取 UILabel 的 bounds 和 text 的行數(shù)，通過(guò)調(diào)用 super 方法計(jì)算出 text 的 rect 區(qū)域，返回給系統(tǒng)。

經(jīng)過(guò)多次測(cè)試驗(yàn)證發(fā)現(xiàn)執(zhí)行邏輯（偽代碼）：

  // frame 是設(shè)置 UIlabel 時(shí)的 frame
  if numberOfLines == 1 {
      textRect 被調(diào)用
      return retc 的 width = text 的 widht
  } else {
      if text 文本的 width < frame 的 width {
          text Rect 被調(diào)用
          return retc 的 width = text 的 widht
      } else {
          text Rect 被調(diào)用兩次后
   
          以 frame 的 wdith 為限制，計(jì)算出 text 的 height
          return rect 的 size = (frame 的 width，text 的 height)
      }
  }

drawText 的作用

看drawText中的rect參數(shù)，就是textRect方法返回的rect。text文本的實(shí)際繪制區(qū)域就通過(guò)重寫drawText方法，并在其中調(diào)用它的super方法實(shí)現(xiàn)。

經(jīng)過(guò)多次驗(yàn)證，這里的rect并不完全是textRect方法中返回的rect。它們之間的關(guān)系是（偽代碼）：

  // frame 是設(shè)置 UILabel 的 frame
  // rect 是 `textRect` 返回的
  dx = frame.x
  dy = frame.y
  if frame.width 確定不變 {
      dwidth = frame.width
  } else {
      dwidth = rect.width
  }
  if frame.height 確定不變 {
      dheight = frame.height
  } else {
      dheight = rect.width
  }
   
  return drawText 中的 rect(dx,dy,dwidth,dheight)

再問(wèn)：為什么用這種方式實(shí)現(xiàn)內(nèi)邊距？

耐心看完這兩個(gè)方法之后，對(duì)題目中的問(wèn)題，多少有些思路了。那么就理順一下這個(gè)思路。

首先確定一個(gè)共識(shí)，就是設(shè)置UILabel的內(nèi)邊距，是確定UILabel的frame區(qū)域里面，調(diào)整text的顯示區(qū)域。有了這個(gè)共識(shí)，接下來(lái)就好辦了。

第一步就要用textRect方法獲取到text的顯示區(qū)域，默認(rèn)text的顯示區(qū)域和UILabel的bounds區(qū)域是一樣的
那就需要和咱們自己設(shè)置的內(nèi)邊距值計(jì)算獲取到新的text文本的rect區(qū)域。
最后就用drawText方法重新繪制一下text的rect區(qū)域顯示。

那么為什么要用這種方式實(shí)現(xiàn)呢？因?yàn)槟壳爸挥羞@兩個(gè)方法和 text 文本直接有關(guān)系。

優(yōu)化

理論搞了這么多，到了輸出一些干貨的時(shí)候了。

如果，UILabel的frame已經(jīng)確定了，重要的是width和height確定了。那么textRect方法就可以不用重寫。

class SHLabel: UILabel {

   var textInsets: UIEdgeInsets = .zero
   override func drawText(in rect: CGRect) {
       super.drawText(in: rect.inset(by: textInsets))
   }
}

這里就可以看出，當(dāng)UILabel的height不確定時(shí)，重寫textRect來(lái)幫忙確定UILabel的高度。經(jīng)過(guò)驗(yàn)證下來(lái)，這個(gè)方法中的 x 和 y 也是不用處理的，什么時(shí)候會(huì)用到它？我目前還沒(méi)有遇到。

class SHLabel: UILabel {

   var textInsets: UIEdgeInsets = .zero

   override func drawText(in rect: CGRect) {
       super.drawText(in: rect.inset(by: textInsets))
   }
   
   override func textRect(forBounds bounds: CGRect, limitedToNumberOfLines numberOfLines: Int) -> CGRect {
       let insets = textInsets
       var rect = super.textRect(forBounds: bounds.inset(by: insets), limitedToNumberOfLines: numberOfLines)

//       rect.origin.x -= insets.left
//       rect.origin.y -= insets.top
       rect.size.width += (insets.left + insets.right)
       rect.size.height += (insets.top + insets.bottom)
       return rect
   }
}

擴(kuò)展

文章到這里，就結(jié)束了。如果你是一個(gè)細(xì)節(jié)控，感覺(jué)textRect在需要還是不需要的時(shí)候都被調(diào)用。drawText方法，不管設(shè)置還是不設(shè)置內(nèi)邊距也總是被調(diào)用，會(huì)不會(huì)影響性能??？

這里提供兩個(gè)方法解決：

可操作性的，就是盡量考慮需求，在不得不用的時(shí)候再使用
心理安慰性質(zhì)的，那就是放下。細(xì)想一下，這兩個(gè)方法都是重寫的方法，重寫的本質(zhì)是什么？那就是不執(zhí)行自己的方法，執(zhí)行重寫的方法。換句話說(shuō)，就算系統(tǒng)不走重寫的方法，也要走自己的方法。而這些代碼對(duì)性能的影響，不值一提。