web-dev-qa-db-fra.com

Comment corriger le problème de hauteur de la barre d'onglets sur iPhone X

J'ai des problèmes avec mon application lorsque je teste l'iPhone X. Je ne sais pas comment régler ce problème ni comment en faire un problème pour les tailles autres que celles d'iPhone X. Cela semble être un problème sur le simulateur iPhone X.

 enter image description here

 enter image description here

22
icekomo

 "File inspector"

"Inspecteur de fichier" à droite du storyboard XCode, activez la mise en page du guide des zones sûres pour prendre en charge votre application sur iPhone 

Ce post décrit vraiment bien.

7
Dipak Kacha

Sur iOS 12.1 J'ai résolu ce problème en remplaçant les safeAreaInsets dans la sous-classe UITabBar:

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
    }
}
11
Andrey

Créez un fichier séparé avec le code suivant:

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
    }
}
7
Mohamed Ali

Pour iOS 11.3, cela a fonctionné pour moi:

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

J'ai rencontré le même problème. Heureusement, le post suivant me sauve. Je suis sûr que vous pouvez résoudre votre problème avec cela.

https://novemberfive.co/blog/Apple-september-event-iphonex-apps/

Une technique utilisant une vue de base pour un UITabBar afin de remplir la zone inférieure corrige le problème que vous rencontrez.

3
Kyokook Hwang

Alignez simplement le bas de la barre UITab sur la superview, pas sur la zone de sécurité. Si vous l'alignez sur une zone sécurisée, ce sera comme ceci:

 Align to safe area

Et une fois aligné sur le superview, il montrera correctement:

 Align to Superview

Je pense que cela est dû au fait qu’Apple a attribué aux éléments de la barre d’onglet une marge par défaut vers le bas s’il s’agit d’iPhone X, car ils souhaitent que la barre d’onglet soit étendue au bas de l’écran pour éviter une barre flottante.

1
ben87nz

La solution pour moi était que j'avais un jeu de hauteur UITabBar personnalisé, quelque chose comme ceci:

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

Supprimez-le et la barre d'onglets s'affichera correctement sur l'iPhone X.

1
Gytis

Cela a fonctionné pour moi car j'utilise une image de sélection.

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

Ajouter une partie inférieure aide dans mon cas ... Je espère que cela fonctionne pour vous aussi ... Merci.

1
Akanksha Sharma

Suivez les instructions ci-dessous pour configurer la sélectionIndicatorImage de la barre UIT.

  1. UITabBar.appearance (). SelectionIndicatorImage = #YOUR_IMAGE
  2. Assurez-vous que votre image a une hauteur de 48.  

La hauteur par défaut de selectionIndicatorImage de la barre de tabulation est 49, mais sur iPhone X, la hauteur de l'image est définie sur 48.

0
user5180348

C'est fou, mais je dois juste supprimer cette ligne dans mon code

self.view.layoutIfNeeded()

Je suppose juste que l'appel layoutIfNeeded sur une vue qui n'apparaît pas à l'écran fera que ce problème se produise .. De toute façon, la solution de @ mohamed-ALi fonctionne également correctement. Merci beaucoup.

0
Hiro

invalidateIntrinsicContentSize de UITabBar dans viewWillLayoutSubviews qui peuvent vous aider.

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

Dans les contraintes - 

Si vous indiquez un espace inférieur avec "Guide de mise en page inférieur", ce problème se produira. 

Solution:

Donner un espace inférieur en ce qui concerne superview. Cela fonctionnera à 100% parfait.

0
Mehul Thakkar

J'ai eu un problème similaire. Je réglais selectionIndicatorImage dans viewDidLoad (). Déplacer le code vers viewDidLayoutSubviews () a résolu mon problème.

0
Randeep

Il existe une sous-classe UITabBar qui résout tous mes problèmes avec l'iPhone X 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 a résolu ce problème dans iOS 12.1.1

0
Gurunathan