From da45975a5aea927bb8bdcaf4a58b0deced862b5c Mon Sep 17 00:00:00 2001
From: Tor Lillqvist <tml@collabora.com>
Date: Thu, 6 Dec 2018 17:14:47 +0200
Subject: [PATCH] Make the template collection view look much better

Now it finally looks like I want, but oh boy was that a pain. I am not
sure at all I understand what I am doing in Xcode's Interface Builder.

I tried hard at first to use the cell size 200x220 for the cell size
of the UICollectionView, consisting of a 200x200 UIImageView and a
200x20 UILabel below. But that did not seem to work, it still used a
(default?) size of 150x150. Weird. Anyway, let's commit this state now
that seems to work.

Change-Id: I4021133619fbf62cd633392d93f19c2bbc81311a
---
 ios/Mobile/Base.lproj/Main.storyboard         | 53 ++++++++++++-------
 .../TemplateCollectionViewController.mm       | 12 +++--
 2 files changed, 42 insertions(+), 23 deletions(-)

diff --git a/ios/Mobile/Base.lproj/Main.storyboard b/ios/Mobile/Base.lproj/Main.storyboard
index 64685855d..062c453af 100644
--- a/ios/Mobile/Base.lproj/Main.storyboard
+++ b/ios/Mobile/Base.lproj/Main.storyboard
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="14460.31" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="BYZ-38-t0r">
-    <device id="retina4_7" orientation="portrait">
+    <device id="ipad9_7" orientation="portrait">
         <adaptation id="fullscreen"/>
     </device>
     <dependencies>
@@ -15,7 +15,7 @@
             <objects>
                 <viewController id="BYZ-38-t0r" customClass="DocumentBrowserViewController" sceneMemberID="viewController">
                     <view key="view" contentMode="scaleToFill" id="8bC-Xf-vdC">
-                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                        <rect key="frame" x="0.0" y="0.0" width="768" height="1024"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                         <viewLayoutGuide key="safeArea" id="0fo-ii-Aj5"/>
@@ -30,7 +30,7 @@
             <objects>
                 <viewController storyboardIdentifier="DocumentViewController" id="M2k-L8-Olo" customClass="DocumentViewController" sceneMemberID="viewController">
                     <view key="view" contentMode="scaleToFill" id="SIE-Uh-Zny">
-                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                        <rect key="frame" x="0.0" y="0.0" width="768" height="1024"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <color key="backgroundColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
                         <viewLayoutGuide key="safeArea" id="BoZ-jc-2Y8"/>
@@ -43,49 +43,66 @@
         <!--Template Collection View Controller-->
         <scene sceneID="juG-xb-Xrw">
             <objects>
-                <collectionViewController storyboardIdentifier="TemplateCollectionViewController" id="Cwb-6T-NJd" customClass="TemplateCollectionViewController" sceneMemberID="viewController">
-                    <collectionView key="view" clipsSubviews="YES" contentMode="scaleToFill" dataMode="prototypes" id="cHi-RU-96O">
-                        <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
+                <collectionViewController storyboardIdentifier="TemplateCollectionViewController" autoresizesArchivedViewToFullSize="NO" id="Cwb-6T-NJd" customClass="TemplateCollectionViewController" sceneMemberID="viewController">
+                    <collectionView key="view" clipsSubviews="YES" contentMode="scaleAspectFit" dataMode="prototypes" id="cHi-RU-96O">
+                        <rect key="frame" x="0.0" y="0.0" width="768" height="1024"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <color key="backgroundColor" white="0.33333333333333331" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="w0h-io-kZq">
-                            <size key="itemSize" width="50" height="50"/>
+                            <size key="itemSize" width="150" height="150"/>
                             <size key="headerReferenceSize" width="50" height="50"/>
                             <size key="footerReferenceSize" width="0.0" height="0.0"/>
                             <inset key="sectionInset" minX="50" minY="0.0" maxX="0.0" maxY="0.0"/>
                         </collectionViewFlowLayout>
                         <cells>
-                            <collectionViewCell opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" reuseIdentifier="Cell" id="ppW-Sx-T3H">
+                            <collectionViewCell opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" reuseIdentifier="Cell" id="ppW-Sx-T3H">
                                 <rect key="frame" x="50" y="50" width="150" height="150"/>
                                 <autoresizingMask key="autoresizingMask"/>
                                 <view key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO">
                                     <rect key="frame" x="0.0" y="0.0" width="150" height="150"/>
                                     <autoresizingMask key="autoresizingMask"/>
                                     <subviews>
-                                        <label opaque="NO" userInteractionEnabled="NO" tag="2" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" text="Label" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="fjg-QH-lLg">
-                                            <rect key="frame" x="0.0" y="129.5" width="150" height="20.5"/>
+                                        <view opaque="NO" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" translatesAutoresizingMaskIntoConstraints="NO" id="riJ-1i-vBs">
+                                            <rect key="frame" x="0.0" y="0.0" width="150" height="130"/>
+                                            <subviews>
+                                                <imageView verifyAmbiguity="off" opaque="NO" userInteractionEnabled="NO" tag="1" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" insetsLayoutMarginsFromSafeArea="NO" translatesAutoresizingMaskIntoConstraints="NO" id="79y-w8-uiT">
+                                                    <rect key="frame" x="0.0" y="0.0" width="150" height="130"/>
+                                                    <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                                                </imageView>
+                                            </subviews>
+                                            <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                                            <constraints>
+                                                <constraint firstAttribute="bottom" secondItem="79y-w8-uiT" secondAttribute="bottom" id="0I0-7w-Dde"/>
+                                                <constraint firstAttribute="trailing" secondItem="79y-w8-uiT" secondAttribute="trailing" id="UjO-rr-ITf"/>
+                                                <constraint firstItem="79y-w8-uiT" firstAttribute="leading" secondItem="riJ-1i-vBs" secondAttribute="leading" id="bBb-Cf-c4a"/>
+                                                <constraint firstItem="79y-w8-uiT" firstAttribute="top" secondItem="riJ-1i-vBs" secondAttribute="top" id="giz-fe-CV5"/>
+                                            </constraints>
+                                        </view>
+                                        <label verifyAmbiguity="off" opaque="NO" userInteractionEnabled="NO" tag="2" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" insetsLayoutMarginsFromSafeArea="NO" text="Label" textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="fjg-QH-lLg">
+                                            <rect key="frame" x="0.0" y="130" width="150" height="20"/>
                                             <fontDescription key="fontDescription" type="system" pointSize="17"/>
                                             <color key="textColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
                                             <nil key="highlightedColor"/>
                                         </label>
-                                        <imageView userInteractionEnabled="NO" tag="1" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" ambiguous="YES" translatesAutoresizingMaskIntoConstraints="NO" id="79y-w8-uiT">
-                                            <rect key="frame" x="0.0" y="0.0" width="150" height="121.5"/>
-                                        </imageView>
                                     </subviews>
                                 </view>
                                 <constraints>
-                                    <constraint firstAttribute="bottom" secondItem="fjg-QH-lLg" secondAttribute="bottom" id="AT2-XZ-lxx"/>
-                                    <constraint firstItem="79y-w8-uiT" firstAttribute="top" secondItem="ppW-Sx-T3H" secondAttribute="top" id="Qao-Rw-z5w"/>
+                                    <constraint firstItem="fjg-QH-lLg" firstAttribute="trailing" secondItem="riJ-1i-vBs" secondAttribute="trailing" id="5X8-PS-XYq"/>
+                                    <constraint firstItem="fjg-QH-lLg" firstAttribute="leading" secondItem="riJ-1i-vBs" secondAttribute="leading" id="8fo-lW-iy0"/>
+                                    <constraint firstAttribute="trailing" secondItem="riJ-1i-vBs" secondAttribute="trailing" id="9OL-6w-5ui"/>
+                                    <constraint firstAttribute="bottom" secondItem="riJ-1i-vBs" secondAttribute="bottom" constant="20" id="FmN-mf-0fQ"/>
+                                    <constraint firstItem="riJ-1i-vBs" firstAttribute="leading" secondItem="ppW-Sx-T3H" secondAttribute="leading" id="fc4-fE-xoO"/>
+                                    <constraint firstItem="fjg-QH-lLg" firstAttribute="top" secondItem="riJ-1i-vBs" secondAttribute="bottom" id="ise-Cp-lOO"/>
+                                    <constraint firstItem="riJ-1i-vBs" firstAttribute="top" secondItem="ppW-Sx-T3H" secondAttribute="top" id="udK-op-sng"/>
                                 </constraints>
-                                <size key="customSize" width="150" height="150"/>
                             </collectionViewCell>
                         </cells>
                         <collectionReusableView key="sectionHeaderView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" insetsLayoutMarginsFromSafeArea="NO" reuseIdentifier="SectionHeaderView" id="Vbs-oR-qri" customClass="TemplateSectionHeaderView">
-                            <rect key="frame" x="0.0" y="0.0" width="375" height="50"/>
+                            <rect key="frame" x="0.0" y="0.0" width="768" height="50"/>
                             <autoresizingMask key="autoresizingMask"/>
                             <subviews>
                                 <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" fixedFrame="YES" text="Label" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="DE4-jV-CVW">
-                                    <rect key="frame" x="8" y="0.0" width="359" height="50"/>
+                                    <rect key="frame" x="0.0" y="0.0" width="768" height="50"/>
                                     <autoresizingMask key="autoresizingMask" flexibleMinY="YES" flexibleMaxY="YES"/>
                                     <fontDescription key="fontDescription" type="system" pointSize="17"/>
                                     <color key="textColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
diff --git a/ios/Mobile/TemplateCollectionViewController.mm b/ios/Mobile/TemplateCollectionViewController.mm
index 91d5689d0..94a922825 100644
--- a/ios/Mobile/TemplateCollectionViewController.mm
+++ b/ios/Mobile/TemplateCollectionViewController.mm
@@ -12,8 +12,7 @@
 #import "TemplateCollectionViewController.h"
 #import "TemplateSectionHeaderView.h"
 
-static NSString *mapTemplateExtensionToActual(NSString *templateName)
-{
+static NSString *mapTemplateExtensionToActual(NSString *templateName) {
     NSString *baseName = [templateName stringByDeletingPathExtension];
     NSString *extension = [templateName substringFromIndex:baseName.length];
 
@@ -29,7 +28,7 @@ static NSString *mapTemplateExtensionToActual(NSString *templateName)
 
 @implementation TemplateCollectionViewController
 
--(void)viewDidLoad {
+- (void)viewDidLoad {
 
     // Here we should scan for available templates.
 
@@ -59,10 +58,13 @@ static NSString *mapTemplateExtensionToActual(NSString *templateName)
     UILabel *title = (UILabel *)[cell viewWithTag:2];
 
     NSString *templateThumbnail = [[templates[[indexPath indexAtPosition:0]][[indexPath indexAtPosition:1]] path] stringByAppendingString:@".png"];
+    UIImage *thumbnail;
     if ([NSFileManager.defaultManager fileExistsAtPath:templateThumbnail])
-          image.image = [UIImage imageWithContentsOfFile:templateThumbnail];
+        thumbnail = [UIImage imageWithContentsOfFile:templateThumbnail];
     else
-          image.image = [UIImage imageNamed:@"AppIcon"];
+        thumbnail = [UIImage imageNamed:@"AppIcon"];
+
+    image.image = thumbnail;
 
     NSString *fileName = [templates[[indexPath indexAtPosition:0]][[indexPath indexAtPosition:1]] lastPathComponent];