Xcode外掛： 編碼效率神器 FlyCoding

SSBun發表於2018-09-03
XCode

Xcode外掛： 編碼效率神器 FlyCoding

FlyCoding - Xcode版 Emmet

⚠️ 請使用 Swift 4.2 編譯 ⚠️

FlyCoding 是一個 Xcode 外掛，使用蘋果提供的外掛機制編寫，可以執行在最新的Xcode上， 它提供了類似於前端中 Emmet 的功能。你可以通過特殊語法來快速的生成你想要的 Swfit / Objective-C 程式碼，特別是在大量的編寫介面 UI 時， 重複的編寫 UI 控制元件和約束是一件非常繁瑣和機械的勞動， 但是這又是你不可避免的。 而 FlyCoding 則可以幫助你快速的生成屬性、方法、約束（Masonry / SnapKit），目前 FlyCoding 剛剛釋出了第一個版本，更多的功能還在構思當中，希望大家提供寶貴的意見和想法。

目前開發進度：
  • [x] Objective-C / Swift 屬性生成
  • [x] Objective-C / Swift 檢視的快速建立
  • [x] Masonry / SnapKit 約束生成
  • [x] 快速生成方法
  • [x] 任何完整操作都可以使用 ' + ' 進行分隔， 使用 '* N' 進行批量操作

屬性生成

Swift屬性生成

  • 單個屬性
pv.UIImageView
// pv 是屬性控制，p 是 private， v 是 var，具體的列表可以在後文中檢視; . 用於區分屬性和類名
private var <#name#>: UIImageView
複製程式碼
  • 可選屬性
fv.UILabel?
// fv 是屬性控制， f 是 fileprivate, v 是 var; ？表示屬性是可選的
fileprivate var <#name#>: UILabel?
複製程式碼
  • 有預設值的屬性
Pl.UIView{}
// Pl 是屬性控制， P 是 public, l 是 let; {} 表示有預設值
// 預設值使用 Class() 來生成
// 如果有預設值，就不會再顯示型別，因為 Swift 可以自己推斷型別
public let <#name#> = UIView()


Pl.Int{100}
// 如果在 ｛｝ 裡面新增預設值，會直接使用此預設值
public let <#name#> = 100
複製程式碼
  • 懶載入屬性
lv.UIButton
// lv 是屬性控制，lv 是一個特殊的組合,分來時 l 表示 let, v 表示 var; 合併在一起時表示 lazy var
lazy var <#name#>: UIButton = {
    <#code#>
}()
複製程式碼
  • OC可訪問屬性
@Pv.UIImageView
// 新增 @ 將把屬性標記為 @objc
@objc public var <#name#>: UIImageView
複製程式碼
  • 特殊的屬性標識
 wv.EatProtocol?
// 新增 w 將把屬性標記為 weak, 除了 w 之外，還有 u/unowned、 c/class 和 s/static
weak var <#name#>: EatProtocol?
複製程式碼
  • 批量生成屬性
pl.UILabel{} *2
// *2 中間不能有空格， 一般用於編寫資料模型，或是編寫 UI 時使用
private let <#name#> = UILabel()
private let <#name#> = UILabel()
複製程式碼

Tips： 如果屬性沒有寫標記，會自動使用 let 來標記屬性

.UIImageView 

 let <#name#>: UIImageView
複製程式碼

Swift 屬性標記快速查詢表

符號 標記
l Let
v var
p private
P public
o open
f fileprivate
pl private let
pv private var
ol open let
Ov open var
fl fileprivate let
fv fileprivate var
lv Lazy var
-- --
@ @objc
u unowned
w weak
c class
s static

Objective-C屬性生成

Objective-C 中的使用語法和 Swift 區別不大，主要是關鍵字和生成的樣子不同

  • 單個屬性
.UIImageView *
// 預設描述就是 nonatomic, strong
@property (nonatomic, strong) UIImageView *<#name#>
複製程式碼
  • 生成完整屬性
c.NSString *name;
// 如果在末尾新增 ' ; ' 表示 Class 後面已經銜接了屬性名， 為了方便快速編碼
@property (nonatomic, copy) NSString *name;
複製程式碼

Tips： class 可以用來標記類屬性

Objective-C 屬性標記快速查詢表

符號 標記
s strong
w weak
a assign
r readonly
g getter=<#getterName#>
c copy
n nullable
N nonnull
C class

生成約束程式碼

我選取了最常用的兩個框架來實現， 在 Objective-C 中使用 Masonry，而在 Swift 當中使用 SnapKit。

SnapKit

  • 新增布局
 #snpm(iconView, e=self)
 // snpm 就是 makeConstraints， 在 （） 中使用，號來分割各個語句
 // 第一個引數是要新增約束的物件，剩下的都是佈局語句
 // 每個語句都分為三個部分，左邊是被約束物件的屬性，中間是約束方式，
 // 而右邊是約束的值或是其它的約束物件
 iconView.snp.makeConstraints {
    $0.edges.equalTo(self)
 }
複製程式碼
  • 更新佈局
#snpu(iconView, h=100)
// snpu 是 updateConstraints
iconView.snp.updateConstraints {
    $0.height.equalTo(100)
}
複製程式碼
  • 重置佈局
#snprm(iconView, r=self - 20)
// snprm 是 remakeConstraints
iconView.snp.remakeConstraints {
    $0.right.equalTo(self).offset(-20)
}
複製程式碼
  • 佈局演示 1 (相對距離)
#snpm(iconView, r=titleLabel.l-20, wh=20)
// 更加直觀的使用 + - 來進行相對距離的設定
iconView.snp.makeConstraints {
    $0.right.equalTo(titleLabel.snp.left).offset(-20)
    $0.width.height.equalTo(20)
}
複製程式碼
  • 佈局演示 2 (+-的作用)
#snpm(iconView, t=titleLabel.b-superView.height-20, wh=100)
// 在約束語句中，第一個加減號除了有正負的含義，還是分割前後語句的標記
 iconView.snp.makeConstraints {
    $0.top.equalTo(titleLabel.snp.bottom).offset(-superView.height-20)
    $0.width.height.equalTo(100)
}
複製程式碼
  • 佈局演示 3 (比例約束)
#snpm(iconView, wh=self/2)
// 進行比例約束也是常用的約束手法
iconView.snp.makeConstraints {
    $0.width.height.equalTo(self).dividedBy(2)
}

// 相同作用 
#snpm(iconView, wh=self*0.5)
// 使用 * 法當然也是可以的
iconView.snp.makeConstraints {
    $0.width.height.equalTo(self).multipliedBy(0.5)
}
複製程式碼
  • 佈局演示 4 (比較)
#snpm(titleLabel, tl=self, r<=self - 20)
// 常用的根據文字的長度自適應寬度
// 也可以使用 >= 表示大於等於
 titleLabel.snp.makeConstraints {
    $0.top.left.equalTo(self)
    $0.right.lessThanOrEqualTo(self).offset(-20)
}
複製程式碼
  • 佈局演示 4 (約束等級)
#snpm(iconView, l = self, r <= superView~20, r <= titleLabel.l - 20~h)
// 在約束語句的最後使用 ～ 可以用來設定約束登記
// 你可以使用數字來表示約束登記，也可以使用 r\h\m\l 來標記
 iconView.snp.makeConstraints {
    $0.left.equalTo(self)
    $0.right.lessThanOrEqualTo(superView).priority(20)
    $0.right.lessThanOrEqualTo(titleLabel.snp.left).offset(-20).priority(.high)
}
複製程式碼

SnapKit 屬性標記快速查詢表

  • 屬性
符號 屬性
l left
t top
b bottom
r right
w width
h height
x centerX
y centerY
c center
s size
e edges
--- 約束等級
r .required
h .high
m .medium
l .low
--- 比較引數
>= greaterThanOrEqualTo
<= lessThanOrEqualTo
= equalTo
--- 運算子號
- Offset(-value)
+ Offset(value)
* multipliedBy(value)
/ dividedBy(value)

Masonry

主要的用法和 SnapKit 一致， 下面主要說不同點

  • 建立、更新、重置
@masm(iconView, e=self)   // 建立
@masu(iconView, e=self)    // 更新
@masrm(iconView, e=self)  // 重置
複製程式碼

Tips: 在 OC 中可以使用 @ 作為命令的字首，主要是 # 在OC檔案中會自動變第一列， 影響程式碼結構

  • 約束中沒有 r 這個等級了
  • 比較裡面新加了 == / >== / <==， 主要是相比少一個 = 的版本，在前面加上了 mas_
@masm(iconView, e=self)   // 建立
@masu(iconView, e=self)    // 更新
@masrm(iconView, e=self)  // 重置
複製程式碼

檢視的快速建立

這部分使用 Xcode 的程式碼塊也可以實現，但是寫程式碼的時候，打出了對應的短語後還要看一眼和等待Xcode反應實在是令人著急。我們為的就是快！！！並且我們可以直接賦予檢視一個變數名，而程式碼塊還是不行的

通過 #make 命令我們可以快速的新增建立一個 View 的程式碼

這是目前支援的建立型別

  • UIView

  • UILabel

  • UIButton

  • UIImageView

  • UITableView

  • UICollectionView

  • 普通建立 UIImageView

#make(UIImageView)
// 生成 Swift 檢視
let <#name#>  = UIImageView()
<#name#>.backgroundColor = <#color#>
<#name#>.image = <#image#>
<#superView#>.addSubview(<#name#>)
// 生成 OC 檢視
UIImageView *<#name#> = [[UIImageView alloc] init];
self.<#name#> = <#name#>;
<#name#>.backgroundColor = <#color#>;
<#name#>.image = <#image#>;
[<#superView#> addSubview: <#name#>];
複製程式碼
  • 設定屬性名建立 UILabel
@make(UILabel, titleLabel)
// 生成 Swift 檢視
let titleLabel = UILabel()
titleLabel.font = <#font#>
titleLabel.textColor = <#color#>
titleLabel.text = <#text#>
titleLabel.backgroundColor = <#color#>
<#superView#>.addSubview(titleLabel)
// 生成 OC 檢視
UILabel *titleLabel = [[UILabel alloc] init];
self.titleLabel = titleLabel;
titleLabel.font = <#font#>;
titleLabel.textColor = <#color#>;
titleLabel.text = <#text#>;
titleLabel.backgroundColor = <#color#>;
[<#superView#> addSubview:titleLabel];
複製程式碼

建立方法

Swift

  • 建立方法
#func(eat)
// 生成一個簡單的方法
func eat() {
    <#code#>
}
複製程式碼
  • 設定許可權的方法
#func(@p.run)
// 標記和屬性一樣
@objc private func run() {
    <#code#>
}
複製程式碼
  • 有引數的方法
#func(run::)
// 一個 ： 代表有一個引數
func run(<#name#>: <#type#>, <#name#>: <#type#>) {
    <#code#>
}
複製程式碼
  • 有返回值的方法
#func(run>)
// 一個 > 代表有一個返回值
func run() -> <#return#> {
    <#code#>
}
// 多個返回值會返回元組
#func(run>>)
func run() -> (<#return#>, <#return#>) {
    <#code#>
}
複製程式碼

Objective-C

  • 建立方法
#func(run)
// 生成一個簡單的方法
- (void)run {
    <#code#>
}
複製程式碼
  • 有返回值的方法
#func(run>)
// 一個 > 代表有一個返回值
- (<#type#>)run {
    <#code#>
}
複製程式碼
  • 有引數的方法
#func(run::)
// 一個 ： 代表有一個引數
- (void)run:(<#type#>)<#param0#> <#name1#>:(<#type#>)<#param1#> {
    <#code#>
}
複製程式碼

通用語法功能

  • 批量處理： 以上所有的命令都可以通過後接 *n 進行批量的生成
  • 多命令執行： 你可以通過 + 連續的編寫多句命令一塊生成

希望大家提出寶貴的意見和建議, 你可以提出 issue 或是發郵件到 caishilin@yahoo.com

#End

相關文章