Merge pull request #18490 from wordpress-mobile/feature/18176-compact_height_header

Feature Introduction: show header titles in compact height

Author: ScoutHarris

WordPress/Classes/ViewRelated/Feature Introduction/Blogging Prompts/BloggingPromptsFeatureIntroduction.swift

@@ -1,6 +1,6 @@
 import UIKit
 
-// TODO: add description
+/// This displays a Feature Introduction specifically for Blogging Prompts.
 
 class BloggingPromptsFeatureIntroduction: FeatureIntroductionViewController {
 

WordPress/Classes/ViewRelated/Feature Introduction/FeatureIntroductionViewController.swift

@@ -5,7 +5,11 @@ import UIKit
     @objc optional func secondaryActionSelected()
 }
 
-// TODO: add description
+/// This is used to display a modal with information about a new feature.
+/// The feature description is displayed via the provided featureDescriptionView,
+/// which is presented in the scrollable area of the view.
+/// A primary action button is always displayed.
+/// A secondary action button is displayed if a secondaryButtonTitle is provided.
 
 class FeatureIntroductionViewController: CollapsableHeaderViewController {
 
@@ -25,6 +29,20 @@ class FeatureIntroductionViewController: CollapsableHeaderViewController {
 
     weak var featureIntroductionDelegate: FeatureIntroductionDelegate?
 
+    // MARK: - Header View Configuration
+
+    override var separatorStyle: SeparatorStyle {
+        return .hidden
+    }
+
+    override var alwaysResetHeaderOnRotation: Bool {
+        WPDeviceIdentification.isiPhone()
+    }
+
+    override var alwaysShowHeaderTitles: Bool {
+        true
+    }
+
     // MARK: - Init
 
     init(headerTitle: String,

WordPress/Classes/ViewRelated/Gutenberg/Collapsable Header/CollapsableHeaderViewController.swift

@@ -30,6 +30,13 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
         false
     }
 
+    // If set to true, all header titles will always be shown.
+    // If set to false, largeTitleView and promptView labels are hidden in compact height (default behavior).
+    //
+    var alwaysShowHeaderTitles: Bool {
+        false
+    }
+
     private let hasDefaultAction: Bool
     private var notificationObservers: [NSObjectProtocol] = []
     @IBOutlet weak var containerView: UIView!
@@ -55,6 +62,7 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
     @IBOutlet weak var promptView: UILabel!
     @IBOutlet weak var accessoryBar: UIView!
     @IBOutlet weak var accessoryBarHeightConstraint: NSLayoutConstraint!
+    @IBOutlet weak var accessoryBarTopCompactConstraint: NSLayoutConstraint!
     @IBOutlet weak var footerView: UIView!
     @IBOutlet weak var footerHeightContraint: NSLayoutConstraint!
     @IBOutlet weak var defaultActionButton: UIButton!
@@ -118,7 +126,7 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
     }
 
     private var shouldUseCompactLayout: Bool {
-        return traitCollection.verticalSizeClass == .compact
+        return !alwaysShowHeaderTitles && traitCollection.verticalSizeClass == .compact
     }
 
     private var topInset: CGFloat = 0
@@ -241,6 +249,7 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
             layoutHeader()
         }
 
+        configureHeaderTitleVisibility()
         startObservingKeyboardChanges()
         super.viewWillAppear(animated)
     }
@@ -257,9 +266,12 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
     override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
         super.viewWillTransition(to: size, with: coordinator)
 
-        guard isShowingNoResults || alwaysResetHeaderOnRotation else { return }
+        guard isShowingNoResults || alwaysResetHeaderOnRotation else {
+            return
+        }
 
         coordinator.animate(alongsideTransition: nil) { (_) in
+            self.accessoryBarTopCompactConstraint.isActive = self.shouldUseCompactLayout
             self.updateHeaderDisplay()
             // we're keeping this only for no results,
             // as originally intended before introducing the flag alwaysResetHeaderOnRotation
@@ -279,6 +291,7 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
 
         if let previousTraitCollection = previousTraitCollection, traitCollection.verticalSizeClass != previousTraitCollection.verticalSizeClass {
             isUserInitiatedScroll = false
+            configureHeaderTitleVisibility()
             layoutHeaderInsets()
 
             // This helps reset the header changes after a rotation.
@@ -372,6 +385,11 @@ class CollapsableHeaderViewController: UIViewController, NoResultsViewHost {
         headerImageView.image = headerImage
     }
 
+    func configureHeaderTitleVisibility() {
+        largeTitleView.isHidden = shouldUseCompactLayout
+        promptView.isHidden = shouldUseCompactLayout
+    }
+
     private func styleButtons() {
         let seperator = UIColor.separator
 

WordPress/Classes/ViewRelated/Gutenberg/Collapsable Header/CollapsableHeaderViewController.xib

@@ -14,6 +14,7 @@
             <connections>
                 <outlet property="accessoryBar" destination="DE5-R9-8tB" id="IAj-gK-2g6"/>
                 <outlet property="accessoryBarHeightConstraint" destination="Eej-Tm-ddy" id="xGU-f0-4kH"/>
+                <outlet property="accessoryBarTopCompactConstraint" destination="uVe-Ze-eIF" id="VXw-pp-QBH"/>
                 <outlet property="containerView" destination="WmP-bw-ceT" id="lul-gs-fMI"/>
                 <outlet property="defaultActionButton" destination="dmc-kV-0d8" id="NfO-bU-Zl7"/>
                 <outlet property="footerHeightContraint" destination="lle-48-IUZ" id="CV2-G2-ryj"/>
@@ -84,7 +85,6 @@
                                     <fontDescription key="fontDescription" style="UICTFontTextStyleTitle0"/>
                                     <nil key="textColor"/>
                                     <nil key="highlightedColor"/>
-                                    <variation key="heightClass=compact" hidden="YES"/>
                                 </label>
                             </subviews>
                             <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
@@ -100,7 +100,6 @@
                             <fontDescription key="fontDescription" style="UICTFontTextStyleBody"/>
                             <color key="textColor" systemColor="secondaryLabelColor"/>
                             <nil key="highlightedColor"/>
-                            <variation key="heightClass=compact" hidden="YES"/>
                         </label>
                         <view clipsSubviews="YES" contentMode="scaleToFill" verticalCompressionResistancePriority="1000" translatesAutoresizingMaskIntoConstraints="NO" id="DE5-R9-8tB" userLabel="Accessory Bar">
                             <rect key="frame" x="0.0" y="163" width="414" height="44"/>