Matrix/element-ios
Matrix/element-ios
1
0
Fork 0
mirror of https://github.com/vector-im/element-ios.git synced 2024-09-28 15:22:39 +00:00
Code Issues Projects Releases Packages Wiki Activity

Update UX/UI implementation

Browse source
This commit is contained in:
Nicolas Mauri 2023-02-21 17:45:52 +01:00
parent d4a0f8cb21
commit 3cef74378d
4 changed files with 58 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
Riot/Assets/en.lproj/Vector.strings
View file

@ -1529,6 +1529,9 @@ Tap the + to start adding people.";
"device_verification_cancelled" = "The other party cancelled the verification."; "device_verification_cancelled" = "The other party cancelled the verification.";
"device_verification_cancelled_by_me" = "The verification has been cancelled. Reason: %@"; "device_verification_cancelled_by_me" = "The verification has been cancelled. Reason: %@";
"device_verification_error_cannot_load_device" = "Cannot load session information."; "device_verification_error_cannot_load_device" = "Cannot load session information.";
"device_verification_scan_qr_code_title" = "Scan QR code";
"device_verification_scan_qr_code_information" = "Point your camera at the QR code displayed on your other device to verify this session";
// MARK: Incoming // MARK: Incoming
"device_verification_incoming_title" = "Incoming Verification Request"; "device_verification_incoming_title" = "Incoming Verification Request";

8
Riot/Generated/Strings.swift
View file

@ -1851,6 +1851,14 @@ public class VectorL10n: NSObject {
public static var deviceVerificationIncomingTitle: String { public static var deviceVerificationIncomingTitle: String {
return VectorL10n.tr("Vector", "device_verification_incoming_title") return VectorL10n.tr("Vector", "device_verification_incoming_title")
} }
/// Point your camera at the QR code displayed on your other device to verify this session
public static var deviceVerificationScanQrCodeInformation: String {
return VectorL10n.tr("Vector", "device_verification_scan_qr_code_information")
}
/// Scan QR code
public static var deviceVerificationScanQrCodeTitle: String {
return VectorL10n.tr("Vector", "device_verification_scan_qr_code_title")
}
/// Compare the unique emoji, ensuring they appear in the same order. /// Compare the unique emoji, ensuring they appear in the same order.
public static var deviceVerificationSecurityAdviceEmoji: String { public static var deviceVerificationSecurityAdviceEmoji: String {
return VectorL10n.tr("Vector", "device_verification_security_advice_emoji") return VectorL10n.tr("Vector", "device_verification_security_advice_emoji")

43
Riot/Modules/KeyVerification/Common/Verify/Scanning/KeyVerificationVerifyByScanningViewController.storyboard
View file

@ -20,7 +20,7 @@
<rect key="frame" x="0.0" y="0.0" width="375" height="667"/> <rect key="frame" x="0.0" y="0.0" width="375" height="667"/>
<subviews> <subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="fyB-h5-5v2"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="fyB-h5-5v2">
<rect key="frame" x="0.0" y="0.0" width="375" height="806"/> <rect key="frame" x="0.0" y="0.0" width="375" height="443"/>
<subviews> <subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="D7P-C8-cqw"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="D7P-C8-cqw">
<rect key="frame" x="0.0" y="0.0" width="375" height="113"/> <rect key="frame" x="0.0" y="0.0" width="375" height="113"/>
@ -61,6 +61,25 @@
<constraint firstAttribute="trailing" secondItem="1PP-lU-Ags" secondAttribute="trailing" constant="13" id="xNP-5O-bnD"/> <constraint firstAttribute="trailing" secondItem="1PP-lU-Ags" secondAttribute="trailing" constant="13" id="xNP-5O-bnD"/>
</constraints> </constraints>
</view> </view>
<view hidden="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="JWN-4v-RUi">
<rect key="frame" x="0.0" y="50" width="375" height="20"/>
<subviews>
<label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="253" verticalCompressionResistancePriority="751" text="Scan QR Code" textAlignment="center" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="4Vv-12-J2A">
<rect key="frame" x="20" y="20" width="335" height="0.0"/>
<fontDescription key="fontDescription" type="boldSystem" pointSize="28"/>
<nil key="textColor"/>
<nil key="highlightedColor"/>
</label>
</subviews>
<color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstItem="4Vv-12-J2A" firstAttribute="leading" secondItem="JWN-4v-RUi" secondAttribute="leading" constant="20" id="4Bf-hJ-6wD"/>
<constraint firstAttribute="height" priority="750" id="Elw-li-szT"/>
<constraint firstAttribute="bottom" secondItem="4Vv-12-J2A" secondAttribute="bottom" id="j1X-c8-tCi"/>
<constraint firstAttribute="trailing" secondItem="4Vv-12-J2A" secondAttribute="trailing" constant="20" id="sAb-CX-1dL"/>
<constraint firstItem="4Vv-12-J2A" firstAttribute="top" secondItem="JWN-4v-RUi" secondAttribute="top" constant="20" id="wPc-io-mBg"/>
</constraints>
</view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="SLA-sa-fBw"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="SLA-sa-fBw">
<rect key="frame" x="0.0" y="50" width="375" height="63"/> <rect key="frame" x="0.0" y="50" width="375" height="63"/>
<subviews> <subviews>
@ -97,7 +116,7 @@
</constraints> </constraints>
</view> </view>
<stackView opaque="NO" contentMode="scaleToFill" axis="vertical" translatesAutoresizingMaskIntoConstraints="NO" id="bQd-8A-8hf"> <stackView opaque="NO" contentMode="scaleToFill" axis="vertical" translatesAutoresizingMaskIntoConstraints="NO" id="bQd-8A-8hf">
<rect key="frame" x="0.0" y="113" width="375" height="693"/> <rect key="frame" x="0.0" y="113" width="375" height="330"/>
<subviews> <subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="vrz-UO-PDk"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="vrz-UO-PDk">
<rect key="frame" x="0.0" y="0.0" width="375" height="200"/> <rect key="frame" x="0.0" y="0.0" width="375" height="200"/>
@ -117,11 +136,11 @@
<constraint firstItem="NFT-6Y-5rt" firstAttribute="top" secondItem="vrz-UO-PDk" secondAttribute="top" id="Sfi-ob-xej"/> <constraint firstItem="NFT-6Y-5rt" firstAttribute="top" secondItem="vrz-UO-PDk" secondAttribute="top" id="Sfi-ob-xej"/>
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="NG7-qS-njl"> <view hidden="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="NG7-qS-njl">
<rect key="frame" x="0.0" y="200" width="375" height="363"/> <rect key="frame" x="0.0" y="200" width="375" height="28"/>
<subviews> <subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="yMt-yE-2HC"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="yMt-yE-2HC">
<rect key="frame" x="18" y="6" width="40" height="40"/> <rect key="frame" x="185.5" y="6" width="40" height="40"/>
<color key="backgroundColor" red="0.050980392156862744" green="0.74117647058823533" blue="0.54509803921568623" alpha="1" colorSpace="calibratedRGB"/> <color key="backgroundColor" red="0.050980392156862744" green="0.74117647058823533" blue="0.54509803921568623" alpha="1" colorSpace="calibratedRGB"/>
<constraints> <constraints>
<constraint firstAttribute="width" constant="40" id="aE1-Fg-abK"/> <constraint firstAttribute="width" constant="40" id="aE1-Fg-abK"/>
@ -129,28 +148,28 @@
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="IUM-L7-fqo"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="IUM-L7-fqo">
<rect key="frame" x="317" y="6" width="40" height="40"/> <rect key="frame" x="149.5" y="6" width="40" height="40"/>
<color key="backgroundColor" red="0.050980392159999999" green="0.74117647060000003" blue="0.5450980392" alpha="1" colorSpace="calibratedRGB"/> <color key="backgroundColor" red="0.050980392159999999" green="0.74117647060000003" blue="0.5450980392" alpha="1" colorSpace="calibratedRGB"/>
<constraints> <constraints>
<constraint firstAttribute="width" secondItem="IUM-L7-fqo" secondAttribute="height" id="i5Y-Jl-e2K"/> <constraint firstAttribute="width" secondItem="IUM-L7-fqo" secondAttribute="height" id="i5Y-Jl-e2K"/>
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Xt1-wB-5jN"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="Xt1-wB-5jN">
<rect key="frame" x="18" y="305" width="40" height="40"/> <rect key="frame" x="185.5" y="-30" width="40" height="40"/>
<color key="backgroundColor" red="0.050980392159999999" green="0.74117647060000003" blue="0.5450980392" alpha="1" colorSpace="calibratedRGB"/> <color key="backgroundColor" red="0.050980392159999999" green="0.74117647060000003" blue="0.5450980392" alpha="1" colorSpace="calibratedRGB"/>
<constraints> <constraints>
<constraint firstAttribute="width" secondItem="Xt1-wB-5jN" secondAttribute="height" id="ChW-li-1yx"/> <constraint firstAttribute="width" secondItem="Xt1-wB-5jN" secondAttribute="height" id="ChW-li-1yx"/>
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="niQ-mw-RBU"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="niQ-mw-RBU">
<rect key="frame" x="317" y="305" width="40" height="40"/> <rect key="frame" x="149.5" y="-30" width="40" height="40"/>
<color key="backgroundColor" red="0.050980392159999999" green="0.74117647060000003" blue="0.5450980392" alpha="1" colorSpace="calibratedRGB"/> <color key="backgroundColor" red="0.050980392159999999" green="0.74117647060000003" blue="0.5450980392" alpha="1" colorSpace="calibratedRGB"/>
<constraints> <constraints>
<constraint firstAttribute="width" secondItem="niQ-mw-RBU" secondAttribute="height" id="qac-f3-yEf"/> <constraint firstAttribute="width" secondItem="niQ-mw-RBU" secondAttribute="height" id="qac-f3-yEf"/>
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="f4V-Zd-iYY"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="f4V-Zd-iYY">
<rect key="frame" x="20" y="8" width="335" height="335"/> <rect key="frame" x="187.5" y="8" width="0.0" height="0.0"/>
<color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/> <color key="backgroundColor" white="0.0" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints> <constraints>
<constraint firstAttribute="width" secondItem="f4V-Zd-iYY" secondAttribute="height" id="p2W-BD-0pf"/> <constraint firstAttribute="width" secondItem="f4V-Zd-iYY" secondAttribute="height" id="p2W-BD-0pf"/>
@ -184,7 +203,7 @@
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="s4G-bW-EGe"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="s4G-bW-EGe">
<rect key="frame" x="0.0" y="563" width="375" height="55"/> <rect key="frame" x="0.0" y="200" width="375" height="55"/>
<subviews> <subviews>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="a4h-x5-COe"> <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="a4h-x5-COe">
<rect key="frame" x="20" y="0.0" width="335" height="50"/> <rect key="frame" x="20" y="0.0" width="335" height="50"/>
@ -211,7 +230,7 @@
</constraints> </constraints>
</view> </view>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="n73-GU-j8x"> <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="n73-GU-j8x">
<rect key="frame" x="0.0" y="618" width="375" height="75"/> <rect key="frame" x="0.0" y="255" width="375" height="75"/>
<subviews> <subviews>
<button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="bRZ-4Z-DEJ"> <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="bRZ-4Z-DEJ">
<rect key="frame" x="20" y="5" width="335" height="50"/> <rect key="frame" x="20" y="5" width="335" height="50"/>
@ -280,6 +299,8 @@
<outlet property="qrCodeScannerContainerView" destination="NG7-qS-njl" id="xmO-wT-3X5"/> <outlet property="qrCodeScannerContainerView" destination="NG7-qS-njl" id="xmO-wT-3X5"/>
<outlet property="scanButtonContainerView" destination="s4G-bW-EGe" id="TL4-jJ-EDC"/> <outlet property="scanButtonContainerView" destination="s4G-bW-EGe" id="TL4-jJ-EDC"/>
<outlet property="scanCodeButton" destination="a4h-x5-COe" id="8Cl-iJ-be8"/> <outlet property="scanCodeButton" destination="a4h-x5-COe" id="8Cl-iJ-be8"/>
<outlet property="scanTitleLabel" destination="4Vv-12-J2A" id="C9X-QH-zC8"/>
<outlet property="scanTitleView" destination="JWN-4v-RUi" id="7jz-CL-Zf1"/>
<outlet property="titleLabel" destination="VsP-5V-z35" id="t5i-0x-a7m"/> <outlet property="titleLabel" destination="VsP-5V-z35" id="t5i-0x-a7m"/>
<outlet property="titleView" destination="J1F-ba-sZ7" id="zVT-Mg-8di"/> <outlet property="titleView" destination="J1F-ba-sZ7" id="zVT-Mg-8di"/>
</connections> </connections>

25
Riot/Modules/KeyVerification/Common/Verify/Scanning/KeyVerificationVerifyByScanningViewController.swift
View file

@ -36,6 +36,9 @@ final class KeyVerificationVerifyByScanningViewController: UIViewController {
@IBOutlet private weak var titleLabel: UILabel! @IBOutlet private weak var titleLabel: UILabel!
@IBOutlet private weak var informationLabel: UILabel! @IBOutlet private weak var informationLabel: UILabel!
@IBOutlet private weak var scanTitleView: UIView!
@IBOutlet private weak var scanTitleLabel: UILabel!
@IBOutlet private weak var codeImageView: UIImageView! @IBOutlet private weak var codeImageView: UIImageView!
@IBOutlet private weak var scanCodeButton: UIButton! @IBOutlet private weak var scanCodeButton: UIButton!
@ -201,17 +204,24 @@ final class KeyVerificationVerifyByScanningViewController: UIViewController {
private func renderLoadedWithoutQRCodeData(viewData: KeyVerificationVerifyByScanningViewData) { private func renderLoadedWithoutQRCodeData(viewData: KeyVerificationVerifyByScanningViewData) {
self.activityPresenter.removeCurrentActivityIndicator(animated: true) self.activityPresenter.removeCurrentActivityIndicator(animated: true)
self.title = viewData.verificationKind.verificationTitle // We don't have a QR code to display
self.titleLabel.text = VectorL10n.authenticationQrLoginStartTitle
self.qrCodeContainerView.isHidden = true self.qrCodeContainerView.isHidden = true
// We will display a QR code scanner view, so no need to display the scan button
self.scanButtonContainerView.isHidden = true self.scanButtonContainerView.isHidden = true
if viewData.showScanAction == false { if viewData.showScanAction == false {
self.title = viewData.verificationKind.verificationTitle
self.titleLabel.text = viewData.verificationKind.verificationTitle
// Update the copy if QR code scanning is not possible at all // Update the copy if QR code scanning is not possible at all
self.informationLabel.text = VectorL10n.keyVerificationVerifyQrCodeEmojiInformation self.informationLabel.text = VectorL10n.keyVerificationVerifyQrCodeEmojiInformation
self.cannotScanButton.setTitle(VectorL10n.keyVerificationVerifyQrCodeStartEmojiAction, for: .normal) self.cannotScanButton.setTitle(VectorL10n.keyVerificationVerifyQrCodeStartEmojiAction, for: .normal)
} else { } else {
self.informationLabel.text = VectorL10n.authenticationQrLoginStartSubtitle // For this case, we don't want a navtitle
self.title = nil
self.titleView.isHidden = true
self.scanTitleLabel.text = VectorL10n.deviceVerificationScanQrCodeTitle
self.scanTitleView.isHidden = false
self.informationLabel.text = VectorL10n.deviceVerificationScanQrCodeInformation
addQRCodeReaderView() addQRCodeReaderView()
} }
@ -219,10 +229,7 @@ final class KeyVerificationVerifyByScanningViewController: UIViewController {
private func renderLoaded(viewData: KeyVerificationVerifyByScanningViewData) { private func renderLoaded(viewData: KeyVerificationVerifyByScanningViewData) {
self.activityPresenter.removeCurrentActivityIndicator(animated: true) self.activityPresenter.removeCurrentActivityIndicator(animated: true)
self.qrCodeContainerView.isHidden = false
self.scanButtonContainerView.isHidden = false
let hideQRCodeImage: Bool let hideQRCodeImage: Bool
if let qrCodePayloadData = viewData.qrCodeData { if let qrCodePayloadData = viewData.qrCodeData {
@ -256,8 +263,6 @@ final class KeyVerificationVerifyByScanningViewController: UIViewController {
self.scanCodeButton.isHidden = false self.scanCodeButton.isHidden = false
self.informationLabel.text = informationText self.informationLabel.text = informationText
} }
removeQRCodeReaderView()
} }
private func render(error: Error) { private func render(error: Error) {