fix(HoldingsDropdown): Add basic focus management and keyboard support

Closing #9967

When Holdings dropdown is open, activate focus to searcher in assets and collectibles. Changes focus to ENS input in case ENS tab is active.
In Holdings dropdown, when ENS tab is active and Add button is enabled, pressing enter key should behave same than clicking on the button itself.
In Holdings dropdown, when one asset or collectible has been selected, activate focus in the amount input, then when Add button is enabled, pressing enter key should behave same than clicking on the button itself.
This commit is contained in:
Alex Jbanca 2023-03-23 11:54:16 +02:00 committed by Alex Jbanca
parent f18ceff600
commit ee5e72b088
5 changed files with 45 additions and 0 deletions

View File

@ -55,12 +55,23 @@ ColumnLayout {
&& !alreadyUsed
}
}
onVisibleChanged: {
if(visible)
forceActiveFocus()
}
onKeyPressed: {
if(!addOrUpdateButton.enabled) return
if(event.key === Qt.Key_Enter || event.key === Qt.Key_Return)
addOrUpdateButton.clicked()
}
Component.onCompleted: {
if (text) {
input.dirty = true
validate()
}
forceActiveFocus()
}
}

View File

@ -51,6 +51,11 @@ Item {
? d.depth2_ThumbnailsState : d.depth2_ListState
}
onFocusChanged: {
if(focus)
searcher.forceActiveFocus()
}
Settings {
property alias useThumbnailsOnDepth2: d.useThumbnailsOnDepth2
}
@ -132,6 +137,8 @@ Item {
}
}
onStateChanged: forceActiveFocus()
state: d.depth1_ListState
states: [
State {
@ -342,6 +349,14 @@ Item {
when: d.currentItemName !== ""
value: qsTr("Search %1").arg(d.currentItemName)
}
onVisibleChanged: {
if(visible)
forceActiveFocus()
}
Component.onCompleted: {
if(visible)
forceActiveFocus()
}
}
TokenItem {

View File

@ -244,6 +244,7 @@ StatusDropdown {
checkedKeys: root.usedTokens.map(entry => entry.key)
type: d.extendedDropdownType
onTypeChanged: forceActiveFocus()
onItemClicked: {
d.assetAmountText = ""

View File

@ -65,6 +65,20 @@ ColumnLayout {
customHeight: d.defaultHeight
allowDecimals: true
keepHeight: true
onKeyPressed: {
if(!addOrUpdateButton.enabled) return
if(event.key === Qt.Key_Enter || event.key === Qt.Key_Return)
addOrUpdateButton.clicked()
}
onVisibleChanged: {
if(visible)
forceActiveFocus()
}
Component.onCompleted: {
if(visible)
forceActiveFocus()
}
}
StatusButton {

View File

@ -60,6 +60,10 @@ Item {
validationError = ""
}
onFocusChanged: {
if(focus) inputField.forceActiveFocus()
}
StyledText {
id: inputLabel
text: inputBox.label