การใช้ Custom Font และ การเซ็ต View Radius
ในบางโปรเจ็คลูกค้าอาจจะต้องการใช้ฟอนท์ในแบบที่เขาเลือก เรามาดูกันว่าเราจะ import custom fonts มาใช้ในโปรเจ็คยังไง
1. Font จะมีไฟล์นามสกุล .ttf
2. Import font เข้าในโปรเจ็ค แนะนำให้สร้าง Foder Font เพื่อจะได้เป็นหมวดหมู่
3. ไป Set font ใน Info โดย
Project Name -> Info -> Add Bundle Name จากนั้นเลือก Fonts Provide by application ใส่ชื่อฟอนท์ที่ import ไว้ทีละตัวจนครบ
การเซ็ต Custom Font
การใช้งาน Custom Font
1. เพิ่ม UILabel Custom class เพื่อให้ใช้งานง่าย ดูในไฟล์ UILabel+CustomUI.swift
import UIKit
class customUILabel: UILabel {
init(text: String,
color: UIColor = Color.white,
fontsize: CGFloat = 16,
fontweight: Fontweight = .regular,
isShadow: Bool = false
) {
super.init(frame: .zero)
var fontstyle: UIFont
// Note: – Font weight
switch fontweight {
case .semibold : fontstyle = UIFont.Prompt.semibold.size(fontsize, textStyle: .body)
case .bold : fontstyle = UIFont.Prompt.bold.size(fontsize, textStyle: .body)
case .extraBold : fontstyle = UIFont.Prompt.extraBold.size(fontsize, textStyle: .body)
default : fontstyle = UIFont.Prompt.regular.size(fontsize, textStyle: .body)
}
numberOfLines = 3
textColor = color
adjustsFontSizeToFitWidth = true
attributedText = NSAttributedString(
string: text,
attributes: [.font: fontstyle])
textAlignment = .center
// Note: – Add Shadow
if isShadow {
self.layer.shadowColor = Color.gray.cgColor
self.layer.shadowRadius = 2.0
self.layer.shadowOpacity = 0.8
self.layer.shadowOffset = CGSize(width: 2, height: 2)
self.layer.masksToBounds = false
}
}
required init?(coder: NSCoder) {
fatalError(“init(coder:) has not been implemented”)
}
}
2. การเรียกใช้ custom class ใน ViewController
private let headerText: UILabel = {
let text = customUILabel(text: “Radius All Corners”, fontsize: Fontsize.extraLarge, fontweight: .semibold)
return text
}()
3. เรียกแสดงผล UILabel ใน ViewDidLoad()
// Note: – Header
view.addSubview(headerText)
headerText.centerX(inView: view)
headerText.anchor(top: view.safeAreaLayoutGuide.topAnchor, paddingTop: Padding.size24px)
4. สำหรับการตั้งค่า Constriant ให้ดูในไฟล์ UIView+Extension.swift
How to custom Radius style WGO
การใช้งานก็แสนง่ายเพราะ WGO เตรียมฟังก์ชั่นไว้เรียบร้อยแล้ว ลองเข้าไปดูในไฟล์ ViewWithRadiusViewController.swift และดูการตั้งค่าค่ะ
Git Repository
ดูการเซ็ตอัพโปรเจ็คได้ที่ branch ViewWithRadius