Create BubbleReactionViewCell

This commit is contained in:
SBiOSoftWhare 2019-05-20 21:51:24 +02:00
parent 2d118853a7
commit e5d8910a92
3 changed files with 199 additions and 0 deletions

View file

@ -0,0 +1,107 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import UIKit
import Reusable
final class BubbleReactionViewCell: UICollectionViewCell, NibReusable, Themable {
// MARK: - Constants
private enum Constants {
static let selectedBorderWidth: CGFloat = 1.0
}
// MARK: - Properties
// MARK: Outlets
@IBOutlet private weak var reactionBackgroundView: UIView!
@IBOutlet private weak var emojiLabel: UILabel!
@IBOutlet private weak var countLabel: UILabel!
// MARK: Private
private var theme: Theme?
// MARK: Public
private var isReactionSelected: Bool = false
// MARK: - Life cycle
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
self.reactionBackgroundView.layer.masksToBounds = true
}
override func layoutSubviews() {
super.layoutSubviews()
self.reactionBackgroundView.layer.cornerRadius = self.reactionBackgroundView.frame.size.height/2.0
}
override func preferredLayoutAttributesFitting(_ layoutAttributes: UICollectionViewLayoutAttributes) -> UICollectionViewLayoutAttributes {
if #available(iOS 12.0, *) {
/*
On iOS 12, there are issues with self-sizing cells as described in Apple release notes (https://developer.apple.com/documentation/ios_release_notes/ios_12_release_notes) :
"You might encounter issues with systemLayoutSizeFitting(_:) when using a UICollectionViewCell subclass that requires updateConstraints().
(42138227) Workaround: Don't call the cell's setNeedsUpdateConstraints() method unless you need to support live constraint changes.
If you need to support live constraint changes, call updateConstraintsIfNeeded() before calling systemLayoutSizeFitting(_:)."
*/
self.updateConstraintsIfNeeded()
}
return super.preferredLayoutAttributesFitting(layoutAttributes)
}
// MARK: - Public
func fill(viewData: BubbleReactionViewData) {
self.emojiLabel.text = viewData.emoji
self.countLabel.text = viewData.countString
self.isReactionSelected = viewData.isCurrentUserReacted
self.updateViews()
}
func update(theme: Theme) {
self.theme = theme
self.reactionBackgroundView.layer.borderColor = self.theme?.reactionButtonSelectedBorderColor.cgColor
self.countLabel.textColor = self.theme?.textPrimaryColor
self.updateViews()
}
// MARK: - Private
private func updateViews() {
let reactionBackgroundColor: UIColor?
let reactionBackgroundBorderWidth: CGFloat
if self.isReactionSelected {
reactionBackgroundColor = self.theme?.reactionButtonSelectedBackgroundColor
reactionBackgroundBorderWidth = Constants.selectedBorderWidth
} else {
reactionBackgroundColor = self.theme?.headerBackgroundColor
reactionBackgroundBorderWidth = 0.0
}
self.reactionBackgroundView.layer.borderWidth = reactionBackgroundBorderWidth
self.reactionBackgroundView.backgroundColor = reactionBackgroundColor
}
}

View file

@ -0,0 +1,69 @@
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="14490.70" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
<device id="retina6_1" orientation="portrait">
<adaptation id="fullscreen"/>
</device>
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14490.49"/>
<capability name="Safe area layout guides" minToolsVersion="9.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"/>
<collectionViewCell opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" id="gTV-IL-0wX" customClass="BubbleReactionViewCell" customModule="Riot" customModuleProvider="target">
<rect key="frame" x="0.0" y="0.0" width="66" height="22"/>
<autoresizingMask key="autoresizingMask"/>
<view key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center">
<rect key="frame" x="0.0" y="0.0" width="66" height="22"/>
<autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="jjn-uq-kYN">
<rect key="frame" x="0.0" y="0.0" width="66" height="22"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="252" verticalHuggingPriority="251" horizontalCompressionResistancePriority="751" text="👍" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="gyn-ux-gmi">
<rect key="frame" x="6" y="4" width="26" height="14"/>
<fontDescription key="fontDescription" type="system" pointSize="11"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="230" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="DQc-oh-Wus">
<rect key="frame" x="34" y="4" width="26" height="14"/>
<constraints>
<constraint firstAttribute="width" relation="lessThanOrEqual" constant="26" id="qaD-Xb-kVP"/>
</constraints>
<fontDescription key="fontDescription" type="system" pointSize="12"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<color key="backgroundColor" red="0.95294117647058818" green="0.97254901960784312" blue="0.99215686274509807" alpha="1" colorSpace="calibratedRGB"/>
<constraints>
<constraint firstItem="DQc-oh-Wus" firstAttribute="centerY" secondItem="gyn-ux-gmi" secondAttribute="centerY" id="E1I-l3-qql"/>
<constraint firstItem="gyn-ux-gmi" firstAttribute="leading" secondItem="jjn-uq-kYN" secondAttribute="leading" constant="6" id="OZ2-Xd-9f3"/>
<constraint firstItem="gyn-ux-gmi" firstAttribute="top" secondItem="jjn-uq-kYN" secondAttribute="top" constant="4" id="et3-mn-8dh"/>
<constraint firstAttribute="trailing" secondItem="DQc-oh-Wus" secondAttribute="trailing" constant="6" id="oJE-06-g5e"/>
<constraint firstAttribute="bottom" secondItem="gyn-ux-gmi" secondAttribute="bottom" constant="4" id="thv-mo-0kv"/>
<constraint firstItem="DQc-oh-Wus" firstAttribute="leading" secondItem="gyn-ux-gmi" secondAttribute="trailing" constant="2" id="y7s-iU-ycf"/>
</constraints>
</view>
</subviews>
</view>
<constraints>
<constraint firstItem="jjn-uq-kYN" firstAttribute="leading" secondItem="gTV-IL-0wX" secondAttribute="leading" id="E5H-9a-us9"/>
<constraint firstAttribute="bottom" secondItem="jjn-uq-kYN" secondAttribute="bottom" id="Ggm-1f-3EB"/>
<constraint firstItem="jjn-uq-kYN" firstAttribute="top" secondItem="gTV-IL-0wX" secondAttribute="top" id="iT6-rk-qd6"/>
<constraint firstAttribute="trailing" secondItem="jjn-uq-kYN" secondAttribute="trailing" id="ztM-7J-Dnf"/>
</constraints>
<viewLayoutGuide key="safeArea" id="ZTg-uK-7eu"/>
<size key="customSize" width="443" height="170"/>
<connections>
<outlet property="countLabel" destination="DQc-oh-Wus" id="GZt-aS-umB"/>
<outlet property="emojiLabel" destination="gyn-ux-gmi" id="qme-DX-UAc"/>
<outlet property="reactionBackgroundView" destination="jjn-uq-kYN" id="Q0x-Np-wEa"/>
</connections>
<point key="canvasLocation" x="-459.4202898550725" y="-207.58928571428569"/>
</collectionViewCell>
</objects>
</document>

View file

@ -0,0 +1,23 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import Foundation
struct BubbleReactionViewData {
let emoji: String
let countString: String
let isCurrentUserReacted: Bool
}