Simplify startup and improve its animation

- Remove Python.loadingAccounts/willLoadAccounts
- Fix HPage SwipeView bug that caused its inner SidePane to steal focus

- Use overshoot for animation
- Get rid of sidepane flickering
- Set default HNumberAnimation easing.type to OutQuad, specify InOutQuad
  for HCheckBox
This commit is contained in:
miruka 2019-08-17 13:35:43 -04:00
parent 1ab79347e9
commit 72b5954ce3
8 changed files with 39 additions and 40 deletions

View File

@ -2,7 +2,6 @@
- `^property type name$`
- Use [Animators](https://doc.qt.io/qt-5/qml-qtquick-animator.html)
- Choose a better default easing type for animations
- Use overshoot for the scale login thing
- Sendbox
- HButton
- Control: hovered, visualFocus, enaled

View File

@ -30,7 +30,12 @@ CheckBox {
visible: scale > 0
scale: box.checked ? 1 : 0
Behavior on scale { HNumberAnimation { overshoot: 4 } }
Behavior on scale {
HNumberAnimation {
overshoot: 4
easing.type: Easing.InOutBack
}
}
}
}

View File

@ -1,10 +1,10 @@
import QtQuick 2.12
NumberAnimation {
property real factor: Math.max(overshoot / 1.75, 1.0)
property real factor: 1.0
property real overshoot: 1.0
duration: theme.animationDuration * factor
easing.type: overshoot > 1 ? Easing.InOutBack : Easing.Linear
duration: theme.animationDuration * Math.max(overshoot / 1.7, 1.0) * factor
easing.type: overshoot > 1 ? Easing.OutBack : Easing.Linear
easing.overshoot: overshoot
}

View File

@ -18,12 +18,13 @@ SwipeView {
Math.min(theme.spacing * width / 400, theme.spacing)
id: swipeView
currentIndex: 1
clip: true
interactive: sidePane.reduce
currentIndex: 1
SidePane {
implicitWidth: swipeView.width
animateWidth: false // Without this, the SidePane gets auto-focused
collapse: false
reduce: false
visible: swipeView.interactive

View File

@ -7,11 +7,9 @@ Python {
id: py
property bool ready: false
property bool startupAnyAccountsSaved: false
property var pendingCoroutines: ({})
signal willLoadAccounts(bool will)
property bool loadingAccounts: false
function callSync(name, args=[]) {
return call_sync("APP.backend." + name, args)
}
@ -59,15 +57,10 @@ Python {
importNames("python", ["APP"], () => {
loadSettings(() => {
callCoro("saved_accounts.any_saved", [], any => {
py.ready = true
willLoadAccounts(any)
if (any) { py.callCoro("load_saved_accounts", []) }
if (any) {
py.loadingAccounts = true
py.callCoro("load_saved_accounts", [], () => {
py.loadingAccounts = false
})
}
py.startupAnyAccountsSaved = any
py.ready = true
})
})
})

View File

@ -14,6 +14,7 @@ HRectangle {
property bool manuallyResizing: false
property bool manuallyResized: false
property int manualWidth: 0
property bool animateWidth: true
Component.onCompleted: {
if (window.uiState.sidePaneManualWidth) {
@ -61,7 +62,9 @@ HRectangle {
0 : theme.spacing
Behavior on currentSpacing { HNumberAnimation {} }
Behavior on implicitWidth { HNumberAnimation {} }
Behavior on implicitWidth {
HNumberAnimation { factor: animateWidth ? 1 : 0 }
}
HColumnLayout {

View File

@ -22,27 +22,9 @@ HRectangle {
}
}
Connections {
target: py
onWillLoadAccounts: will => {
if (! will) {
pageStack.showPage("SignIn")
return
}
let page = window.uiState.page
let props = window.uiState.pageProperties
if (page == "Chat/Chat.qml") {
pageStack.showRoom(props.userId, props.roomId)
} else {
pageStack.show(page, props)
}
}
}
property bool accountsPresent:
(modelSources["Account"] || []).length > 0 || py.loadingAccounts
(modelSources["Account"] || []).length > 0 ||
py.startupAnyAccountsSaved
HImage {
id: mainUIBackground
@ -74,7 +56,7 @@ HRectangle {
width: implicitWidth
Layout.minimumWidth: reduce ? 0 : theme.sidePane.collapsedWidth
Layout.maximumWidth:
window.width -theme.minimumSupportedWidthPlusSpacing
window.width - theme.minimumSupportedWidthPlusSpacing
Behavior on Layout.minimumWidth { HNumberAnimation {} }
}
@ -83,6 +65,22 @@ HRectangle {
id: pageStack
property bool isWide: width > theme.contentIsWideAbove
Component.onCompleted: {
if (! py.startupAnyAccountsSaved) {
pageStack.showPage("SignIn")
return
}
let page = window.uiState.page
let props = window.uiState.pageProperties
if (page == "Chat/Chat.qml") {
pageStack.showRoom(props.userId, props.roomId)
} else {
pageStack.show(page, props)
}
}
function show(componentUrl, properties={}) {
pageStack.replace(componentUrl, properties)
}

View File

@ -43,6 +43,6 @@ ApplicationWindow {
scale: py.ready ? 1 : 0.5
source: py.ready ? "UI.qml" : ""
Behavior on scale { HNumberAnimation {} }
Behavior on scale { HNumberAnimation { overshoot: 5; factor: 1.2 } }
}
}