1
0
Fork 0
mirror of https://git.jami.net/savoirfairelinux/jami-client-qt.git synced 2025-09-10 12:03:18 +02:00

accessibility: fix the account creation wizard

Add support for screen readers and keyboard navigation for the account
creation.

GitLab: #2049
Change-Id: Ie91d7222388a9fb627d5a981ba9e7d8afdebcd55
This commit is contained in:
pmagnier-slimani 2025-05-27 16:28:30 -04:00 committed by Page Magnier-Slimani
parent 136dea011f
commit e0f939318e
12 changed files with 85 additions and 13 deletions

View file

@ -80,6 +80,8 @@ Popup {
JamiPushButton { QWKSetParentHitTestVisible {}
id: closeButton
Accessible.role: Accessible.Button
Accessible.name: JamiStrings.close
visible: closeButtonVisible

View file

@ -28,6 +28,10 @@ Control {
property string title: ""
property string description: ""
Accessible.role: Accessible.StaticText
Accessible.name: title
Accessible.description: description
width: 190
height: infos.implicitHeight

View file

@ -86,6 +86,7 @@ BaseModalDialog {
JamiPushButton {
id: takePhotoButton
Accessible.name: objectName
objectName: "takePhotoButton"
@ -136,6 +137,8 @@ BaseModalDialog {
height: buttonSize
width: buttonSize
Accessible.name: objectName
normalColor: "transparent"
source: JamiResources.add_photo_alternate_black_24dp_svg
imageColor: hovered ? JamiTheme.textColor : JamiTheme.buttonTintedGreyHovered

View file

@ -25,4 +25,6 @@ PushButton {
normalColor: JamiTheme.chatviewBgColor
imageColor: hovered ? JamiTheme.chatviewButtonColor : JamiTheme.chatViewFooterImgColor
Accessible.role: Accessible.Button
Accessible.description: toolTipText
}

View file

@ -220,7 +220,6 @@ Popup {
id: cancelBtn
objectName: "cancelBtn"
z: 1
Layout.alignment: Qt.AlignRight | Qt.AlignTop
Layout.preferredHeight: 20
Layout.preferredWidth: 20
@ -323,6 +322,9 @@ Popup {
Layout.alignment: Qt.AlignCenter
preferredSize: btnSize
Accessible.role: Accessible.Button
Accessible.name: toolTipText
source: JamiResources.stop_rectangle_24dp_svg
imageColor: JamiTheme.whiteColor

View file

@ -18,7 +18,6 @@ import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import net.jami.Adapters 1.1
import net.jami.Constants 1.1
import net.jami.Enums 1.1
@ -39,6 +38,10 @@ ListSelectionView {
onPresented: LRCInstance.deselectConversation()
leftPaneItem: viewCoordinator.getView("SidePanel", true)
Accessible.role: Accessible.Pane
Accessible.name: title
Accessible.description: JamiStrings.description
property variant uiCustomization: CurrentAccount.uiCustomization
onUiCustomizationChanged: {
@ -277,6 +280,9 @@ ListSelectionView {
preferredWidth: textSize.width + 2 * JamiTheme.preferredMarginSize
text: JamiStrings.aboutJami
Accessible.role: Accessible.Button
Accessible.name: text
onClicked: viewCoordinator.presentDialog(appWindow, "mainview/components/AboutPopUp.qml")
}

View file

@ -930,4 +930,9 @@ Item {
property string qrCodeExplanation: qsTr("Display your QR code to allow other users to scan it and add you as a contact")
property string accountList: qsTr("Account list")
property string accountListDescription: qsTr("Use arrows to switch between available account")
property string languageComboBoxExplanation: qsTr("Select the user interface language")
property string backButtonExplanation: qsTr("Go back to the previous page")
property string adviceBox: qsTr("Advice Box")
property string backButton: qsTr("Back button")
property string adviceBoxExplanation: qsTr("Open the advice popup that contains information about Jami")
}

View file

@ -135,10 +135,16 @@ Rectangle {
id: usernameEdit
accountId: ""
Accessible.role: Accessible.EditableText
Accessible.name: invalidLabel.text
icon: PushButton {
id: infoBox
z: 1
Accessible.role: Accessible.StaticText
Accessible.name: textInfo.text
normalColor: "transparent"
imageColor: infoBox.checked ? JamiTheme.inviteHoverColor : JamiTheme.buttonTintedBlue
source: JamiResources.i_informations_black_24dp_svg
@ -273,6 +279,7 @@ Rectangle {
font.capitalization: Font.AllUppercase
text: joinJamiButton.text
}
Accessible.description: invalidLabel.text
objectName: "joinJamiButton"
@ -371,6 +378,10 @@ Rectangle {
imageContainerWidth: 20
source: JamiResources.ic_arrow_back_24dp_svg
Accessible.role: Accessible.Button
Accessible.name: JamiStrings.backButton
Accessible.description: JamiStrings.backButtonExplanation
anchors.left: parent.left
anchors.top: parent.top
anchors.margins: JamiTheme.wizardViewPageBackButtonMargins
@ -397,6 +408,10 @@ Rectangle {
preferredSize: 36
checkedImageColor: JamiTheme.chatviewButtonColor
Accessible.role: Accessible.Button
Accessible.name: JamiStrings.adviceBox
Accessible.description: JamiStrings.adviceBoxExplanation
anchors.right: parent.right
anchors.top: parent.top
anchors.margins: JamiTheme.wizardViewPageBackButtonMargins

View file

@ -86,6 +86,7 @@ BaseModalDialog {
Layout.topMargin: 20
KeyNavigation.up: passwordEdit
KeyNavigation.down: KeyNavigation.up
Accessible.description: JamiStrings.encryptDescription
onDynamicTextChanged: {
button1.enabled = passwordEdit.dynamicText === passwordConfirmEdit.dynamicText && passwordEdit.dynamicText.length !== 0

View file

@ -38,6 +38,9 @@ Rectangle {
signal showThisPage
color: JamiTheme.secondaryBackgroundColor
Accessible.role: Accessible.Pane
Accessible.name: joinJami.text
Accessible.description: JamiStrings.customizeAccountDescription
Connections {
target: WizardViewStepModel
@ -132,6 +135,9 @@ Rectangle {
KeyNavigation.tab: displayNameLineEdit
KeyNavigation.right: KeyNavigation.tab
KeyNavigation.down: saveProfileButton
Accessible.role: Accessible.Button
Accessible.name: JamiStrings.selectImage
Accessible.description: JamiStrings.customizeOptional
anchors.centerIn: parent
@ -280,6 +286,10 @@ Rectangle {
objectName: "createAccountPageBackButton"
Accessible.role: Accessible.Button
Accessible.name: JamiStrings.backButton
Accessible.description: JamiStrings.backButtonExplanation
preferredSize: 36
imageContainerWidth: 20
source: JamiResources.ic_arrow_back_24dp_svg

View file

@ -49,15 +49,19 @@ BaseModalDialog {
root.close();
}
button1.onClicked: root.close()
button2.Accessible.name: JamiStrings.chooseAUsername
button2.Accessible.description: JamiStrings.joinJamiNoPassword
popupContent: Text {
width: root.width - 2 * root.popupMargins
font.pixelSize: JamiTheme.popuptextSize
Accessible.role: Accessible.Dialog
Accessible.name: title
Accessible.description: JamiStrings.joinJamiNoPassword
width: root.width - 2 * root.popupMargins
font.pixelSize: JamiTheme.popuptextSize
lineHeight: JamiTheme.wizardViewTextLineHeight
wrapMode: Text.WordWrap
lineHeight: JamiTheme.wizardViewTextLineHeight
wrapMode: Text.WordWrap
color: JamiTheme.textColor
text: JamiStrings.joinJamiNoPassword
}
color: JamiTheme.textColor
text: JamiStrings.joinJamiNoPassword
}
}

View file

@ -54,6 +54,9 @@ Rectangle {
if (visible)
forceActiveFocus();
}
Accessible.role: Accessible.Pane
Accessible.name: introduction.text
Accessible.description: JamiStrings.description
KeyNavigation.tab: newAccountButton
KeyNavigation.up: newAccountButton
@ -71,6 +74,8 @@ Rectangle {
width: 800
Item {
Accessible.name: introduction.text
Accessible.description: JamiStrings.description
Layout.alignment: Qt.AlignCenter | Qt.AlignTop
Layout.preferredWidth: JamiTheme.welcomeLogoWidth
@ -373,8 +378,9 @@ Rectangle {
fontSize: JamiTheme.wizardViewAboutJamiFontPixelSize
KeyNavigation.tab: backButton.visible ? backButton : newAccountButton
KeyNavigation.up: connectAccountManagerButton
KeyNavigation.up: showAdvanced ? newSIPAccountButton : showAdvancedButton
KeyNavigation.down: KeyNavigation.tab
KeyNavigation.backtab: KeyNavigation.up
text: JamiStrings.aboutJami
@ -382,8 +388,10 @@ Rectangle {
}
}
JamiPushButton { QWKSetParentHitTestVisible {}
JamiPushButton {
id: backButton
QWKSetParentHitTestVisible {
}
objectName: "welcomePageBackButton"
@ -404,6 +412,9 @@ Rectangle {
}
visible: UtilsAdapter.getAccountListSize()
Accessible.role: Accessible.Button
Accessible.name: JamiStrings.backButton
Accessible.description: JamiStrings.backButtonExplanation
KeyNavigation.tab: newAccountButton
KeyNavigation.up: showAdvanced ? newSIPAccountButton : showAdvancedButton
@ -415,12 +426,19 @@ Rectangle {
SettingsComboBox {
id: langComboBoxSetting
// This component is not yet accessible via keyboard navigation because our comboboxes
// are currently broken from an accessibility standpoint. The fix would be to
// refactor to use the base Qt ComboBox.
height: JamiTheme.preferredFieldHeight + 20
anchors.right: parent.right
anchors.bottom: parent.bottom
anchors.margins: JamiTheme.wizardViewPageBackButtonMargins
Accessible.role: Accessible.ComboBox
Accessible.name: JamiStrings.language
Accessible.description: JamiStrings.languageComboBoxExplanation
labelText: JamiStrings.language
labelText: JamiStrings.userInterfaceLanguage
tipText: JamiStrings.language
comboModel: ListModel {
id: langModel