How to align Stack View with 4 elements and Stack View with 5 elements in XIB?-CodePudding

I am creating a custom Numpad keyboard through xib.
The numpad has 4 rows: 3 rows with 5 buttons and 1 last row with 4 buttons.
I can't understand, how to align a width of a yellow button "=" to be equal of doubled width of upper row's 2 yellow buttons " " and "x". Plus 3 grey buttons width to be the same as upper 3 grey buttons have?
I don't want to add hardcoded values like each yellow button width equals 60 then "=" button width equals 120.
This is how it looks now:
I tried to google for solution, but found the cases only with 4 elements in a row, not 5.
Here is the test project on Github:
Here's the source for that xib (took out whitespace so it would fit in this answer):
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="20037" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
 <device id="retina6_1" orientation="portrait" appearance="light"/>
 <dependencies>
 <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
 <capability name="Safe area layout guides" minToolsVersion="9.0"/>
 <capability name="System colors in document resources" minToolsVersion="11.0"/>
 <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
 </dependencies>
 <objects>
 <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
 <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
 <view contentMode="scaleToFill" id="w35-oq-szw">
 <rect key="frame" x="0.0" y="0.0" width="745" height="531"/>
 <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
 <subviews>
 <visualEffectView opaque="NO" clipsSubviews="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="req-q9-lx2">
 <rect key="frame" x="0.0" y="0.0" width="745" height="531"/>
 <view key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" id="d1H-9Q-j7P">
 <rect key="frame" x="0.0" y="0.0" width="745" height="531"/>
 <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
 <subviews>
 <stackView opaque="NO" contentMode="scaleToFill" axis="vertical" distribution="fillEqually" spacing="10" translatesAutoresizingMaskIntoConstraints="NO" id="sSl-mz-1DQ">
 <rect key="frame" x="10" y="0.0" width="725" height="531"/>
 <subviews>
 <stackView opaque="NO" contentMode="scaleToFill" distribution="fillEqually" spacing="10" translatesAutoresizingMaskIntoConstraints="NO" id="fGC-p9-L4U">
 <rect key="frame" x="0.0" y="0.0" width="725" height="125.5"/>
 <subviews>
 <button opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="248" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="1fo-rx-txj">
 <rect key="frame" x="0.0" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="7">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="JkP-z1-kBt">
 <rect key="frame" x="147" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="8">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="aA8-sE-uyJ">
 <rect key="frame" x="294" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="9">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="JdT-jT-0wO">
 <rect key="frame" x="441" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="C">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="MqJ-SJ-vgm">
 <rect key="frame" x="588" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="^">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 </subviews>
 <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 </stackView>
 <stackView opaque="NO" contentMode="scaleToFill" distribution="fillEqually" spacing="10" translatesAutoresizingMaskIntoConstraints="NO" id="ryL-j9-8Gp">
 <rect key="frame" x="0.0" y="135.5" width="725" height="125"/>
 <subviews>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="ATt-PW-v4y">
 <rect key="frame" x="0.0" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="4">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="249" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="ToS-iL-gQp">
 <rect key="frame" x="147" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="5">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="248" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="OSw-U5-1GF">
 <rect key="frame" x="294" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="6">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="Uiw-M5-1xf">
 <rect key="frame" x="441" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="-">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="dHS-oz-6Ou">
 <rect key="frame" x="588" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="/">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 </subviews>
 </stackView>
 <stackView opaque="NO" contentMode="scaleToFill" distribution="fillEqually" spacing="10" translatesAutoresizingMaskIntoConstraints="NO" id="JRw-LQ-aMf">
 <rect key="frame" x="0.0" y="270.5" width="725" height="125.5"/>
 <subviews>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="mal-m2-BW0">
 <rect key="frame" x="0.0" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="1">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="KI1-ty-RLg">
 <rect key="frame" x="147" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="2">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="5EU-9l-FVK">
 <rect key="frame" x="294" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="3">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="y6Q-JT-JWy">
 <rect key="frame" x="441" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title=" ">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="G9r-jQ-QQ9">
 <rect key="frame" x="588" y="0.0" width="137" height="125.5"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="x">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 </subviews>
 </stackView>
 <stackView opaque="NO" contentMode="scaleToFill" spacing="10" translatesAutoresizingMaskIntoConstraints="NO" id="Uw9-qZ-Dfo">
 <rect key="frame" x="0.0" y="406" width="725" height="125"/>
 <subviews>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="8ld-d6-RQK">
 <rect key="frame" x="0.0" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title=".">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="mBP-LN-MlY">
 <rect key="frame" x="147" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="0">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="nde-Sc-JPt">
 <rect key="frame" x="294" y="0.0" width="137" height="125"/>
 <color key="backgroundColor" white="0.66666666669999997" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="D">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="dGq-08-Kzm">
 <rect key="frame" x="441" y="0.0" width="284" height="125"/>
 <color key="backgroundColor" red="0.97410839800000004" green="0.8403052688" blue="0.2821659446" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
 <color key="tintColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 <state key="normal" title="Button"/>
 <buttonConfiguration key="configuration" style="plain" title="=">
 <fontDescription key="titleFontDescription" type="system" pointSize="40"/>
 </buttonConfiguration>
 </button>
 </subviews>
 </stackView>
 </subviews>
 <constraints>
 <constraint firstItem="nde-Sc-JPt" firstAttribute="width" secondItem="5EU-9l-FVK" secondAttribute="width" id="4El-5L-MaG"/>
 <constraint firstItem="mBP-LN-MlY" firstAttribute="width" secondItem="KI1-ty-RLg" secondAttribute="width" id="Htd-Ko-RcX"/>
 <constraint firstItem="8ld-d6-RQK" firstAttribute="width" secondItem="mal-m2-BW0" secondAttribute="width" id="m9s-WZ-peK"/>
 </constraints>
 </stackView>
 </subviews>
 <constraints>
 <constraint firstItem="sSl-mz-1DQ" firstAttribute="top" secondItem="d1H-9Q-j7P" secondAttribute="top" id="Db1-iD-Elh"/>
 <constraint firstAttribute="trailing" secondItem="sSl-mz-1DQ" secondAttribute="trailing" constant="10" id="KbS-0k-Ie2"/>
 <constraint firstItem="sSl-mz-1DQ" firstAttribute="leading" secondItem="d1H-9Q-j7P" secondAttribute="leading" constant="10" id="TJv-db-APH"/>
 <constraint firstAttribute="bottom" secondItem="sSl-mz-1DQ" secondAttribute="bottom" id="g6s-Ye-LzN"/>
 </constraints>
 </view>
 <blurEffect style="systemThinMaterial"/>
 </visualEffectView>
 </subviews>
 <viewLayoutGuide key="safeArea" id="V0A-kF-WY5"/>
 <color key="backgroundColor" systemColor="systemBackgroundColor"/>
 <constraints>
 <constraint firstItem="req-q9-lx2" firstAttribute="leading" secondItem="V0A-kF-WY5" secondAttribute="leading" id="0fX-Cx-EME"/>
 <constraint firstItem="req-q9-lx2" firstAttribute="trailing" secondItem="V0A-kF-WY5" secondAttribute="trailing" id="Jvp-Gw-hsl"/>
 <constraint firstItem="req-q9-lx2" firstAttribute="top" secondItem="w35-oq-szw" secondAttribute="top" id="hrp-Zn-ETe"/>
 <constraint firstAttribute="bottom" secondItem="req-q9-lx2" secondAttribute="bottom" id="kDe-Se-hCP"/>
 </constraints>
 <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
 <point key="canvasLocation" x="621" y="728"/>
 </view>
 </objects>
 <resources>
 <systemColor name="systemBackgroundColor">
 <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
 </systemColor>
 </resources>
</document>