Skip to content

Q
qtquickcontrols-nemo
Commit b6b56a00 authored by eekkelund's avatar eekkelund
Browse files
Options

[Keyboard] Add keyboard to clipped area

parent c2dfacb8
Hide whitespace changes
Inline Side-by-side
Showing with 141 additions and 49 deletions
src/controls/qml/ApplicationWindow.qml
View file @ b6b56a00
...@@ -191,9 +191,40 @@ NemoWindow { ...@@ -191,9 +191,40 @@ NemoWindow {
Item { Item {
id: backgroundItem id: backgroundItem
anchors.fill: parent anchors.fill: parent
rotation: rotationToTransposeToPortrait() rotation: rotationToTransposeToPortrait()
Item {
id: clipping2
z: 1
property bool panelVisible: inputPanel.active
onPanelVisibleChanged:{
if(!panelVisible) {
imShowAnimation.stop()
imHideAnimation.start()
}else {
imHideAnimation.stop()
imShowAnimation.to = inputPanel.height
imShowAnimation.start()
}
}
width:(isUiLandscape ? stackView.panelSize : parent.width)
height:(isUiPortrait ? stackView.panelSize : root.height)
InputPanel {
z:99
id: inputPanel
visible: true
width:isUiPortrait ? backgroundItem.width : backgroundItem.height
x:0
rotation:contentArea.rotation
anchors.centerIn: parent
}
}
Item { Item {
id: clipping id: clipping
...@@ -206,14 +237,6 @@ NemoWindow { ...@@ -206,14 +237,6 @@ NemoWindow {
Item { Item {
id: contentArea id: contentArea
anchors.centerIn: parent anchors.centerIn: parent
InputPanel {
z:99
id: inputPanel
visible: Qt.inputMethod.visible
y: Qt.inputMethod.visible ? parent.height - inputPanel.height : parent.height
anchors.left: parent.left
anchors.right: parent.right
}
transform: Scale { transform: Scale {
id: contentScale id: contentScale
...@@ -244,10 +267,22 @@ NemoWindow { ...@@ -244,10 +267,22 @@ NemoWindow {
property real panelSize: 0 property real panelSize: 0
property real previousImSize: 0 property real previousImSize: 0
property real imSize: !root.applicationActive ? 0 : (isUiPortrait ? (root._transpose ? Qt.inputMethod.keyboardRectangle.width property real imSize: !root.applicationActive ? 0 : Qt.inputMethod.keyboardRectangle.height
: Qt.inputMethod.keyboardRectangle.height)
: (root._transpose ? Qt.inputMethod.keyboardRectangle.height onImSizeChanged: {
: Qt.inputMethod.keyboardRectangle.width)) if (imSize <= 0 && previousImSize > 0) {
imShowAnimation.stop()
imHideAnimation.start()
} else if (imSize > 0 && previousImSize <= 0) {
imHideAnimation.stop()
imShowAnimation.to = imSize
imShowAnimation.start()
} else {
panelSize = imSize
}
previousImSize = imSize
}
clip: true clip: true
Component.onCompleted: { Component.onCompleted: {
...@@ -297,6 +332,12 @@ NemoWindow { ...@@ -297,6 +332,12 @@ NemoWindow {
delegate: StackViewDelegate { delegate: StackViewDelegate {
pushTransition: Component { pushTransition: Component {
StackViewTransition { StackViewTransition {
ScriptAction {
script: {
imShowAnimation.stop()
imHideAnimation.start()
}
}
PropertyAnimation { PropertyAnimation {
target: enterItem target: enterItem
property: "x" property: "x"
...@@ -317,6 +358,12 @@ NemoWindow { ...@@ -317,6 +358,12 @@ NemoWindow {
} }
popTransition: Component { popTransition: Component {
StackViewTransition { StackViewTransition {
ScriptAction {
script: {
imShowAnimation.stop()
imHideAnimation.start()
}
}
PropertyAnimation { PropertyAnimation {
target: enterItem target: enterItem
property: "x" property: "x"
...@@ -368,33 +415,34 @@ NemoWindow { ...@@ -368,33 +415,34 @@ NemoWindow {
//used to animate the dimmer when pages are pushed/popped (see Header's QML code) //used to animate the dimmer when pages are pushed/popped (see Header's QML code)
property alias __dimmer: headerDimmerContainer property alias __dimmer: headerDimmerContainer
}
Item {
//This item handles the rotation of the dimmer. Item {
//All this because QML doesn't have a horizontal gradient (unless you import GraphicalEffects) //This item handles the rotation of the dimmer.
//and having a container which doesn't rotate but just resizes makes it easier to rotate its inner //All this because QML doesn't have a horizontal gradient (unless you import GraphicalEffects)
//child //and having a container which doesn't rotate but just resizes makes it easier to rotate its inner
id: headerDimmerContainer //child
id: headerDimmerContainer
//README: Don't use AnchorChanges for this item!
//Reason: state changes disable bindings while the transition from one state to another is running. //README: Don't use AnchorChanges for this item!
//This causes the dimmer not to follow the drawer when the drawer is closed right before the orientation change //Reason: state changes disable bindings while the transition from one state to another is running.
anchors.top: isUiPortrait ? toolBar.bottom : parent.top //This causes the dimmer not to follow the drawer when the drawer is closed right before the orientation change
anchors.left: isUiPortrait ? parent.left : toolBar.right anchors.top: isUiPortrait ? toolBar.bottom : parent.top
anchors.right: isUiPortrait ? parent.right : undefined anchors.left: isUiPortrait ? parent.left : toolBar.right
anchors.bottom: isUiPortrait ? undefined : parent.bottom anchors.right: isUiPortrait ? parent.right : undefined
//we only set the size in one orientation, the anchors will take care of the other anchors.bottom: isUiPortrait ? undefined : parent.bottom
width: if (!isUiPortrait) Theme.itemHeightExtraSmall/2 //we only set the size in one orientation, the anchors will take care of the other
height: if (isUiPortrait) Theme.itemHeightExtraSmall/2 width: if (!isUiPortrait) Theme.itemHeightExtraSmall/2
//MAKE SURE THAT THE HEIGHT SPECIFIED BY THE THEME IS AN EVEN NUMBER, TO AVOID ROUNDING ERRORS IN THE LAYOUT height: if (isUiPortrait) Theme.itemHeightExtraSmall/2
//MAKE SURE THAT THE HEIGHT SPECIFIED BY THE THEME IS AN EVEN NUMBER, TO AVOID ROUNDING ERRORS IN THE LAYOUT
Rectangle {
id: headerDimmer Rectangle {
anchors.centerIn: parent id: headerDimmer
gradient: Gradient { anchors.centerIn: parent
GradientStop { position: 0; color: Theme.backgroundColor } gradient: Gradient {
GradientStop { position: 1; color: "transparent" } GradientStop { position: 0; color: Theme.backgroundColor }
GradientStop { position: 1; color: "transparent" }
}
} }
} }
} }
...@@ -433,6 +481,13 @@ NemoWindow { ...@@ -433,6 +481,13 @@ NemoWindow {
anchors.right: undefined anchors.right: undefined
anchors.bottom: undefined anchors.bottom: undefined
} }
AnchorChanges {
target: clipping2
anchors.top: clipping.bottom
anchors.left: parent.left
anchors.right: undefined
anchors.bottom: undefined
}
}, },
State { State {
name: 'Landscape' name: 'Landscape'
...@@ -458,6 +513,13 @@ NemoWindow { ...@@ -458,6 +513,13 @@ NemoWindow {
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
} }
AnchorChanges {
target: clipping2
anchors.top: undefined
anchors.left: parent.left
anchors.right: undefined//clipping.left
anchors.bottom: parent.bottom
}
}, },
State { State {
name: 'PortraitInverted' name: 'PortraitInverted'
...@@ -483,6 +545,13 @@ NemoWindow { ...@@ -483,6 +545,13 @@ NemoWindow {
anchors.right: parent.right anchors.right: parent.right
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
} }
AnchorChanges {
target: clipping2
anchors.top: undefined
anchors.left: undefined
anchors.right: clipping.right
anchors.bottom: clipping.top
}
}, },
State { State {
name: 'LandscapeInverted' name: 'LandscapeInverted'
...@@ -508,6 +577,13 @@ NemoWindow { ...@@ -508,6 +577,13 @@ NemoWindow {
anchors.right: undefined anchors.right: undefined
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
} }
AnchorChanges {
target: clipping2
anchors.top: undefined
anchors.left: undefined//clipping.right
anchors.right: parent.right
anchors.bottom: parent.bottom
}
} }
] ]
...@@ -520,11 +596,19 @@ NemoWindow { ...@@ -520,11 +596,19 @@ NemoWindow {
property: 'orientationTransitionRunning' property: 'orientationTransitionRunning'
value: true value: true
} }
NumberAnimation { ParallelAnimation {
target: contentArea NumberAnimation {
property: 'opacity' target: contentArea
to: 0 property: 'opacity'
duration: 150 to: 0
duration: 150
}
NumberAnimation {
target: inputPanel
property: 'opacity'
to: 0
duration: 150
}
} }
PropertyAction { PropertyAction {
target: contentArea target: contentArea
...@@ -537,11 +621,19 @@ NemoWindow { ...@@ -537,11 +621,19 @@ NemoWindow {
target: headerDimmer target: headerDimmer
properties: 'width,height,rotation' properties: 'width,height,rotation'
} }
NumberAnimation { ParallelAnimation {
target: contentArea NumberAnimation {
property: 'opacity' target: contentArea
to: 1 property: 'opacity'
duration: 150 to: 1
duration: 150
}
NumberAnimation {
target: inputPanel
property: 'opacity'
to: 1
duration: 150
}
} }
PropertyAction { PropertyAction {
target: contentArea target: contentArea
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment