简体   繁体   中英

Autosizing superview height according to tallest subview button

在此输入图像描述

I have following layout. The yellow view is a buttonsContainerView which acts as a container for 3 equal width buttons that it holds. All the three buttons are subview of yellow coloured buttonsContainerView . All the constraint that I have given are basic and visible and understandable in screenshot but still I will explain them below.

  • buttonsContainerView - (yellow view) Pinned to top of viewController 's view 's safeArea with an inset of 20 . It's leading and trailing are pinned to view 's leading and trailing.
  • Button 1 - Top, bottom and leading pinned to buttonContainerView 's top, bottom and leading respectively. Trailing pinned to Button 2 's leading.
  • Button 2 - Top, bottom pinned to buttonsContainerView 's top and bottom respectively. Leading pinned to Button 1 trailing. Trailing pinned to Button 3 's leading.
  • Button 3 - Top, bottom and trailing pinned to buttonsContainerView 's top, bottom and trailing respectively. Leading pinned to Button 2 's trailing.
  • Equal widths - All three buttons are given equal width constraint with each other.

Problem - Any of these three buttons may get a longer title dynamically and according to various phone screen sizes it may not accommodate in single line. I want my buttonsContainerView 's height to resize its height according to the tallest button, ie, button with longest title hence greater height (In screenshot - Button 2 , the centre button). In my case, buttonsContainerView is taking up height of smallest button (Button 1 and Button 2 in screenshot). How do I achieve this using AutoLayouts?

I have recreated your setup and can't find any problem with it, here is the picture below, can you show more info about this buttons setup? or maybe try to remove them and add again: 在此输入图像描述

You can achieve this by using combination of top insets constraints by next algorithm:
1. Add to buttons horizontal constraints (left, right, same width).
2. Add a center vertically constraints for all buttons.
3. Add top inset constraints with low priority for all buttons.
4. Add greater or equal top insets for all buttons with hight priority .

Main idea is in low priority constraints for vertical insets of the buttons, the autolayout engine will try to satisfy it, but the greater or equal top insets will prevent to do it for small buttons.

在此输入图像描述

在此输入图像描述

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM