Skip to content

Commit 787043a

Browse files
Adapt UI for iPads
using size classes
1 parent 36c1274 commit 787043a

File tree

1 file changed

+76
-20
lines changed

1 file changed

+76
-20
lines changed

iloveusomuch/Base.lproj/Main.storyboard

Lines changed: 76 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<?xml version="1.0" encoding="UTF-8"?>
22
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="22505" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="BYZ-38-t0r">
3-
<device id="retina6_7" orientation="landscape" appearance="light"/>
3+
<device id="retina6_5" orientation="landscape" appearance="light"/>
44
<dependencies>
55
<deployment identifier="iOS"/>
66
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22504"/>
@@ -13,20 +13,17 @@
1313
<objects>
1414
<viewController storyboardIdentifier="MainViewController" id="BYZ-38-t0r" userLabel="Main View Controller" customClass="ViewController" sceneMemberID="viewController">
1515
<view key="view" contentMode="scaleToFill" id="8bC-Xf-vdC">
16-
<rect key="frame" x="0.0" y="0.0" width="926" height="428"/>
16+
<rect key="frame" x="0.0" y="0.0" width="896" height="414"/>
1717
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
1818
<subviews>
1919
<imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="background.png" translatesAutoresizingMaskIntoConstraints="NO" id="VJe-YH-sMC" userLabel="Background">
20-
<rect key="frame" x="141.66666666666669" y="0.0" width="642.66666666666652" height="428"/>
21-
<constraints>
22-
<constraint firstAttribute="width" secondItem="VJe-YH-sMC" secondAttribute="height" multiplier="590:393" id="uQo-mo-t2h"/>
23-
</constraints>
20+
<rect key="frame" x="137.66666666666663" y="0.0" width="621" height="414"/>
2421
</imageView>
2522
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" spacing="8" translatesAutoresizingMaskIntoConstraints="NO" id="YXm-la-ajX" userLabel="Contents Stack View">
26-
<rect key="frame" x="190" y="123.66666666666667" width="546" height="240.66666666666663"/>
23+
<rect key="frame" x="184" y="120.66666666666669" width="528" height="232.66666666666663"/>
2724
<subviews>
28-
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="MKG-jo-3nz" userLabel="Play Button">
29-
<rect key="frame" x="0.0" y="0.0" width="546" height="139.33333333333334"/>
25+
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="fill" contentVerticalAlignment="fill" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="MKG-jo-3nz" userLabel="Play Button">
26+
<rect key="frame" x="0.0" y="0.0" width="528" height="134.33333333333334"/>
3027
<constraints>
3128
<constraint firstAttribute="width" secondItem="MKG-jo-3nz" secondAttribute="height" multiplier="902:230" id="7Cl-mC-h1s"/>
3229
</constraints>
@@ -37,10 +34,10 @@
3734
</connections>
3835
</button>
3936
<stackView opaque="NO" contentMode="scaleToFill" distribution="fillEqually" spacing="8" translatesAutoresizingMaskIntoConstraints="NO" id="XX9-M0-b03">
40-
<rect key="frame" x="0.0" y="147.33333333333331" width="546" height="93.333333333333314"/>
37+
<rect key="frame" x="0.0" y="142.33333333333331" width="528" height="90.333333333333314"/>
4138
<subviews>
42-
<button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="tfW-31-EVu" userLabel="Share Button">
43-
<rect key="frame" x="0.0" y="0.0" width="269" height="93.333333333333329"/>
39+
<button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="fill" contentVerticalAlignment="fill" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="tfW-31-EVu" userLabel="Share Button">
40+
<rect key="frame" x="0.0" y="0.0" width="260" height="90.333333333333329"/>
4441
<constraints>
4542
<constraint firstAttribute="width" secondItem="tfW-31-EVu" secondAttribute="height" multiplier="446:155" id="lBt-Xs-iaN"/>
4643
</constraints>
@@ -50,8 +47,8 @@
5047
<action selector="share" destination="BYZ-38-t0r" eventType="touchDown" id="oei-Ah-MBF"/>
5148
</connections>
5249
</button>
53-
<button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="GOM-VT-roO" userLabel="Listen Button">
54-
<rect key="frame" x="277" y="0.0" width="269" height="93.333333333333329"/>
50+
<button opaque="NO" contentMode="scaleAspectFit" contentHorizontalAlignment="fill" contentVerticalAlignment="fill" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="GOM-VT-roO" userLabel="Listen Button">
51+
<rect key="frame" x="268" y="0.0" width="260" height="90.333333333333329"/>
5552
<constraints>
5653
<constraint firstAttribute="width" secondItem="GOM-VT-roO" secondAttribute="height" multiplier="446:155" id="Paa-pi-N1C"/>
5754
</constraints>
@@ -62,24 +59,59 @@
6259
</connections>
6360
</button>
6461
</subviews>
62+
<variation key="heightClass=regular-widthClass=regular" spacing="16"/>
6563
</stackView>
6664
</subviews>
6765
<constraints>
6866
<constraint firstItem="MKG-jo-3nz" firstAttribute="width" secondItem="YXm-la-ajX" secondAttribute="width" id="ASW-ws-F7m"/>
6967
<constraint firstItem="XX9-M0-b03" firstAttribute="width" secondItem="YXm-la-ajX" secondAttribute="width" id="fP3-a2-kXf"/>
7068
</constraints>
69+
<variation key="heightClass=regular-widthClass=regular" spacing="16"/>
7170
</stackView>
7271
</subviews>
7372
<viewLayoutGuide key="safeArea" id="dtc-O9-sO1"/>
7473
<color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
7574
<constraints>
75+
<constraint firstItem="YXm-la-ajX" firstAttribute="centerY" secondItem="VJe-YH-sMC" secondAttribute="centerY" constant="70" id="94E-Da-2gn"/>
7676
<constraint firstItem="YXm-la-ajX" firstAttribute="centerY" secondItem="8bC-Xf-vdC" secondAttribute="centerY" constant="30" id="Nek-Fg-NTu"/>
7777
<constraint firstItem="YXm-la-ajX" firstAttribute="width" secondItem="VJe-YH-sMC" secondAttribute="width" multiplier="0.85" id="PLY-Iq-40K"/>
78+
<constraint firstItem="VJe-YH-sMC" firstAttribute="width" secondItem="8bC-Xf-vdC" secondAttribute="height" multiplier="1.5" id="Tgf-GT-fUd"/>
79+
<constraint firstItem="VJe-YH-sMC" firstAttribute="height" secondItem="8bC-Xf-vdC" secondAttribute="height" id="Xc3-IC-tiZ"/>
7880
<constraint firstItem="VJe-YH-sMC" firstAttribute="top" secondItem="8bC-Xf-vdC" secondAttribute="top" id="ne5-Nc-E4Z"/>
81+
<constraint firstItem="VJe-YH-sMC" firstAttribute="width" secondItem="8bC-Xf-vdC" secondAttribute="width" multiplier="0.85" id="p8f-lm-vac"/>
7982
<constraint firstItem="VJe-YH-sMC" firstAttribute="centerX" secondItem="8bC-Xf-vdC" secondAttribute="centerX" id="tRK-sM-Ab1"/>
8083
<constraint firstAttribute="bottom" secondItem="VJe-YH-sMC" secondAttribute="bottom" id="vk0-aL-NjY"/>
8184
<constraint firstItem="YXm-la-ajX" firstAttribute="centerX" secondItem="8bC-Xf-vdC" secondAttribute="centerX" id="vzb-Lc-HuS"/>
8285
</constraints>
86+
<variation key="default">
87+
<mask key="constraints">
88+
<exclude reference="p8f-lm-vac"/>
89+
<exclude reference="Tgf-GT-fUd"/>
90+
<exclude reference="Xc3-IC-tiZ"/>
91+
<exclude reference="Nek-Fg-NTu"/>
92+
<exclude reference="94E-Da-2gn"/>
93+
</mask>
94+
</variation>
95+
<variation key="heightClass=compact-widthClass=compact">
96+
<mask key="constraints">
97+
<include reference="Tgf-GT-fUd"/>
98+
<include reference="Xc3-IC-tiZ"/>
99+
<include reference="Nek-Fg-NTu"/>
100+
</mask>
101+
</variation>
102+
<variation key="heightClass=compact-widthClass=regular">
103+
<mask key="constraints">
104+
<include reference="Tgf-GT-fUd"/>
105+
<include reference="Xc3-IC-tiZ"/>
106+
<include reference="Nek-Fg-NTu"/>
107+
</mask>
108+
</variation>
109+
<variation key="heightClass=regular-widthClass=regular">
110+
<mask key="constraints">
111+
<include reference="p8f-lm-vac"/>
112+
<include reference="94E-Da-2gn"/>
113+
</mask>
114+
</variation>
83115
</view>
84116
<connections>
85117
<outlet property="background" destination="VJe-YH-sMC" id="bUH-wc-dNo"/>
@@ -95,25 +127,49 @@
95127
<objects>
96128
<viewController storyboardIdentifier="VideosViewController" id="i63-Re-Vhy" userLabel="Videos View Controller" customClass="VideosViewController" sceneMemberID="viewController">
97129
<view key="view" contentMode="scaleToFill" id="nRD-7v-qLw">
98-
<rect key="frame" x="0.0" y="0.0" width="926" height="428"/>
130+
<rect key="frame" x="0.0" y="0.0" width="896" height="414"/>
99131
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
100132
<subviews>
101133
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="iMM-4K-fVb" userLabel="Video View" customClass="VideoView">
102-
<rect key="frame" x="142" y="0.0" width="642" height="428"/>
134+
<rect key="frame" x="137.66666666666663" y="0.0" width="621" height="414"/>
103135
<color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
104-
<constraints>
105-
<constraint firstAttribute="width" secondItem="iMM-4K-fVb" secondAttribute="height" multiplier="960:640" id="lrh-ox-HPA"/>
106-
</constraints>
107136
</view>
108137
</subviews>
109138
<viewLayoutGuide key="safeArea" id="cNZ-aw-LLS"/>
110139
<color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
111140
<constraints>
112141
<constraint firstItem="iMM-4K-fVb" firstAttribute="centerY" secondItem="nRD-7v-qLw" secondAttribute="centerY" id="8ua-5L-FG6"/>
142+
<constraint firstItem="iMM-4K-fVb" firstAttribute="height" secondItem="nRD-7v-qLw" secondAttribute="width" multiplier="0.67" id="Utz-1p-qnp"/>
113143
<constraint firstItem="iMM-4K-fVb" firstAttribute="centerX" secondItem="nRD-7v-qLw" secondAttribute="centerX" id="XAb-bD-2yy"/>
114-
<constraint firstItem="iMM-4K-fVb" firstAttribute="width" relation="lessThanOrEqual" secondItem="nRD-7v-qLw" secondAttribute="width" id="bPU-Dp-WOm"/>
144+
<constraint firstItem="iMM-4K-fVb" firstAttribute="width" secondItem="nRD-7v-qLw" secondAttribute="height" multiplier="1.5" id="aW0-z7-vBh"/>
115145
<constraint firstItem="iMM-4K-fVb" firstAttribute="height" secondItem="nRD-7v-qLw" secondAttribute="height" id="pNH-hg-lzT"/>
146+
<constraint firstItem="iMM-4K-fVb" firstAttribute="width" secondItem="nRD-7v-qLw" secondAttribute="width" id="x7r-Tt-XaM"/>
116147
</constraints>
148+
<variation key="default">
149+
<mask key="constraints">
150+
<exclude reference="x7r-Tt-XaM"/>
151+
<exclude reference="aW0-z7-vBh"/>
152+
<exclude reference="Utz-1p-qnp"/>
153+
</mask>
154+
</variation>
155+
<variation key="heightClass=compact-widthClass=compact">
156+
<mask key="constraints">
157+
<include reference="aW0-z7-vBh"/>
158+
</mask>
159+
</variation>
160+
<variation key="heightClass=compact-widthClass=regular">
161+
<mask key="constraints">
162+
<include reference="aW0-z7-vBh"/>
163+
</mask>
164+
</variation>
165+
<variation key="heightClass=regular-widthClass=regular">
166+
<mask key="constraints">
167+
<include reference="x7r-Tt-XaM"/>
168+
<exclude reference="aW0-z7-vBh"/>
169+
<include reference="Utz-1p-qnp"/>
170+
<exclude reference="pNH-hg-lzT"/>
171+
</mask>
172+
</variation>
117173
</view>
118174
<nil key="simulatedBottomBarMetrics"/>
119175
<connections>

0 commit comments

Comments
 (0)