-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #18456 from wordpress-mobile/feature/18402-bottom-…
…sheet-prompt Blogging Prompts: Create prompts header view for create new action sheet
- Loading branch information
Showing
4 changed files
with
231 additions
and
1 deletion.
There are no files selected for viewing
92 changes: 92 additions & 0 deletions
92
WordPress/Classes/ViewRelated/System/Action Sheet/BloggingPromptsHeaderView.swift
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,92 @@ | ||
import UIKit | ||
|
||
class BloggingPromptsHeaderView: UIView, NibLoadable { | ||
@IBOutlet private weak var containerStackView: UIStackView! | ||
@IBOutlet private weak var titleStackView: UIStackView! | ||
@IBOutlet private weak var titleLabel: UILabel! | ||
@IBOutlet private weak var promptLabel: UILabel! | ||
@IBOutlet private weak var answerPromptButton: UIButton! | ||
@IBOutlet private weak var answeredStackView: UIStackView! | ||
@IBOutlet private weak var answeredLabel: UILabel! | ||
@IBOutlet private weak var shareButton: UIButton! | ||
@IBOutlet private weak var dividerView: UIView! | ||
|
||
override func awakeFromNib() { | ||
super.awakeFromNib() | ||
configureView() | ||
} | ||
|
||
@IBAction private func answerPromptTapped(_ sender: Any) { | ||
// TODO | ||
} | ||
|
||
@IBAction private func shareTapped(_ sender: Any) { | ||
// TODO | ||
} | ||
} | ||
|
||
// MARK: - Private methods | ||
|
||
private extension BloggingPromptsHeaderView { | ||
|
||
func configureView() { | ||
// TODO: Hide correct UI based on if prompt is answered | ||
answerPromptButton.isHidden = true | ||
configureSpacing() | ||
configureStrings() | ||
configureStyles() | ||
configureConstraints() | ||
} | ||
|
||
func configureSpacing() { | ||
containerStackView.setCustomSpacing(Constants.titleSpacing, after: titleStackView) | ||
containerStackView.setCustomSpacing(Constants.answeredViewSpacing, after: answeredStackView) | ||
containerStackView.setCustomSpacing(Constants.answerPromptButtonSpacing, after: answerPromptButton) | ||
} | ||
|
||
func configureStrings() { | ||
titleLabel.text = Strings.title | ||
// TODO: Use prompt from backend | ||
promptLabel.text = Strings.examplePrompt | ||
answerPromptButton.titleLabel?.text = Strings.answerButtonTitle | ||
answeredLabel.text = Strings.answeredLabelTitle | ||
shareButton.titleLabel?.text = Strings.shareButtonTitle | ||
} | ||
|
||
func configureStyles() { | ||
titleLabel.font = WPStyleGuide.fontForTextStyle(.subheadline, fontWeight: .semibold) | ||
promptLabel.font = WPStyleGuide.BloggingPrompts.promptContentFont | ||
answerPromptButton.titleLabel?.font = WPStyleGuide.BloggingPrompts.buttonTitleFont | ||
answerPromptButton.titleLabel?.adjustsFontForContentSizeCategory = true | ||
answerPromptButton.setTitleColor(WPStyleGuide.BloggingPrompts.buttonTitleColor, for: .normal) | ||
answeredLabel.font = WPStyleGuide.BloggingPrompts.buttonTitleFont | ||
answeredLabel.textColor = WPStyleGuide.BloggingPrompts.answeredLabelColor | ||
shareButton.titleLabel?.font = WPStyleGuide.BloggingPrompts.buttonTitleFont | ||
shareButton.titleLabel?.adjustsFontForContentSizeCategory = true | ||
shareButton.titleLabel?.adjustsFontSizeToFitWidth = true | ||
shareButton.setTitleColor(WPStyleGuide.BloggingPrompts.buttonTitleColor, for: .normal) | ||
} | ||
|
||
func configureConstraints() { | ||
NSLayoutConstraint.activate([ | ||
dividerView.heightAnchor.constraint(equalToConstant: .hairlineBorderWidth), | ||
]) | ||
} | ||
|
||
// MARK: - Constants | ||
|
||
struct Constants { | ||
static let titleSpacing: CGFloat = 8.0 | ||
static let answeredViewSpacing: CGFloat = 9.0 | ||
static let answerPromptButtonSpacing: CGFloat = 9.0 | ||
} | ||
|
||
struct Strings { | ||
static let examplePrompt = NSLocalizedString("Cast the movie of your life.", comment: "Example prompt for blogging prompts in the create new bottom action sheet.") | ||
static let title = NSLocalizedString("Prompts", comment: "Title label for blogging prompts in the create new bottom action sheet.") | ||
static let answerButtonTitle = NSLocalizedString("Answer Prompt", comment: "Title for a call-to-action button in the create new bottom action sheet.") | ||
static let answeredLabelTitle = NSLocalizedString("✓ Answered", comment: "Title label that indicates the prompt has been answered.") | ||
static let shareButtonTitle = NSLocalizedString("Share", comment: "Title for a button that allows the user to share their answer to the prompt.") | ||
} | ||
|
||
} |
125 changes: 125 additions & 0 deletions
125
WordPress/Classes/ViewRelated/System/Action Sheet/BloggingPromptsHeaderView.xib
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,125 @@ | ||
<?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> | ||
<deployment identifier="iOS"/> | ||
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/> | ||
<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" insetsLayoutMarginsFromSafeArea="NO" id="iN0-l3-epB" customClass="BloggingPromptsHeaderView" customModule="WordPress" customModuleProvider="target"> | ||
<rect key="frame" x="0.0" y="0.0" width="349" height="120"/> | ||
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/> | ||
<subviews> | ||
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" alignment="center" translatesAutoresizingMaskIntoConstraints="NO" id="HBh-15-Hby"> | ||
<rect key="frame" x="0.0" y="0.0" width="349" height="92"/> | ||
<subviews> | ||
<stackView opaque="NO" contentMode="scaleToFill" alignment="center" spacing="5" translatesAutoresizingMaskIntoConstraints="NO" id="stO-XN-YJp"> | ||
<rect key="frame" x="131" y="0.0" width="87.5" height="24"/> | ||
<subviews> | ||
<imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" image="icon-lightbulb-outline" translatesAutoresizingMaskIntoConstraints="NO" id="AiS-VC-l3e"> | ||
<rect key="frame" x="0.0" y="3" width="18" height="18"/> | ||
<constraints> | ||
<constraint firstAttribute="width" constant="18" id="VuP-Sn-J3O"/> | ||
<constraint firstAttribute="height" constant="18" id="Wgm-8p-3As"/> | ||
</constraints> | ||
</imageView> | ||
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" verticalCompressionResistancePriority="751" text="Prompts" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="BJN-uB-YYG"> | ||
<rect key="frame" x="23" y="0.0" width="64.5" height="24"/> | ||
<constraints> | ||
<constraint firstAttribute="height" relation="greaterThanOrEqual" constant="24" id="5Im-WR-keg"/> | ||
</constraints> | ||
<fontDescription key="fontDescription" type="system" pointSize="17"/> | ||
<nil key="textColor"/> | ||
<nil key="highlightedColor"/> | ||
</label> | ||
</subviews> | ||
</stackView> | ||
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" verticalCompressionResistancePriority="751" text="Cast the movie of your life." textAlignment="center" lineBreakMode="tailTruncation" numberOfLines="3" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Rye-vB-0gG"> | ||
<rect key="frame" x="73.5" y="24" width="202.5" height="24"/> | ||
<constraints> | ||
<constraint firstAttribute="height" relation="greaterThanOrEqual" constant="24" id="XJS-Qq-aST"/> | ||
</constraints> | ||
<fontDescription key="fontDescription" type="system" pointSize="17"/> | ||
<nil key="textColor"/> | ||
<nil key="highlightedColor"/> | ||
</label> | ||
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="fqk-gy-gv5"> | ||
<rect key="frame" x="125" y="48" width="99" height="23.5"/> | ||
<state key="normal" title="Button"/> | ||
<buttonConfiguration key="configuration" style="plain" title="Answer Prompt"> | ||
<directionalEdgeInsets key="contentInsets" top="16" leading="0.0" bottom="16" trailing="0.0"/> | ||
</buttonConfiguration> | ||
<connections> | ||
<action selector="answerPromptTapped:" destination="iN0-l3-epB" eventType="touchUpInside" id="maK-JO-Huc"/> | ||
</connections> | ||
</button> | ||
<stackView opaque="NO" contentMode="scaleToFill" spacing="16" translatesAutoresizingMaskIntoConstraints="NO" id="74j-gh-nmq"> | ||
<rect key="frame" x="100.5" y="71.5" width="148" height="20.5"/> | ||
<subviews> | ||
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="✓ Answered" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontForContentSizeCategory="YES" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="ttu-81-Rjc"> | ||
<rect key="frame" x="0.0" y="0.0" width="94.5" height="20.5"/> | ||
<fontDescription key="fontDescription" type="system" pointSize="17"/> | ||
<nil key="textColor"/> | ||
<nil key="highlightedColor"/> | ||
</label> | ||
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="deu-kl-qJY"> | ||
<rect key="frame" x="110.5" y="0.0" width="37.5" height="20.5"/> | ||
<state key="normal" title="Button"/> | ||
<buttonConfiguration key="configuration" style="plain" title="Share"> | ||
<directionalEdgeInsets key="contentInsets" top="16" leading="0.0" bottom="16" trailing="0.0"/> | ||
</buttonConfiguration> | ||
<connections> | ||
<action selector="shareTapped:" destination="iN0-l3-epB" eventType="touchUpInside" id="ABZ-P1-FDh"/> | ||
</connections> | ||
</button> | ||
</subviews> | ||
</stackView> | ||
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="9KN-UC-IRC"> | ||
<rect key="frame" x="0.0" y="92" width="349" height="0.0"/> | ||
<color key="backgroundColor" systemColor="separatorColor"/> | ||
</view> | ||
</subviews> | ||
<constraints> | ||
<constraint firstItem="9KN-UC-IRC" firstAttribute="leading" secondItem="HBh-15-Hby" secondAttribute="leading" id="i3E-vF-ouk"/> | ||
<constraint firstAttribute="trailing" secondItem="9KN-UC-IRC" secondAttribute="trailing" id="j2W-Lj-CP5"/> | ||
</constraints> | ||
</stackView> | ||
</subviews> | ||
<color key="backgroundColor" systemColor="systemBackgroundColor"/> | ||
<constraints> | ||
<constraint firstItem="HBh-15-Hby" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" id="1Us-st-jWK"/> | ||
<constraint firstItem="HBh-15-Hby" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" id="CcK-Dx-5sh"/> | ||
<constraint firstAttribute="bottom" secondItem="HBh-15-Hby" secondAttribute="bottom" constant="28" id="a95-RM-xA7"/> | ||
<constraint firstAttribute="trailing" secondItem="HBh-15-Hby" secondAttribute="trailing" id="gqq-A6-5fK"/> | ||
</constraints> | ||
<nil key="simulatedTopBarMetrics"/> | ||
<nil key="simulatedBottomBarMetrics"/> | ||
<freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/> | ||
<connections> | ||
<outlet property="answerPromptButton" destination="fqk-gy-gv5" id="g2H-Pl-Cot"/> | ||
<outlet property="answeredLabel" destination="ttu-81-Rjc" id="qUD-tY-fry"/> | ||
<outlet property="answeredStackView" destination="74j-gh-nmq" id="mWB-ce-YU3"/> | ||
<outlet property="containerStackView" destination="HBh-15-Hby" id="ce7-Wx-TUC"/> | ||
<outlet property="dividerView" destination="9KN-UC-IRC" id="Wnd-hZ-yio"/> | ||
<outlet property="promptLabel" destination="Rye-vB-0gG" id="VoE-0W-soe"/> | ||
<outlet property="shareButton" destination="deu-kl-qJY" id="4ur-ok-U6p"/> | ||
<outlet property="titleLabel" destination="BJN-uB-YYG" id="zxX-90-kDD"/> | ||
<outlet property="titleStackView" destination="stO-XN-YJp" id="Mjx-Bg-Wpo"/> | ||
</connections> | ||
<point key="canvasLocation" x="180.43478260869566" y="-91.741071428571431"/> | ||
</view> | ||
</objects> | ||
<resources> | ||
<image name="icon-lightbulb-outline" width="24" height="24"/> | ||
<systemColor name="separatorColor"> | ||
<color red="0.23529411764705882" green="0.23529411764705882" blue="0.2627450980392157" alpha="0.28999999999999998" colorSpace="custom" customColorSpace="sRGB"/> | ||
</systemColor> | ||
<systemColor name="systemBackgroundColor"> | ||
<color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/> | ||
</systemColor> | ||
</resources> | ||
</document> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.