Rework CCMore design as in mockup

Signed-off-by: Philippe Weidmann <philippe.weidmann@infomaniak.com>

iOSClient/Main/CCMore.swift

@@ -26,10 +26,6 @@ import UIKit
 
 class CCMore: UIViewController, UITableViewDelegate, UITableViewDataSource {
 
-    @IBOutlet weak var themingBackground: UIImageView!
-    @IBOutlet weak var disclosureIndicator: UIImageView!
-    @IBOutlet weak var themingAvatar: UIImageView!
-    @IBOutlet weak var labelUsername: UILabel!
     @IBOutlet weak var tableView: UITableView!
     @IBOutlet weak var labelQuota: UILabel!
     @IBOutlet weak var labelQuotaExternalSite: UILabel!
@@ -59,19 +55,15 @@ class CCMore: UIViewController, UITableViewDelegate, UITableViewDataSource {
         tableView.dataSource = self
         
         self.navigationItem.title = NSLocalizedString("_more_", comment: "")
-        
+
         // create tap gesture recognizer
         let tapQuota = UITapGestureRecognizer(target: self, action: #selector(tapLabelQuotaExternalSite))
         labelQuotaExternalSite.isUserInteractionEnabled = true
         labelQuotaExternalSite.addGestureRecognizer(tapQuota)
-        
-        let tapImageLogo = UITapGestureRecognizer(target: self, action: #selector(tapImageLogoManageAccount))
-        themingBackground.isUserInteractionEnabled = true
-        themingBackground.addGestureRecognizer(tapImageLogo)
-        
+
         // Notification
         NotificationCenter.default.addObserver(self, selector: #selector(changeUserProfile), name: NSNotification.Name(rawValue: k_notificationCenter_changeUserProfile), object: nil)
-        
+
         // Theming view
         NotificationCenter.default.addObserver(self, selector: #selector(changeTheming), name: NSNotification.Name(rawValue: k_notificationCenter_changeTheming), object: nil)
         changeTheming()
@@ -193,47 +185,19 @@ class CCMore: UIViewController, UITableViewDelegate, UITableViewDataSource {
     @objc func changeTheming() {
         appDelegate.changeTheming(self, tableView: tableView, collectionView: nil, form: false)
 
-        viewQuota.backgroundColor = NCBrandColor.sharedInstance.backgroundView;
+        viewQuota.backgroundColor = NCBrandColor.sharedInstance.backgroundView
         progressQuota.progressTintColor = NCBrandColor.sharedInstance.brandElement
-        themingBackground.backgroundColor = NCBrandColor.sharedInstance.backgroundView;
-            
-        labelUsername.textColor = NCBrandColor.sharedInstance.textView
-        
-        disclosureIndicator.image = CCGraphics.changeThemingColorImage(disclosureIndicator.image, width: 48, height: 52, color: NCBrandColor.sharedInstance.textView)
     }
     
     @objc func changeUserProfile() {
-     
-        let fileNamePath = CCUtility.getDirectoryUserData() + "/" + CCUtility.getStringUser(appDelegate.activeUser, activeUrl: appDelegate.activeUrl) + "-" + appDelegate.activeUser + ".png"
-        var quota: String = ""
-        
-        if let themingAvatarFile = UIImage.init(contentsOfFile: fileNamePath) {
-            themingAvatar.image = themingAvatarFile
-        } else {
-            themingAvatar.image = UIImage.init(named: "moreAvatar")
-        }
-        
         // Display Name user & Quota
+        var quota: String = ""
+
         guard let tabAccount = NCManageDatabase.sharedInstance.getAccountActive() else {
             return
         }
-        
-        if tabAccount.displayName.isEmpty {
-            labelUsername.text = tabAccount.user
-        }
-        else{
-            labelUsername.text = tabAccount.displayName
-        }
-        
-        // Shadow labelUsername TEST BLUR
-        /*
-        labelUsername.layer.shadowColor = UIColor.black.cgColor
-        labelUsername.layer.shadowRadius = 4
-        labelUsername.layer.shadowOpacity = 0.8
-        labelUsername.layer.shadowOffset = CGSize(width: 0, height: 0)
-        labelUsername.layer.masksToBounds = false
-        */
-        
+        self.tabAccount = tabAccount
+
         if (tabAccount.quotaRelative > 0) {
             progressQuota.progress = Float(tabAccount.quotaRelative) / 100
         } else {
@@ -250,97 +214,101 @@ class CCMore: UIViewController, UITableViewDelegate, UITableViewDataSource {
         default:
             quota = CCUtility.transformedSize(Double(tabAccount.quotaTotal))
         }
-        
-        let quotaUsed : String = CCUtility.transformedSize(Double(tabAccount.quotaUsed))
-                
+
+        let quotaUsed: String = CCUtility.transformedSize(Double(tabAccount.quotaUsed))
+
         labelQuota.text = String.localizedStringWithFormat(NSLocalizedString("_quota_using_", comment: ""), quotaUsed, quota)
+        tableView.reloadData()
     }
-    
+
     func numberOfSections(in tableView: UITableView) -> Int {
-        
+
         if (externalSiteMenu.count == 0) {
-            return 2
-        } else {
             return 3
-        }
-    }
-    
-    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
-        
-        if (section == 0) {
-            return 0.1
         } else {
-            return 30
+            return 4
         }
     }
-    
+
     func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
-        
+
         var cont = 0
-        
-        // Menu Normal
         if (section == 0) {
+            cont = tabAccount == nil ? 0 : 1
+        } else if (section == 1) {
+            // Menu Normal
             cont = functionMenu.count
         } else {
             switch (numberOfSections(in: tableView)) {
-            case 2:
+            case 3:
                 // Menu Settings
-                if (section == 1) {
+                if (section == 2) {
                     cont = settingsMenu.count
                 }
-            case 3:
+            case 4:
                 // Menu External Site
-                if (section == 1) {
+                if (section == 2) {
                     cont = externalSiteMenu.count
                 }
                 // Menu Settings
-                if (section == 2) {
+                if (section == 3) {
                     cont = settingsMenu.count
                 }
             default:
                 cont = 0
             }
         }
-        
+
         return cont
     }
-    
+
     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
-        
+
         let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! CCCellMore
         var item: OCExternalSites = OCExternalSites.init()
 
         // change color selection and disclosure indicator
-        let selectionColor : UIView = UIView.init()
+        let selectionColor: UIView = UIView()
         selectionColor.backgroundColor = NCBrandColor.sharedInstance.select
         cell.selectedBackgroundView = selectionColor
-        cell.backgroundColor = NCBrandColor.sharedInstance.backgroundView;
+        cell.backgroundColor = NCBrandColor.sharedInstance.backgroundView
         cell.accessoryType = UITableViewCell.AccessoryType.disclosureIndicator
-        
-        // Menu Normal
+
         if (indexPath.section == 0) {
-            
-            item = functionMenu[indexPath.row]
-            
+            let fileNamePath = CCUtility.getDirectoryUserData() + "/" + CCUtility.getStringUser(appDelegate.activeUser, activeUrl: appDelegate.activeUrl) + "-" + appDelegate.activeUser + ".png"
+
+            if let themingAvatarFile = UIImage.init(contentsOfFile: fileNamePath) {
+                cell.imageIcon?.image = themingAvatarFile
+            } else {
+                cell.imageIcon?.image = UIImage.init(named: "moreAvatar")
+            }
+            cell.imageIcon?.layer.masksToBounds = true
+            cell.imageIcon?.layer.cornerRadius = cell.imageIcon.frame.size.width / 2
+            if let account = tabAccount {
+                cell.labelText?.text = account.displayName
+                cell.labelText.textColor = NCBrandColor.sharedInstance.textView
+            }
+
+            return cell
         } else {
-            
+            // Menu Normal
+            if (indexPath.section == 1) {
+
+                item = functionMenu[indexPath.row]
+            }
             // Menu External Site
-            if (numberOfSections(in: tableView) == 3 && indexPath.section == 1) {
-                
+            if (numberOfSections(in: tableView) == 4 && indexPath.section == 2) {
                 item = externalSiteMenu[indexPath.row]
             }
-            
             // Menu Settings
-            if ((numberOfSections(in: tableView) == 2 && indexPath.section == 1) || (numberOfSections(in: tableView) == 3 && indexPath.section == 2)) {
-                
+            if ((numberOfSections(in: tableView) == 3 && indexPath.section == 2) || (numberOfSections(in: tableView) == 4 && indexPath.section == 3)) {
                 item = settingsMenu[indexPath.row]
             }
+            
+            cell.imageIcon?.image = CCGraphics.changeThemingColorImage(UIImage.init(named: item.icon), width: 50, height: 50, color: NCBrandColor.sharedInstance.icon)
+            cell.labelText?.text = NSLocalizedString(item.name, comment: "")
+            cell.labelText.textColor = NCBrandColor.sharedInstance.textView
         }
-        
-        cell.imageIcon?.image = CCGraphics.changeThemingColorImage(UIImage.init(named: item.icon), width: 50, height: 50, color: NCBrandColor.sharedInstance.icon)
-        cell.labelText?.text = NSLocalizedString(item.name, comment: "")
-        cell.labelText.textColor = NCBrandColor.sharedInstance.textView
-        
         return cell
     }
 
@@ -349,18 +317,23 @@ class CCMore: UIViewController, UITableViewDelegate, UITableViewDataSource {
         
         var item: OCExternalSites = OCExternalSites.init()
         
-        // Menu Function
         if indexPath.section == 0 {
+            tapImageLogoManageAccount()
+            return
+        }
+        
+        // Menu Function
+        if indexPath.section == 1 {
             item = functionMenu[indexPath.row]
         }
         
         // Menu External Site
-        if (numberOfSections(in: tableView) == 3 && indexPath.section == 1) {
+        if (numberOfSections(in: tableView) == 4 && indexPath.section == 2) {
             item = externalSiteMenu[indexPath.row]
         }
         
         // Menu Settings
-        if ((numberOfSections(in: tableView) == 2 && indexPath.section == 1) || (numberOfSections(in: tableView) == 3 && indexPath.section == 2)) {
+        if ((numberOfSections(in: tableView) == 3 && indexPath.section == 2) || (numberOfSections(in: tableView) == 4 && indexPath.section == 3)) {
             item = settingsMenu[indexPath.row]
         }
         

iOSClient/Main/Main.storyboard

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="16096" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="4IE-mo-rkp">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="16097" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="4IE-mo-rkp">
     <device id="retina6_1" orientation="portrait" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
@@ -25,7 +25,7 @@
         <!--Settings-->
         <scene sceneID="8L1-Aq-u4E">
             <objects>
-                <viewController automaticallyAdjustsScrollViewInsets="NO" id="amx-XG-NId" customClass="CCSettings" sceneMemberID="viewController">
+                <viewController extendedLayoutIncludesOpaqueBars="YES" automaticallyAdjustsScrollViewInsets="NO" id="amx-XG-NId" customClass="CCSettings" sceneMemberID="viewController">
                     <view key="view" clearsContextBeforeDrawing="NO" contentMode="scaleToFill" id="qPP-0c-bH9">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="842"/>
                         <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
@@ -67,7 +67,7 @@
         <!--Acknowledgements-->
         <scene sceneID="h9y-Lj-jxB">
             <objects>
-                <viewController id="Wu3-ow-y4h" customClass="Acknowledgements" sceneMemberID="viewController">
+                <viewController extendedLayoutIncludesOpaqueBars="YES" id="Wu3-ow-y4h" customClass="Acknowledgements" sceneMemberID="viewController">
                     <view key="view" opaque="NO" contentMode="scaleToFill" id="HYE-hK-m2I">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="786"/>
                         <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
@@ -112,7 +112,7 @@
         <!--Navigation Controller-->
         <scene sceneID="eDq-6m-h8d">
             <objects>
-                <navigationController automaticallyAdjustsScrollViewInsets="NO" id="eZl-ut-xpC" sceneMemberID="viewController">
+                <navigationController extendedLayoutIncludesOpaqueBars="YES" automaticallyAdjustsScrollViewInsets="NO" id="eZl-ut-xpC" sceneMemberID="viewController">
                     <extendedEdge key="edgesForExtendedLayout"/>
                     <toolbarItems/>
                     <navigationBar key="navigationBar" contentMode="scaleToFill" id="rJe-3o-bpZ">
@@ -479,25 +479,17 @@
                         <rect key="frame" x="0.0" y="0.0" width="414" height="896"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <subviews>
-                            <imageView userInteractionEnabled="NO" contentMode="scaleAspectFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="qW6-AL-KO3">
-                                <rect key="frame" x="0.0" y="88" width="414" height="100"/>
-                                <constraints>
-                                    <constraint firstAttribute="height" constant="100" id="GJt-sN-4QE"/>
-                                </constraints>
-                            </imageView>
-                            <imageView userInteractionEnabled="NO" contentMode="center" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="disclosureIndicator" translatesAutoresizingMaskIntoConstraints="NO" id="Lgd-72-bTD">
-                                <rect key="frame" x="381" y="125" width="24" height="26"/>
-                                <constraints>
-                                    <constraint firstAttribute="height" constant="26" id="9SQ-KV-aJa"/>
-                                    <constraint firstAttribute="width" constant="24" id="KBe-Dy-an6"/>
-                                </constraints>
-                            </imageView>
-                            <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="prototypes" style="grouped" rowHeight="50" sectionHeaderHeight="1" sectionFooterHeight="1" translatesAutoresizingMaskIntoConstraints="NO" id="aKC-5k-tLM">
-                                <rect key="frame" x="0.0" y="188" width="414" height="549"/>
-                                <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                            <tableView clipsSubviews="YES" contentMode="scaleToFill" alwaysBounceVertical="YES" dataMode="prototypes" style="plain" rowHeight="50" sectionHeaderHeight="28" sectionFooterHeight="28" translatesAutoresizingMaskIntoConstraints="NO" id="aKC-5k-tLM">
+                                <rect key="frame" x="0.0" y="88" width="414" height="649"/>
+                                <inset key="separatorInset" minX="56" minY="0.0" maxX="0.0" maxY="0.0"/>
+                                <view key="tableFooterView" contentMode="scaleToFill" id="xPg-6F-Qcc">
+                                    <rect key="frame" x="0.0" y="106" width="414" height="44"/>
+                                    <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
+                                    <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                                </view>
                                 <prototypes>
                                     <tableViewCell contentMode="scaleToFill" selectionStyle="default" indentationWidth="10" reuseIdentifier="Cell" rowHeight="50" id="V1G-2M-Q0I" customClass="CCCellMore" customModule="Nextcloud" customModuleProvider="target">
-                                        <rect key="frame" x="0.0" y="55.5" width="414" height="50"/>
+                                        <rect key="frame" x="0.0" y="28" width="414" height="50"/>
                                         <autoresizingMask key="autoresizingMask"/>
                                         <tableViewCellContentView key="contentView" multipleTouchEnabled="YES" contentMode="center" tableViewCell="V1G-2M-Q0I" id="mMB-QG-hoe">
                                             <rect key="frame" x="0.0" y="0.0" width="414" height="50"/>
@@ -536,27 +528,6 @@
                                     <outlet property="delegate" destination="Frr-j9-xav" id="46E-kI-GUB"/>
                                 </connections>
                             </tableView>
-                            <imageView userInteractionEnabled="NO" contentMode="scaleToFill" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="avatar" translatesAutoresizingMaskIntoConstraints="NO" id="oJg-wO-2iv" customClass="NCAvatar" customModule="Nextcloud" customModuleProvider="target">
-                                <rect key="frame" x="15" y="113" width="50" height="50"/>
-                                <constraints>
-                                    <constraint firstAttribute="width" constant="50" id="moA-ZW-N2y"/>
-                                    <constraint firstAttribute="height" constant="50" id="nQ1-8m-5h7"/>
-                                </constraints>
-                                <userDefinedRuntimeAttributes>
-                                    <userDefinedRuntimeAttribute type="number" keyPath="borderWidth">
-                                        <real key="value" value="1"/>
-                                    </userDefinedRuntimeAttribute>
-                                    <userDefinedRuntimeAttribute type="color" keyPath="borderColor">
-                                        <color key="value" white="1" alpha="1" colorSpace="calibratedWhite"/>
-                                    </userDefinedRuntimeAttribute>
-                                </userDefinedRuntimeAttributes>
-                            </imageView>
-                            <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="username" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="aqE-Wq-B1A">
-                                <rect key="frame" x="78" y="128" width="78" height="20"/>
-                                <fontDescription key="fontDescription" type="boldSystem" pointSize="16"/>
-                                <color key="textColor" white="1" alpha="1" colorSpace="calibratedWhite"/>
-                                <nil key="highlightedColor"/>
-                            </label>
                             <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="J2k-UZ-XQQ" userLabel="View Quota">
                                 <rect key="frame" x="0.0" y="737" width="414" height="60"/>
                                 <subviews>
@@ -601,34 +572,21 @@
                         </subviews>
                         <constraints>
                             <constraint firstItem="aKC-5k-tLM" firstAttribute="trailing" secondItem="hLP-ql-OiA" secondAttribute="trailing" id="09d-e0-Lbe"/>
-                            <constraint firstItem="Lgd-72-bTD" firstAttribute="centerY" secondItem="oJg-wO-2iv" secondAttribute="centerY" id="Aiq-NC-J8Z"/>
-                            <constraint firstItem="oJg-wO-2iv" firstAttribute="centerY" secondItem="qW6-AL-KO3" secondAttribute="centerY" id="HRF-rA-WKN"/>
-                            <constraint firstItem="qW6-AL-KO3" firstAttribute="trailing" secondItem="hLP-ql-OiA" secondAttribute="trailing" id="IHF-zg-7RG"/>
-                            <constraint firstItem="qW6-AL-KO3" firstAttribute="leading" secondItem="hLP-ql-OiA" secondAttribute="leading" id="Nyf-TZ-gLf"/>
                             <constraint firstItem="aKC-5k-tLM" firstAttribute="leading" secondItem="hLP-ql-OiA" secondAttribute="leading" id="VDo-ak-TEq"/>
                             <constraint firstItem="2rd-9k-q51" firstAttribute="bottom" secondItem="J2k-UZ-XQQ" secondAttribute="bottom" constant="16" id="bRS-IM-13l"/>
-                            <constraint firstItem="aqE-Wq-B1A" firstAttribute="centerY" secondItem="oJg-wO-2iv" secondAttribute="centerY" id="dJY-KW-vIJ"/>
-                            <constraint firstItem="aqE-Wq-B1A" firstAttribute="leading" secondItem="oJg-wO-2iv" secondAttribute="trailing" constant="13" id="fPO-DW-Ccp"/>
-                            <constraint firstAttribute="trailingMargin" secondItem="Lgd-72-bTD" secondAttribute="trailing" constant="-11" id="gS9-A6-G0U"/>
-                            <constraint firstItem="aKC-5k-tLM" firstAttribute="top" secondItem="2rd-9k-q51" secondAttribute="top" constant="100" id="hWq-1x-oDU"/>
+                            <constraint firstItem="aKC-5k-tLM" firstAttribute="top" secondItem="2rd-9k-q51" secondAttribute="top" id="hWq-1x-oDU"/>
                             <constraint firstItem="J2k-UZ-XQQ" firstAttribute="trailing" secondItem="hLP-ql-OiA" secondAttribute="trailing" id="i8w-Kx-CNe"/>
                             <constraint firstItem="J2k-UZ-XQQ" firstAttribute="leading" secondItem="hLP-ql-OiA" secondAttribute="leading" id="j44-Hn-Qa3"/>
-                            <constraint firstItem="qW6-AL-KO3" firstAttribute="top" secondItem="hLP-ql-OiA" secondAttribute="topMargin" id="lp3-X7-9wg"/>
-                            <constraint firstItem="qW6-AL-KO3" firstAttribute="leading" secondItem="oJg-wO-2iv" secondAttribute="trailing" constant="-65" id="qCO-yk-KNN"/>
                             <constraint firstItem="J2k-UZ-XQQ" firstAttribute="top" secondItem="aKC-5k-tLM" secondAttribute="bottom" id="zy7-iS-wLE"/>
                         </constraints>
                         <viewLayoutGuide key="safeArea" id="2rd-9k-q51"/>
                     </view>
                     <navigationItem key="navigationItem" id="UOD-r3-Kgi"/>
                     <connections>
-                        <outlet property="disclosureIndicator" destination="Lgd-72-bTD" id="nUk-W9-H48"/>
                         <outlet property="labelQuota" destination="DAP-np-Q1J" id="d1L-oC-pxP"/>
                         <outlet property="labelQuotaExternalSite" destination="vfl-ZC-XFd" id="Zdx-nY-00O"/>
-                        <outlet property="labelUsername" destination="aqE-Wq-B1A" id="UMl-sE-W5x"/>
                         <outlet property="progressQuota" destination="uGf-Fa-QQ3" id="cAN-mW-Ckd"/>
                         <outlet property="tableView" destination="aKC-5k-tLM" id="XrN-XG-w8l"/>
-                        <outlet property="themingAvatar" destination="oJg-wO-2iv" id="Z0Z-Jb-3eG"/>
-                        <outlet property="themingBackground" destination="qW6-AL-KO3" id="JAV-fL-ZXh"/>
                         <outlet property="viewQuota" destination="J2k-UZ-XQQ" id="I2M-eR-p56"/>
                     </connections>
                 </viewController>
@@ -657,8 +615,6 @@
         <segue reference="2Qm-A6-CfB"/>
     </inferredMetricsTieBreakers>
     <resources>
-        <image name="avatar" width="25" height="25"/>
-        <image name="disclosureIndicator" width="26" height="28"/>
         <image name="logo" width="223" height="157.5"/>
         <image name="tabBarPlus" width="80" height="80"/>
     </resources>