mirror of
https://gitlab.opencode.de/bwi/bundesmessenger/clients/bundesmessenger-ios.git
synced 2026-04-21 00:52:43 +02:00
Emoji picker: Implement Emoji picker screen.
This commit is contained in:
SBiOSoftWhare
@@ -0,0 +1,76 @@
|
||||
// File created from ScreenTemplate
|
||||
// $ createScreen.sh toto EmojiPicker
|
||||
/*
|
||||
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
|
||||
import UIKit
|
||||
|
||||
final class EmojiPickerCoordinator: EmojiPickerCoordinatorType {
|
||||
|
||||
// MARK: - Properties
|
||||
|
||||
// MARK: Private
|
||||
|
||||
private let session: MXSession
|
||||
private let roomId: String
|
||||
private let eventId: String
|
||||
private let router: NavigationRouter
|
||||
|
||||
// MARK: Public
|
||||
|
||||
// Must be used only internally
|
||||
var childCoordinators: [Coordinator] = []
|
||||
|
||||
weak var delegate: EmojiPickerCoordinatorDelegate?
|
||||
|
||||
// MARK: - Setup
|
||||
|
||||
init(session: MXSession, roomId: String, eventId: String) {
|
||||
self.session = session
|
||||
self.roomId = roomId
|
||||
self.eventId = eventId
|
||||
self.router = NavigationRouter(navigationController: RiotNavigationController())
|
||||
}
|
||||
|
||||
// MARK: - Public methods
|
||||
|
||||
func start() {
|
||||
let emojiPickerViewModel = EmojiPickerViewModel(session: self.session, roomId: self.roomId, eventId: self.eventId)
|
||||
let emojiPickerViewController = EmojiPickerViewController.instantiate(with: emojiPickerViewModel)
|
||||
emojiPickerViewModel.coordinatorDelegate = self
|
||||
self.router.setRootModule(emojiPickerViewController)
|
||||
}
|
||||
|
||||
func toPresentable() -> UIViewController {
|
||||
return self.router.toPresentable()
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - EmojiPickerViewModelCoordinatorDelegate
|
||||
extension EmojiPickerCoordinator: EmojiPickerViewModelCoordinatorDelegate {
|
||||
func emojiPickerViewModel(_ viewModel: EmojiPickerViewModelType, didAddEmoji emoji: String, forEventId eventId: String) {
|
||||
self.delegate?.emojiPickerCoordinator(self, didAddEmoji: emoji, forEventId: eventId)
|
||||
}
|
||||
|
||||
func emojiPickerViewModel(_ viewModel: EmojiPickerViewModelType, didRemoveEmoji emoji: String, forEventId eventId: String) {
|
||||
self.delegate?.emojiPickerCoordinator(self, didRemoveEmoji: emoji, forEventId: eventId)
|
||||
}
|
||||
|
||||
func emojiPickerViewModelDidCancel(_ viewModel: EmojiPickerViewModelType) {
|
||||
self.delegate?.emojiPickerCoordinatorDidCancel(self)
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,30 @@
|
||||
// File created from ScreenTemplate
|
||||
// $ createScreen.sh toto EmojiPicker
|
||||
/*
|
||||
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
|
||||
|
||||
protocol EmojiPickerCoordinatorDelegate: class {
|
||||
func emojiPickerCoordinator(_ coordinator: EmojiPickerCoordinatorType, didAddEmoji emoji: String, forEventId eventId: String)
|
||||
func emojiPickerCoordinator(_ coordinator: EmojiPickerCoordinatorType, didRemoveEmoji emoji: String, forEventId eventId: String)
|
||||
func emojiPickerCoordinatorDidCancel(_ coordinator: EmojiPickerCoordinatorType)
|
||||
}
|
||||
|
||||
/// `EmojiPickerCoordinatorType` is a protocol describing a Coordinator that handle key backup setup passphrase navigation flow.
|
||||
protocol EmojiPickerCoordinatorType: Coordinator, Presentable {
|
||||
var delegate: EmojiPickerCoordinatorDelegate? { get }
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="14490.70" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="V8j-Lb-PgC">
|
||||
<device id="retina4_7" 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>
|
||||
<scenes>
|
||||
<!--Emoji Picker View Controller-->
|
||||
<scene sceneID="mt5-wz-YKA">
|
||||
<objects>
|
||||
<viewController extendedLayoutIncludesOpaqueBars="YES" automaticallyAdjustsScrollViewInsets="NO" id="V8j-Lb-PgC" customClass="EmojiPickerViewController" customModule="Riot" customModuleProvider="target" sceneMemberID="viewController">
|
||||
<view key="view" contentMode="scaleToFill" id="EL9-GA-lwo">
|
||||
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
|
||||
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
|
||||
<subviews>
|
||||
<collectionView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" translatesAutoresizingMaskIntoConstraints="NO" id="Kjj-O1-UsZ">
|
||||
<rect key="frame" x="0.0" y="20" width="375" height="647"/>
|
||||
<color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
|
||||
<collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="iPs-P1-bkS">
|
||||
<size key="itemSize" width="50" height="50"/>
|
||||
<size key="headerReferenceSize" width="0.0" height="0.0"/>
|
||||
<size key="footerReferenceSize" width="0.0" height="0.0"/>
|
||||
<inset key="sectionInset" minX="0.0" minY="0.0" maxX="0.0" maxY="0.0"/>
|
||||
</collectionViewFlowLayout>
|
||||
<cells/>
|
||||
<connections>
|
||||
<outlet property="dataSource" destination="V8j-Lb-PgC" id="ZkG-A0-JGC"/>
|
||||
<outlet property="delegate" destination="V8j-Lb-PgC" id="iXC-RG-INF"/>
|
||||
</connections>
|
||||
</collectionView>
|
||||
</subviews>
|
||||
<color key="backgroundColor" red="0.94509803921568625" green="0.96078431372549022" blue="0.97254901960784312" alpha="1" colorSpace="calibratedRGB"/>
|
||||
<constraints>
|
||||
<constraint firstItem="Kjj-O1-UsZ" firstAttribute="leading" secondItem="EL9-GA-lwo" secondAttribute="leading" id="6Ys-O9-EZy"/>
|
||||
<constraint firstItem="bFg-jh-JZB" firstAttribute="top" secondItem="Kjj-O1-UsZ" secondAttribute="top" id="MQy-0K-KQf"/>
|
||||
<constraint firstAttribute="trailing" secondItem="Kjj-O1-UsZ" secondAttribute="trailing" id="XkY-kj-afK"/>
|
||||
<constraint firstAttribute="bottom" secondItem="Kjj-O1-UsZ" secondAttribute="bottom" id="cdk-7X-2Pn"/>
|
||||
</constraints>
|
||||
<viewLayoutGuide key="safeArea" id="bFg-jh-JZB"/>
|
||||
</view>
|
||||
<extendedEdge key="edgesForExtendedLayout" bottom="YES"/>
|
||||
<connections>
|
||||
<outlet property="collectionView" destination="Kjj-O1-UsZ" id="iBb-J9-0Uc"/>
|
||||
</connections>
|
||||
</viewController>
|
||||
<placeholder placeholderIdentifier="IBFirstResponder" id="zK0-v6-7Wt" userLabel="First Responder" sceneMemberID="firstResponder"/>
|
||||
</objects>
|
||||
<point key="canvasLocation" x="-3199.1999999999998" y="-647.22638680659679"/>
|
||||
</scene>
|
||||
</scenes>
|
||||
</document>
|
||||
@@ -0,0 +1,319 @@
|
||||
// File created from ScreenTemplate
|
||||
// $ createScreen.sh toto EmojiPicker
|
||||
/*
|
||||
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 EmojiPickerViewController: UIViewController {
|
||||
|
||||
// MARK: - Constants
|
||||
|
||||
private enum CollectionViewLayout {
|
||||
static let sectionInsets = UIEdgeInsets(top: 10.0, left: 10.0, bottom: 10.0, right: 10.0)
|
||||
static let minimumInteritemSpacing: CGFloat = 6.0
|
||||
static let minimumLineSpacing: CGFloat = 2.0
|
||||
static let itemSize = CGSize(width: 50, height: 50)
|
||||
}
|
||||
|
||||
private static let sizingHeaderView = EmojiPickerHeaderView.loadFromNib()
|
||||
|
||||
// MARK: - Properties
|
||||
|
||||
// MARK: Outlets
|
||||
|
||||
@IBOutlet private weak var collectionView: UICollectionView!
|
||||
|
||||
// MARK: Private
|
||||
|
||||
private var viewModel: EmojiPickerViewModelType!
|
||||
private var theme: Theme!
|
||||
private var keyboardAvoider: KeyboardAvoider?
|
||||
private var errorPresenter: MXKErrorPresentation!
|
||||
private var activityPresenter: ActivityIndicatorPresenter!
|
||||
private var searchController: UISearchController?
|
||||
private var emojiCategories: [EmojiPickerCategoryViewData] = []
|
||||
|
||||
// MARK: - Setup
|
||||
|
||||
class func instantiate(with viewModel: EmojiPickerViewModelType) -> EmojiPickerViewController {
|
||||
let viewController = StoryboardScene.EmojiPickerViewController.initialScene.instantiate()
|
||||
viewController.viewModel = viewModel
|
||||
viewController.theme = ThemeService.shared().theme
|
||||
return viewController
|
||||
}
|
||||
|
||||
// MARK: - Life cycle
|
||||
|
||||
override func viewDidLoad() {
|
||||
super.viewDidLoad()
|
||||
|
||||
// Do any additional setup after loading the view.
|
||||
|
||||
self.title = VectorL10n.emojiPickerTitle
|
||||
|
||||
self.setupViews()
|
||||
self.keyboardAvoider = KeyboardAvoider(scrollViewContainerView: self.view, scrollView: self.collectionView)
|
||||
self.activityPresenter = ActivityIndicatorPresenter()
|
||||
self.errorPresenter = MXKErrorAlertPresentation()
|
||||
|
||||
self.registerThemeServiceDidChangeThemeNotification()
|
||||
self.update(theme: self.theme)
|
||||
|
||||
self.viewModel.viewDelegate = self
|
||||
self.viewModel.process(viewAction: .loadData)
|
||||
}
|
||||
|
||||
override func viewWillAppear(_ animated: Bool) {
|
||||
super.viewWillAppear(animated)
|
||||
|
||||
self.keyboardAvoider?.startAvoiding()
|
||||
|
||||
// Update theme here otherwise the UISearchBar search text color is not updated
|
||||
self.update(theme: self.theme)
|
||||
}
|
||||
|
||||
override func viewDidAppear(_ animated: Bool) {
|
||||
super.viewDidAppear(animated)
|
||||
|
||||
// Enable to hide search bar on scrolling after first time view appear
|
||||
if #available(iOS 11.0, *) {
|
||||
self.navigationItem.hidesSearchBarWhenScrolling = true
|
||||
}
|
||||
}
|
||||
|
||||
override func viewDidDisappear(_ animated: Bool) {
|
||||
super.viewDidDisappear(animated)
|
||||
|
||||
self.keyboardAvoider?.stopAvoiding()
|
||||
}
|
||||
|
||||
override var preferredStatusBarStyle: UIStatusBarStyle {
|
||||
return self.theme.statusBarStyle
|
||||
}
|
||||
|
||||
// MARK: - Private
|
||||
|
||||
private func update(theme: Theme) {
|
||||
self.theme = theme
|
||||
|
||||
self.view.backgroundColor = theme.headerBackgroundColor
|
||||
|
||||
if let navigationBar = self.navigationController?.navigationBar {
|
||||
theme.applyStyle(onNavigationBar: navigationBar)
|
||||
}
|
||||
|
||||
if let searchController = self.searchController {
|
||||
theme.applyStyle(onSearchBar: searchController.searchBar)
|
||||
}
|
||||
}
|
||||
|
||||
private func registerThemeServiceDidChangeThemeNotification() {
|
||||
NotificationCenter.default.addObserver(self, selector: #selector(themeDidChange), name: .themeServiceDidChangeTheme, object: nil)
|
||||
}
|
||||
|
||||
@objc private func themeDidChange() {
|
||||
self.update(theme: ThemeService.shared().theme)
|
||||
}
|
||||
|
||||
private func setupViews() {
|
||||
let cancelBarButtonItem = MXKBarButtonItem(title: VectorL10n.cancel, style: .plain) { [weak self] in
|
||||
self?.cancelButtonAction()
|
||||
}
|
||||
|
||||
self.navigationItem.rightBarButtonItem = cancelBarButtonItem
|
||||
|
||||
self.setupCollectionView()
|
||||
|
||||
if #available(iOS 11.0, *) {
|
||||
self.setupSearchController()
|
||||
}
|
||||
}
|
||||
|
||||
private func setupCollectionView() {
|
||||
self.collectionView.delegate = self
|
||||
self.collectionView.dataSource = self
|
||||
|
||||
self.collectionView.keyboardDismissMode = .interactive
|
||||
|
||||
if let collectionViewFlowLayout = self.collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
|
||||
collectionViewFlowLayout.minimumInteritemSpacing = CollectionViewLayout.minimumInteritemSpacing
|
||||
collectionViewFlowLayout.minimumLineSpacing = CollectionViewLayout.minimumLineSpacing
|
||||
collectionViewFlowLayout.itemSize = CollectionViewLayout.itemSize
|
||||
collectionViewFlowLayout.sectionInset = CollectionViewLayout.sectionInsets
|
||||
collectionViewFlowLayout.sectionHeadersPinToVisibleBounds = true // Enable sticky headers
|
||||
|
||||
// Avoid device notch in landascape (e.g. iPhone X)
|
||||
if #available(iOS 11.0, *) {
|
||||
collectionViewFlowLayout.sectionInsetReference = .fromSafeArea
|
||||
}
|
||||
}
|
||||
|
||||
self.collectionView.register(supplementaryViewType: EmojiPickerHeaderView.self, ofKind: UICollectionView.elementKindSectionHeader)
|
||||
self.collectionView.register(cellType: EmojiPickerViewCell.self)
|
||||
}
|
||||
|
||||
private func setupSearchController() {
|
||||
let searchController = UISearchController(searchResultsController: nil)
|
||||
searchController.dimsBackgroundDuringPresentation = false
|
||||
searchController.searchResultsUpdater = self
|
||||
searchController.searchBar.placeholder = VectorL10n.searchDefaultPlaceholder
|
||||
searchController.hidesNavigationBarDuringPresentation = false
|
||||
|
||||
if #available(iOS 11.0, *) {
|
||||
self.navigationItem.searchController = searchController
|
||||
// Make the search bar visible on first view appearance
|
||||
self.navigationItem.hidesSearchBarWhenScrolling = false
|
||||
}
|
||||
|
||||
self.definesPresentationContext = true
|
||||
|
||||
self.searchController = searchController
|
||||
}
|
||||
|
||||
private func render(viewState: EmojiPickerViewState) {
|
||||
switch viewState {
|
||||
case .loading:
|
||||
self.renderLoading()
|
||||
case .loaded(emojiCategories: let emojiCategories):
|
||||
self.renderLoaded(emojiCategories: emojiCategories)
|
||||
case .error(let error):
|
||||
self.render(error: error)
|
||||
}
|
||||
}
|
||||
|
||||
private func renderLoading() {
|
||||
self.activityPresenter.presentActivityIndicator(on: self.view, animated: true)
|
||||
}
|
||||
|
||||
private func renderLoaded(emojiCategories: [EmojiPickerCategoryViewData]) {
|
||||
self.activityPresenter.removeCurrentActivityIndicator(animated: true)
|
||||
self.update(emojiCategories: emojiCategories)
|
||||
}
|
||||
|
||||
private func render(error: Error) {
|
||||
self.activityPresenter.removeCurrentActivityIndicator(animated: true)
|
||||
self.errorPresenter.presentError(from: self, forError: error, animated: true, handler: nil)
|
||||
}
|
||||
|
||||
private func update(emojiCategories: [EmojiPickerCategoryViewData]) {
|
||||
self.emojiCategories = emojiCategories
|
||||
self.collectionView.reloadData()
|
||||
}
|
||||
|
||||
private func emojiItemViewData(at indexPath: IndexPath) -> EmojiPickerItemViewData {
|
||||
return self.emojiCategories[indexPath.section].emojiViewDataList[indexPath.row]
|
||||
}
|
||||
|
||||
private func emojiCategoryViewData(at section: Int) -> EmojiPickerCategoryViewData? {
|
||||
return self.emojiCategories[section]
|
||||
}
|
||||
|
||||
private func headerViewSize(for title: String) -> CGSize {
|
||||
|
||||
let sizingHeaderView = EmojiPickerViewController.sizingHeaderView
|
||||
|
||||
sizingHeaderView.fill(with: title)
|
||||
sizingHeaderView.setNeedsLayout()
|
||||
sizingHeaderView.layoutIfNeeded()
|
||||
|
||||
var fittingSize = UIView.layoutFittingCompressedSize
|
||||
fittingSize.width = self.collectionView.bounds.size.width
|
||||
|
||||
return sizingHeaderView.systemLayoutSizeFitting(fittingSize)
|
||||
}
|
||||
|
||||
// MARK: - Actions
|
||||
|
||||
private func cancelButtonAction() {
|
||||
self.viewModel.process(viewAction: .cancel)
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - UICollectionViewDataSource
|
||||
extension EmojiPickerViewController: UICollectionViewDataSource {
|
||||
func numberOfSections(in collectionView: UICollectionView) -> Int {
|
||||
return self.emojiCategories.count
|
||||
}
|
||||
|
||||
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
|
||||
return self.emojiCategories[section].emojiViewDataList.count
|
||||
}
|
||||
|
||||
func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
|
||||
let emojiPickerCategory = self.emojiCategories[indexPath.section]
|
||||
|
||||
let headerView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, for: indexPath) as EmojiPickerHeaderView
|
||||
headerView.update(theme: self.theme)
|
||||
headerView.fill(with: emojiPickerCategory.name)
|
||||
|
||||
return headerView
|
||||
}
|
||||
|
||||
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
|
||||
let cell: EmojiPickerViewCell = collectionView.dequeueReusableCell(for: indexPath)
|
||||
|
||||
if let theme = self.theme {
|
||||
cell.update(theme: theme)
|
||||
}
|
||||
|
||||
let viewData = self.emojiItemViewData(at: indexPath)
|
||||
cell.fill(viewData: viewData)
|
||||
|
||||
return cell
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - UICollectionViewDelegate
|
||||
extension EmojiPickerViewController: UICollectionViewDelegate {
|
||||
|
||||
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
|
||||
let emojiItemViewData = self.emojiItemViewData(at: indexPath)
|
||||
self.viewModel.process(viewAction: .tap(emojiItemViewData: emojiItemViewData))
|
||||
}
|
||||
|
||||
func collectionView(_ collectionView: UICollectionView, willDisplaySupplementaryView view: UICollectionReusableView, forElementKind elementKind: String, at indexPath: IndexPath) {
|
||||
// Fix UICollectionView scroll bar appears underneath header view
|
||||
view.layer.zPosition = 0.0
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - UICollectionViewDelegateFlowLayout
|
||||
extension EmojiPickerViewController: UICollectionViewDelegateFlowLayout {
|
||||
|
||||
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
|
||||
let emojiCategory = self.emojiCategories[section]
|
||||
let headerSize = self.headerViewSize(for: emojiCategory.name)
|
||||
return headerSize
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - EmojiPickerViewModelViewDelegate
|
||||
extension EmojiPickerViewController: EmojiPickerViewModelViewDelegate {
|
||||
|
||||
func emojiPickerViewModel(_ viewModel: EmojiPickerViewModelType, didUpdateViewState viewSate: EmojiPickerViewState) {
|
||||
self.render(viewState: viewSate)
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - UISearchResultsUpdating
|
||||
extension EmojiPickerViewController: UISearchResultsUpdating {
|
||||
func updateSearchResults(for searchController: UISearchController) {
|
||||
let searchText = searchController.searchBar.text
|
||||
self.viewModel.process(viewAction: .search(text: searchText))
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user