iOS 앱을 새로 개발한 학생 엔지니어에게 UITObBar의 맞춤형 제작은 지옥이다

11868 단어 iOSSwift
아이폰 XR, XS, XS 맥스도 지원한다.
저는 원래 웹 앱을 개발한 사람이기 때문에 스마트폰 애플리케이션의 UI도 웹뷰로 씁니다.(정확히 말하면 Ionic, OnnsenUI 같은) 웹 UI에도 로컬 UI 못지않게 공을 들였지만 애니메이션, 장치 센서 등 조작에 있어서는 현지인에 못 미쳤다.
그래서 iOS의 로컬 UI(UIKit)로 헬프데스크를 만들고 싶었지만, 웹 세계에 사는 사람들에게'React yabee! Anglar yabee'는 고통스러운 예여서 메모 대신 정리했다.

UITABar 아이콘의 제목을 삭제하려면 다음과 같이 하십시오.


iOS 표준의 TabBar가 바로 이런 느낌이죠.아이콘 아래에 제목이 있는 일반 UI입니다.

하지만 인스타그램의 탭바처럼 아이콘이 간단한 것만 원하는 경우도 있다.

처음에 나는 disableLabel = true이런 속성false이 사라질 것이라고 낙관했지만 도무지 없었다!
https://developer.apple.com/documentation/uikit/uitabbaritem를 보면 title의 Getter setter 속성이 있습니다.
그러니 오버라이드title를 해보자.이렇게 하면 탭은 사라지지만 아이콘의 위치는 이동하기 때문에 이미지 Insets도 override로 위치를 조정합니다.
CustomTabBarItem.swift
import UIKit

class CustomTabBarItem: UITabBarItem {

    override var title: String? {
        get {
            return nil
        }

        set {
            super.title = title
        }
    }


    override var imageInsets: UIEdgeInsets {
        get {
            return UIEdgeInsets(top: 5, left: 0, bottom: -5, right: 0)
        }

        set {
            super.imageInsets = imageInsets            
        }
    }

}

iOS 11에서 UIEdgeInsets 아이콘을 조정해도 천지 중앙이 되지 않습니다!


이런 느낌이에요.어쨌든 top,bottom,right,left는 모두 0으로 설정되었다.
사용#available iOS 11의 오프셋만 0이고 iOS 11 이하 버전도 지원할 수 있습니다.
CustomTabBar.swift
class CustomTabBar: UITabBar {

override func layoutSubviews() {
    super.layoutSubviews()

    var offset: CGFloat = 6.0

    if #available(iOS 11.0, *), traitCollection.horizontalSizeClass == .regular {
        offset = 0.0
    }

    let imageInset = UIEdgeInsets(
        top: offset,
        left: 0.0,
        bottom: -offset,
        right: 0.0
    )

    for tabBarItem in items ?? [] {
        tabBarItem.title = ""
        tabBarItem.imageInsets = imageInset
    }
}

UITTabBar의 높이를 변경하고 싶습니다.


TabBar의 높이를 사용자정의하려면 UITABar의 상속 클래스func sizeThatFits를 생성합니다.
이때 주의해야 할 것은 아이폰X, XR, XS 등 이상한 화면에 남아도는 단말기 디자인으로 획기적인 단말기에 적합하다는 것이다.지금까지 홈페이지 버튼이 있는 곳이 화면으로 바뀌기 때문에 그에 상응하는 높이에 탭바의 높이를 더하지 않으면 탭바는 아이폰X의 원형 가장자리로 떨어져 비참한 일이 된다.
추기self.safeAreaInsets.bottom에서 안전구역 아래 높이를 얻을 수 있지만 이 값은 실행viewWillLayoutSubviews 후에 업데이트됩니다.즉, viewWillLayoutSubviews는 실행하기 전에 0UIApplication.shared.windows[0].safeAreaInsets.bottom으로 돌아간다.
import UIKit

class CustomUITabBar: UITabBar {

    // ここでTabBarの高さを設定
    let tabBarHeight: CGFloat = 70

    override func sizeThatFits(_ size: CGSize) -> CGSize {
        super.sizeThatFits(size)

        let safeAreaBottom = UIApplication.shared.windows[0].safeAreaInsets.bottom

        var size = super.sizeThatFits(size)

        if #available(iOS 11.0, *) {
            size.height = safeAreaBottom + tabBarHeight
        } else {
            size.height = tabBarHeight
        }

        return size
    }
}

아이콘 색상을 바꾸고 싶은데 RGB 표시가 너무 재미없어요.


iOS 근처에서는 일반적인 방법일 수 있지만 UIColorUIColor(red:0.20, green:0.20, blue:0.20, alpha:1.0)를 지정하려면 RGB+알파로 지정해야 한다.나처럼 웹 페이지를 만드는 사람이 보기에는 너무 번거롭다.CSS (예, 저는 Sass) 처럼 #333333 16진수를 지정하고 싶습니다.
인티리얼라이저UIColorhex의 매개 변수로 확장alpha하여 내부에서 일반적인 RGB로 수정합니다.중점은 HEx를 String로 하는 것이다.수치형이라면 0x 맨 앞에 놓아야 한다.CSS를 만지작거리는 사람에게0xFFFFFF는 좀 징그럽다.
import UIKit

extension UIColor {
    convenience init(hex: String, alpha: CGFloat = 1.0) {
        if hex.count == 6 {
            let red: CGFloat = CGFloat((rgb & 0xFF0000) >> 16) / 255.0
            let green: CGFloat = CGFloat((rgb & 0x00FF00) >> 8) / 255.0
            let blue: CGFloat = CGFloat(rgb & 0x0000FF) / 255.0
        }

        self.init(red: red, green: green, blue: blue, alpha: alpha)
    }
}

좋은 웹페이지 즐겨찾기