Make profile header follower/following counts separate buttons

This commit is contained in:
Shadowfacts 2024-03-09 14:07:23 -05:00
parent 074b028015
commit 3caa419659
4 changed files with 61 additions and 35 deletions

View File

@ -13,11 +13,11 @@ class AccountFollowsViewController: SegmentedPageViewController<AccountFollowsVi
let accountID: String let accountID: String
let mastodonController: MastodonController let mastodonController: MastodonController
init(accountID: String, mastodonController: MastodonController) { init(accountID: String, initialPage: Mode = .following, mastodonController: MastodonController) {
self.accountID = accountID self.accountID = accountID
self.mastodonController = mastodonController self.mastodonController = mastodonController
super.init(pages: [.following, .followers]) { mode in super.init(pages: [.following, .followers], initialPage: initialPage) { mode in
AccountFollowsListViewController(accountID: accountID, mastodonController: mastodonController, mode: mode) AccountFollowsListViewController(accountID: accountID, mastodonController: mastodonController, mode: mode)
} }
} }

View File

@ -27,13 +27,13 @@ class SegmentedPageViewController<Page: SegmentedPageViewControllerPage>: UIView
let segmentedControl = ScrollingSegmentedControl<Page>() let segmentedControl = ScrollingSegmentedControl<Page>()
init(pages: [Page], pageProvider: @escaping (Page) -> UIViewController) { init(pages: [Page], initialPage: Page? = nil, pageProvider: @escaping (Page) -> UIViewController) {
precondition(!pages.isEmpty) precondition(!pages.isEmpty)
self.pageProvider = pageProvider self.pageProvider = pageProvider
initialPage = pages.first! self.initialPage = initialPage ?? pages.first!
currentPage = pages.first! currentPage = self.initialPage
super.init(nibName: nil, bundle: nil) super.init(nibName: nil, bundle: nil)
@ -48,7 +48,7 @@ class SegmentedPageViewController<Page: SegmentedPageViewControllerPage>: UIView
// the segemented control itself is only focusable when VoiceOver is in Group navigation mode, // the segemented control itself is only focusable when VoiceOver is in Group navigation mode,
// so make it clear that to switch tabs the user needs to enter the group // so make it clear that to switch tabs the user needs to enter the group
segmentedControl.accessibilityHint = "Enter group to select timeline" segmentedControl.accessibilityHint = "Enter group to select timeline"
segmentedControl.setSelectedOption(segmentedControl.options.first!.value, animated: false) segmentedControl.setSelectedOption(self.initialPage, animated: false)
navigationItem.titleView = segmentedControl navigationItem.titleView = segmentedControl
} }
@ -94,6 +94,7 @@ class SegmentedPageViewController<Page: SegmentedPageViewControllerPage>: UIView
} }
} }
// Extension point for subclasses
func configureViewController(_ viewController: UIViewController) { func configureViewController(_ viewController: UIViewController) {
} }

View File

@ -36,7 +36,8 @@ class ProfileHeaderView: UIView {
@IBOutlet weak var relationshipLabel: UILabel! @IBOutlet weak var relationshipLabel: UILabel!
@IBOutlet weak var noteTextView: StatusContentTextView! @IBOutlet weak var noteTextView: StatusContentTextView!
@IBOutlet weak var fieldsView: ProfileFieldsView! @IBOutlet weak var fieldsView: ProfileFieldsView!
@IBOutlet weak var followCountButton: UIButton! @IBOutlet weak var followingCountButton: UIButton!
@IBOutlet weak var followersCountButton: UIButton!
private(set) var pagesSegmentedControl: ScrollingSegmentedControl<ProfileViewController.Page>! private(set) var pagesSegmentedControl: ScrollingSegmentedControl<ProfileViewController.Page>!
private var movedOverlayView: ProfileHeaderMovedOverlayView? private var movedOverlayView: ProfileHeaderMovedOverlayView?
@ -159,21 +160,22 @@ class ProfileHeaderView: UIView {
let (followingAbbr, followingSpelledOut) = formatBigNumber(account.followingCount) let (followingAbbr, followingSpelledOut) = formatBigNumber(account.followingCount)
let (followersAbbr, followersSpelledOut) = formatBigNumber(account.followersCount) let (followersAbbr, followersSpelledOut) = formatBigNumber(account.followersCount)
let followCountTitle = NSMutableAttributedString() let followingCountTitle = NSMutableAttributedString(string: followingAbbr, attributes: [
followCountTitle.append(NSAttributedString(string: followingAbbr, attributes: [
.font: UIFont.preferredFont(forTextStyle: .body).withTraits(.traitBold)!, .font: UIFont.preferredFont(forTextStyle: .body).withTraits(.traitBold)!,
])) ])
followCountTitle.append(NSAttributedString(string: " Following, ", attributes: [ followingCountTitle.append(NSAttributedString(string: " Following", attributes: [
.foregroundColor: UIColor.secondaryLabel, .foregroundColor: UIColor.secondaryLabel,
])) ]))
followCountTitle.append(NSAttributedString(string: followersAbbr, attributes: [ let followersCountTitle = NSMutableAttributedString(string: followersAbbr, attributes: [
.font: UIFont.preferredFont(forTextStyle: .body).withTraits(.traitBold)!, .font: UIFont.preferredFont(forTextStyle: .body).withTraits(.traitBold)!,
])) ])
followCountTitle.append(NSAttributedString(string: " Follower\(account.followersCount == 1 ? "" : "s")", attributes: [ followersCountTitle.append(NSAttributedString(string: " Follower\(account.followersCount == 1 ? "" : "s")", attributes: [
.foregroundColor: UIColor.secondaryLabel, .foregroundColor: UIColor.secondaryLabel,
])) ]))
followCountButton.setAttributedTitle(followCountTitle, for: .normal) followingCountButton.setAttributedTitle(followingCountTitle, for: .normal)
followCountButton.accessibilityLabel = "\(followingSpelledOut) following, \(followersSpelledOut) followers" followingCountButton.accessibilityLabel = "\(followingSpelledOut) following"
followersCountButton.setAttributedTitle(followersCountTitle, for: .normal)
followersCountButton.accessibilityLabel = "\(followersSpelledOut) followers"
if let movedTo = account.movedTo { if let movedTo = account.movedTo {
if let movedOverlayView { if let movedOverlayView {
@ -398,9 +400,14 @@ class ProfileHeaderView: UIView {
} }
} }
@IBAction func followCountButtonPressed(_ sender: Any) { @IBAction func followingCountButtonPressed(_ sender: Any) {
guard let accountID else { return } guard let accountID else { return }
delegate?.show(AccountFollowsViewController(accountID: accountID, mastodonController: mastodonController)) delegate?.show(AccountFollowsViewController(accountID: accountID, initialPage: .following, mastodonController: mastodonController))
}
@IBAction func followersCountButtonPressed(_ sender: Any) {
guard let accountID else { return }
delegate?.show(AccountFollowsViewController(accountID: accountID, initialPage: .followers, mastodonController: mastodonController))
} }
} }

View File

@ -1,9 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="22155" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES"> <document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="32700.99.1234" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
<device id="retina6_1" orientation="portrait" appearance="light"/> <device id="retina6_1" orientation="portrait" appearance="light"/>
<dependencies> <dependencies>
<deployment identifier="iOS"/> <deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22131"/> <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22684"/>
<capability name="Safe area layout guides" minToolsVersion="9.0"/> <capability name="Safe area layout guides" minToolsVersion="9.0"/>
<capability name="System colors in document resources" minToolsVersion="11.0"/> <capability name="System colors in document resources" minToolsVersion="11.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/> <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
@ -71,36 +71,53 @@
<nil key="highlightedColor"/> <nil key="highlightedColor"/>
</label> </label>
<textView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" horizontalHuggingPriority="249" verticalHuggingPriority="251" horizontalCompressionResistancePriority="749" scrollEnabled="NO" delaysContentTouches="NO" editable="NO" textAlignment="natural" selectable="NO" translatesAutoresizingMaskIntoConstraints="NO" id="1O8-2P-Gbf" customClass="StatusContentTextView" customModule="Tusker" customModuleProvider="target"> <textView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" horizontalHuggingPriority="249" verticalHuggingPriority="251" horizontalCompressionResistancePriority="749" scrollEnabled="NO" delaysContentTouches="NO" editable="NO" textAlignment="natural" selectable="NO" translatesAutoresizingMaskIntoConstraints="NO" id="1O8-2P-Gbf" customClass="StatusContentTextView" customModule="Tusker" customModuleProvider="target">
<rect key="frame" x="0.0" y="0.0" width="382" height="259.5"/> <rect key="frame" x="0.0" y="0.0" width="382" height="427.5"/>
<string key="text">Lorem ipsum dolor sit er elit lamet, consectetaur cillium adipisicing pecu, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Nam liber te conscient to factor tum poen legum odioque civiuda.</string> <string key="text">Lorem ipsum dolor sit er elit lamet, consectetaur cillium adipisicing pecu, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Nam liber te conscient to factor tum poen legum odioque civiuda.</string>
<color key="textColor" systemColor="labelColor"/> <color key="textColor" systemColor="labelColor"/>
<fontDescription key="fontDescription" type="system" pointSize="17"/> <fontDescription key="fontDescription" type="system" pointSize="17"/>
<textInputTraits key="textInputTraits" autocapitalizationType="sentences"/> <textInputTraits key="textInputTraits" autocapitalizationType="sentences"/>
</textView> </textView>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="vKC-m1-Sbs" customClass="ProfileFieldsView" customModule="Tusker" customModuleProvider="target"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="vKC-m1-Sbs" customClass="ProfileFieldsView" customModule="Tusker" customModuleProvider="target">
<rect key="frame" x="0.0" y="263.5" width="382" height="128"/> <rect key="frame" x="0.0" y="431.5" width="382" height="128"/>
<constraints> <constraints>
<constraint firstAttribute="height" constant="128" placeholder="YES" id="xbR-M6-H0I"/> <constraint firstAttribute="height" constant="128" placeholder="YES" id="xbR-M6-H0I"/>
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="ood-3e-sSu" userLabel="Spacer"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="ood-3e-sSu" userLabel="Spacer">
<rect key="frame" x="0.0" y="395.5" width="240" height="8"/> <rect key="frame" x="0.0" y="563.5" width="240" height="8"/>
<color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/> <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints> <constraints>
<constraint firstAttribute="height" constant="8" id="5ri-vD-wXe"/> <constraint firstAttribute="height" constant="8" id="5ri-vD-wXe"/>
</constraints> </constraints>
</view> </view>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="5w9-LA-8kc"> <stackView opaque="NO" contentMode="scaleToFill" distribution="fillProportionally" spacing="8" translatesAutoresizingMaskIntoConstraints="NO" id="udp-EN-wtc">
<rect key="frame" x="0.0" y="407.5" width="219" height="188.5"/> <rect key="frame" x="0.0" y="575.5" width="218.5" height="20.5"/>
<state key="normal" title="Button"/> <subviews>
<buttonConfiguration key="configuration" style="plain" title="123 Following, 1.2k Followers"> <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="5w9-LA-8kc">
<fontDescription key="titleFontDescription" style="UICTFontTextStyleBody"/> <rect key="frame" x="0.0" y="0.0" width="104" height="20.5"/>
<directionalEdgeInsets key="contentInsets" top="0.0" leading="0.0" bottom="0.0" trailing="0.0"/> <state key="normal" title="Button"/>
</buttonConfiguration> <buttonConfiguration key="configuration" style="plain" title="123 Following">
<connections> <fontDescription key="titleFontDescription" style="UICTFontTextStyleBody"/>
<action selector="followCountButtonPressed:" destination="iN0-l3-epB" eventType="touchUpInside" id="QOO-zK-pfu"/> <directionalEdgeInsets key="contentInsets" top="0.0" leading="0.0" bottom="0.0" trailing="0.0"/>
</connections> </buttonConfiguration>
</button> <connections>
<action selector="followingCountButtonPressed:" destination="iN0-l3-epB" eventType="touchUpInside" id="QOO-zK-pfu"/>
</connections>
</button>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" id="XCX-Y3-cG5">
<rect key="frame" x="112" y="0.0" width="106.5" height="20.5"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<state key="normal" title="Button"/>
<buttonConfiguration key="configuration" style="plain" title="1.2k Followers">
<fontDescription key="titleFontDescription" style="UICTFontTextStyleBody"/>
<directionalEdgeInsets key="contentInsets" top="0.0" leading="0.0" bottom="0.0" trailing="0.0"/>
</buttonConfiguration>
<connections>
<action selector="followersCountButtonPressed:" destination="iN0-l3-epB" eventType="touchUpInside" id="LCU-Gy-Dtt"/>
</connections>
</button>
</subviews>
</stackView>
</subviews> </subviews>
<constraints> <constraints>
<constraint firstItem="vKC-m1-Sbs" firstAttribute="width" secondItem="u4P-3i-gEq" secondAttribute="width" id="0dI-ax-7eI"/> <constraint firstItem="vKC-m1-Sbs" firstAttribute="width" secondItem="u4P-3i-gEq" secondAttribute="width" id="0dI-ax-7eI"/>
@ -156,7 +173,8 @@
<outlet property="displayNameLabel" destination="vcl-Gl-kXl" id="64n-a9-my0"/> <outlet property="displayNameLabel" destination="vcl-Gl-kXl" id="64n-a9-my0"/>
<outlet property="fieldsView" destination="vKC-m1-Sbs" id="FeE-jh-lYH"/> <outlet property="fieldsView" destination="vKC-m1-Sbs" id="FeE-jh-lYH"/>
<outlet property="followButton" destination="cr8-p9-xkc" id="E1n-gh-mCl"/> <outlet property="followButton" destination="cr8-p9-xkc" id="E1n-gh-mCl"/>
<outlet property="followCountButton" destination="5w9-LA-8kc" id="umN-5g-q8N"/> <outlet property="followersCountButton" destination="XCX-Y3-cG5" id="PS4-0R-6Pw"/>
<outlet property="followingCountButton" destination="5w9-LA-8kc" id="umN-5g-q8N"/>
<outlet property="headerImageView" destination="dgG-dR-lSv" id="HXT-v4-2iX"/> <outlet property="headerImageView" destination="dgG-dR-lSv" id="HXT-v4-2iX"/>
<outlet property="lockImageView" destination="KNY-GD-beC" id="9EJ-iM-Eos"/> <outlet property="lockImageView" destination="KNY-GD-beC" id="9EJ-iM-Eos"/>
<outlet property="moreButton" destination="vFa-g3-xIP" id="dEX-1a-PHF"/> <outlet property="moreButton" destination="vFa-g3-xIP" id="dEX-1a-PHF"/>