felixfoertsch/bundesmessenger-ios
1
0
Fork 0
mirror of https://gitlab.opencode.de/bwi/bundesmessenger/clients/bundesmessenger-ios.git synced 2026-04-21 09:02:44 +02:00
Code Issues Packages Projects Releases Wiki Activity

Show an activity indicator until the preview has loaded.

Browse Source
This commit is contained in:
Doug
2021-09-02 17:37:48 +01:00
parent 2e795607bb
commit 885f3208bf
10 changed files with 88 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Riot/Modules/Room/Views/URLPreviews/URLPreviewView.swift
+33 -9
View File
@@ -37,7 +37,10 @@ class URLPreviewView: UIView, NibLoadable, Themable {
var preview: URLPreviewData? {
didSet {
guard let preview = preview else { return }
guard let preview = preview else {
renderLoading()
return
}
renderLoaded(preview)
}
}
@@ -47,10 +50,15 @@ class URLPreviewView: UIView, NibLoadable, Themable {
@IBOutlet weak var imageView: UIImageView!
@IBOutlet weak var closeButton: UIButton!
@IBOutlet weak var textContainerView: UIView!
@IBOutlet weak var siteNameLabel: UILabel!
@IBOutlet weak var titleLabel: UILabel!
@IBOutlet weak var descriptionLabel: UILabel!
@IBOutlet weak var loadingView: UIView!
@IBOutlet weak var loadingLabel: UILabel!
@IBOutlet weak var loadingActivityIndicator: UIActivityIndicatorView!
// Matches the label's height with the close button.
// Use a strong reference to keep it around when deactivating.
@IBOutlet var siteNameLabelHeightConstraint: NSLayoutConstraint!
@@ -98,14 +106,21 @@ class URLPreviewView: UIView, NibLoadable, Themable {
descriptionLabel.textColor = theme.colors.secondaryContent
descriptionLabel.font = theme.fonts.caption1
loadingLabel.textColor = siteNameLabel.textColor
let closeButtonAsset = ThemeService.shared().isCurrentThemeDark() ? Asset.Images.urlPreviewCloseDark : Asset.Images.urlPreviewClose
closeButton.setImage(closeButtonAsset.image, for: .normal)
}
static func contentViewHeight(for preview: URLPreviewData) -> CGFloat {
static func contentViewHeight(for preview: URLPreviewData?) -> CGFloat {
sizingView.frame = CGRect(x: 0, y: 0, width: Constants.width, height: 1)
sizingView.renderLoaded(preview)
// Call render directly to avoid storing the preview data in the sizing view
if let preview = preview {
sizingView.renderLoaded(preview)
} else {
sizingView.renderLoading()
}
sizingView.setNeedsLayout()
sizingView.layoutIfNeeded()
@@ -117,16 +132,18 @@ class URLPreviewView: UIView, NibLoadable, Themable {
}
// MARK: - Private
#warning("Check whether we should show a loading state.")
private func renderLoading(_ url: URL) {
imageView.image = nil
private func renderLoading() {
// hide the content
imageView.isHidden = true
textContainerView.isHidden = true
siteNameLabel.text = url.host
titleLabel.text = "Loading..."
descriptionLabel.text = ""
// show the loading interface
loadingView.isHidden = false
loadingActivityIndicator.startAnimating()
}
private func renderLoaded(_ preview: URLPreviewData) {
// update preview content
imageView.image = preview.image
siteNameLabel.text = preview.siteName ?? preview.url.host
titleLabel.text = preview.title
@@ -136,6 +153,13 @@ class URLPreviewView: UIView, NibLoadable, Themable {
}
private func updateLayout() {
// hide the loading interface
loadingView.isHidden = true
loadingActivityIndicator.stopAnimating()
// show the content
textContainerView.isHidden = false
if imageView.image == nil {
imageView.isHidden = true
Riot/Modules/Room/Views/URLPreviews/URLPreviewView.xib
+37 -12
View File
@@ -10,11 +10,11 @@
<objects>
<placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
<view contentMode="scaleToFill" id="dCz-KI-m5q" customClass="URLPreviewView" customModule="Riot" customModuleProvider="target">
<rect key="frame" x="0.0" y="0.0" width="267" height="222"/>
<rect key="frame" x="0.0" y="0.0" width="267" height="301"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<subviews>
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" translatesAutoresizingMaskIntoConstraints="NO" id="Rqc-iY-nm0">
<rect key="frame" x="0.0" y="0.0" width="267" height="222"/>
<rect key="frame" x="0.0" y="0.0" width="267" height="301"/>
<subviews>
<imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="4zc-0W-jb8">
<rect key="frame" x="0.0" y="0.0" width="267" height="140"/>
@@ -22,11 +22,11 @@
<constraint firstAttribute="height" constant="140" id="QpS-Ys-x5s"/>
</constraints>
</imageView>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="n9x-Yn-0qQ">
<rect key="frame" x="0.0" y="140" width="267" height="82"/>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="n9x-Yn-0qQ" userLabel="Text Container">
<rect key="frame" x="0.0" y="140" width="267" height="79"/>
<subviews>
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" alignment="top" spacing="2" translatesAutoresizingMaskIntoConstraints="NO" id="3Wa-hg-AAN">
<rect key="frame" x="8" y="8" width="251" height="66"/>
<rect key="frame" x="8" y="8" width="251" height="63"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Site Name" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="ay6-fT-tTb">
<rect key="frame" x="0.0" y="0.0" width="56" height="25"/>
@@ -43,17 +43,13 @@
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="252" verticalCompressionResistancePriority="250" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="2" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Z30-YF-eQk">
<rect key="frame" x="0.0" y="48.5" width="250.5" height="17.5"/>
<string key="text">Description with two lines of text for testing purposes, going bigger so we can see what happens. That's not enought text, more text keep gooing!</string>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="252" verticalCompressionResistancePriority="250" text="Description" textAlignment="natural" lineBreakMode="tailTruncation" numberOfLines="2" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="Z30-YF-eQk">
<rect key="frame" x="0.0" y="48.5" width="65" height="14.5"/>
<fontDescription key="fontDescription" type="system" pointSize="12"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<constraints>
<constraint firstAttribute="height" relation="lessThanOrEqual" constant="107" id="z0T-c3-WKF"/>
</constraints>
</stackView>
</subviews>
<color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
@@ -64,6 +60,31 @@
<constraint firstAttribute="bottom" secondItem="3Wa-hg-AAN" secondAttribute="bottom" constant="8" id="ysy-Gi-EZT"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="u8r-SW-zAH">
<rect key="frame" x="0.0" y="219" width="267" height="82"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Loading preview..." textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="imX-n1-KLc">
<rect key="frame" x="8" y="8" width="99.5" height="25"/>
<constraints>
<constraint firstAttribute="height" constant="25" id="g0l-y9-MQ5"/>
</constraints>
<fontDescription key="fontDescription" type="system" weight="semibold" pointSize="11"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
<activityIndicatorView opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="750" verticalHuggingPriority="750" style="medium" translatesAutoresizingMaskIntoConstraints="NO" id="SSJ-n0-24Z">
<rect key="frame" x="123.5" y="45" width="20" height="17"/>
</activityIndicatorView>
</subviews>
<color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstItem="SSJ-n0-24Z" firstAttribute="centerX" secondItem="u8r-SW-zAH" secondAttribute="centerX" id="121-oq-4Zn"/>
<constraint firstItem="imX-n1-KLc" firstAttribute="top" secondItem="u8r-SW-zAH" secondAttribute="top" constant="8" id="4HN-Oy-nLZ"/>
<constraint firstAttribute="bottom" secondItem="SSJ-n0-24Z" secondAttribute="bottom" constant="20" id="JVb-WU-tHN"/>
<constraint firstItem="SSJ-n0-24Z" firstAttribute="top" secondItem="imX-n1-KLc" secondAttribute="bottom" constant="12" id="Npd-t0-Acv"/>
<constraint firstItem="imX-n1-KLc" firstAttribute="leading" secondItem="u8r-SW-zAH" secondAttribute="leading" constant="8" id="eHD-Rn-lPP"/>
</constraints>
</view>
</subviews>
<constraints>
<constraint firstAttribute="width" constant="267" id="f2o-yq-NFO"/>
@@ -92,12 +113,16 @@
<outlet property="closeButton" destination="30L-fe-CQa" id="hFu-BX-zRP"/>
<outlet property="descriptionLabel" destination="Z30-YF-eQk" id="DJ4-Bg-MHW"/>
<outlet property="imageView" destination="4zc-0W-jb8" id="QRh-IX-XxR"/>
<outlet property="loadingActivityIndicator" destination="SSJ-n0-24Z" id="ylX-Qd-8t5"/>
<outlet property="loadingLabel" destination="imX-n1-KLc" id="zOH-Z7-v7v"/>
<outlet property="loadingView" destination="u8r-SW-zAH" id="s7r-Kl-w5h"/>
<outlet property="siteNameLabel" destination="ay6-fT-tTb" id="2wA-1z-lcs"/>
<outlet property="siteNameLabelHeightConstraint" destination="vhD-hz-f58" id="Bz9-ub-9UA"/>
<outlet property="textContainerView" destination="n9x-Yn-0qQ" id="Zul-rd-vrp"/>
<outlet property="titleLabel" destination="IVX-5S-0kr" id="PRN-5g-HiO"/>
<outletCollection property="gestureRecognizers" destination="rSB-1V-Kev" appends="YES" id="OOJ-ft-VIj"/>
</connections>
<point key="canvasLocation" x="1860.144927536232" y="-1.3392857142857142"/>
<point key="canvasLocation" x="1852.8985507246377" y="14.397321428571427"/>
</view>
<placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
<tapGestureRecognizer id="rSB-1V-Kev">