web-dev-qa-db-ja.com

iPhone Xのタブバーの高さの問題を修正する方法

IPhone Xのテスト時にアプリに問題があります。この問題を調整する方法がわかりません。iPhoneX以外のサイズでは問題になりません。これは、iPhone Xシミュレーターの問題のようです。

enter image description here

enter image description here

iosswiftxcodeuistoryboardiphone-x
29
icekomo

"File inspector"

Xcodeストーリーボードの右側にある「ファイルインスペクター」。セーフエリアガイドレイアウトを有効にして、iPhoneでアプリをサポートします。

この投稿 は本当に良いことを説明しています。

10
Dipak Kacha

オンiOS 12.1 UITabBarサブクラスのsafeAreaInsetsをオーバーライドすることでこの問題を解決しました。

class TabBar: UITabBar {
    private var cachedSafeAreaInsets = UIEdgeInsets.zero

    override var safeAreaInsets: UIEdgeInsets {
        let insets = super.safeAreaInsets

        if insets.bottom < bounds.height {
            cachedSafeAreaInsets = insets
        }

        return cachedSafeAreaInsets
    }
}
15
Andrey

次のコードを使用して別のファイルを作成します。

extension UITabBar {
    override open func sizeThatFits(_ size: CGSize) -> CGSize {
        super.sizeThatFits(size)
        guard let window = UIApplication.shared.keyWindow else {
            return super.sizeThatFits(size)
        }
        var sizeThatFits = super.sizeThatFits(size)
        sizeThatFits.height = window.safeAreaInsets.bottom + 40
        return sizeThatFits
    }
}
12
Mohamed Ali

IOS 11.3の場合、これは私のために働いた：

func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    tabBar.invalidateIntrinsicContentSize()
}
4
clopex

UITabBarの下部を、安全な領域ではなく、スーパービューに合わせるだけです。安全な領域に配置すると、次のようになります。

Align to safe area

そして、スーパービューに整列すると、正しく表示されます：

Align to Superview

これは、iPhone Xの場合、Appleがタブバー項目にデフォルトのマージンを与えたのは、フローティングバーを回避するためにタブバーを画面の下部まで拡張するためだと思う。

2
ben87nz

UITabbar selectionIndicatorImageを設定するには、以下のガイドラインに従ってください。

  1. UITabBar.appearance（）。selectionIndicatorImage = #YOUR_IMAGE
  2. 画像の高さが48であることを確認してください

Tabbar selectionIndicatorImageのデフォルトの高さは49ですが、iPhone Xでは画像の高さは48に設定されます。

1
user5180348

私にとっての解決策は、カスタムUITabBarの高さを次のように設定することでした。

  override func viewWillLayoutSubviews() {            
        var tabFrame = tabBar.frame
        tabFrame.size.height = 60
        tabFrame.Origin.y = self.view.frame.size.height - 60
        tabBar.frame = tabFrame
    }

削除すると、iPhone Xでタブバーが正しく表示されます。

1
Gytis

選択イメージを使用しているので、これはうまくいきました。

tabBar.selectionIndicatorImage = UIImage.imageWithColor(color: UIColor.NewDesignColor.yellow, size: tabBarItemSize).resizableImage(withCapInsets: UIEdgeInsets.init(top: 0, left: 0, bottom: 20, right: 0))

私の場合、下の差し込みを追加すると役立ちます。これがあなたにも役立つことを願っています。ありがとう。

1
Akanksha Sharma

同様の問題がありました。 viewDidLoad（）でselectionIndicatorImageを設定していました。コードをviewDidLayoutSubviews（）に移動すると、問題が修正されました。

1
Randeep

クレイジーに見えますが、コードのこの行を削除するだけです

self.view.layoutIfNeeded()

画面に表示されないビューでlayoutIfNeededを呼び出すと、この問題が発生すると思います。とにかく、@ mohamed-ALiのソリューションも正しく機能します。ありがとうございます。

0
Hiro

UIViewControllerが回転可能な場合、これをUITabBarViewControllerに入れてTabBarの高さを修正します。

override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
        super.viewWillTransition(to: size, with: coordinator)
        tabBar.sizeToFit()
    }
0
cpt.blood

あなたを助けるかもしれないviewWillLayoutSubviewsのUITabBarのinvalidateIntrinsicContentSize。

 override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    self.tabBar.invalidateIntrinsicContentSize()
}
0
Nishant Bhindi

制約内-

「下部レイアウトガイド」で下部スペースを提供している場合、この問題が発生します。

解決策：

スーパービューに関して下部スペースを確保します。これは100％完璧に機能します。

0
Mehul Thakkar

私はiOS 11.0より上で12.0より下でのみこの表面的な問題に直面していました。

enter image description here

UITabBarから継承したCustomTabBarクラスがありました。以下のようにフレームメソッドをオーバーライドします。

- (CGRect)frame{
    return self.bounds;
}

IOSバージョン11.0のほとんどでこの問題を解決しました*

0
Prabhat Kasera

viewDidLoadにこのコードを追加

DispatchQueue.main.async {
            let size = CGSize(width: self.tabBar.frame.width / numberOfTabsFloat,
                              height: self.tabBar.frame.height)
            let image = UIImage.drawTabBarIndicator(color: UIColor.white,
                                                   size: size,
                                                   onTop: false)
            UITabBar.appearance().selectionIndicatorImage = image
            self.tabBar.selectionIndicatorImage = image
        }

およびこの拡張子を追加

extension UIImage{
    //Draws the top indicator by making image with filling color
    class func drawTabBarIndicator(color: UIColor, size: CGSize, onTop: Bool) -> UIImage {
        let indicatorHeight = size.height
        let yPosition = onTop ? 0 : (size.height - indicatorHeight)

        UIGraphicsBeginImageContextWithOptions(size, false, 0)
        color.setFill()
        UIRectFill(CGRect(x: 0, y: yPosition, width: size.width, height: indicatorHeight))
        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image!
    }
}
0
Romin Dhameliya

IPhone Xのすべての問題を解決するUITabBarサブクラスがありますiOS 11/iOS 12

class TabBar: UITabBar {

private var _safeAreaInsets = UIEdgeInsets.zero
private var _subviewsFrames: [CGRect] = []

@available(iOS 11.0, *)
override func safeAreaInsetsDidChange() {
    super.safeAreaInsetsDidChange()

    if _safeAreaInsets != safeAreaInsets {
        _safeAreaInsets = safeAreaInsets

        invalidateIntrinsicContentSize()
        superview?.setNeedsLayout()
        superview?.layoutSubviews()
    }
}

override func sizeThatFits(_ size: CGSize) -> CGSize {
    var size = super.sizeThatFits(size)
    if #available(iOS 12.0, *) {
        let bottomInset = safeAreaInsets.bottom
        if bottomInset > 0 && size.height < 50 && (size.height + bottomInset < 90) {
            size.height += bottomInset
        }
    }
    return size
}

override var frame: CGRect {
    get {
        return super.frame
    }
    set {
        var tmp = newValue
        if let superview = superview, tmp.maxY !=
                superview.frame.height {
            tmp.Origin.y = superview.frame.height - tmp.height
        }

        super.frame = tmp
    }
}

override func layoutSubviews() {
    super.layoutSubviews()
    let state = subviews.map { $0.frame }
    if (state.first { $0.width == 0 } == nil) {
        _subviewsFrames = state
    } else {
        Zip(subviews, _subviewsFrames).forEach { (view, rect) in
            view.frame = rect
        }
    }

}
}
0
Maxime Ashurov

Appleはこの問題をiOS 12.1.1で修正しました

0
Sathish Kumar Gurunathan

これは私のために働いた。

[self.tabBar.bottomAnchor constraintEqualToAnchor:self.view.layoutMarginsGuide.bottomAnchor].active = YES;

0
Jonah