From b698c64694179d0c2f634d4d35eab803158b4eaa Mon Sep 17 00:00:00 2001 From: zheng_wenlong Date: Wed, 14 Nov 2018 12:36:02 +0900 Subject: Add launcher for horizontal mode Add launcher for horizontal mode. Change-Id: I2a34b606c8f97fc30f43fe95427d5392edc57c2a Signed-off-by: zheng_wenlong --- .../horizontal/launcher/launcher/qml/Launcher.qml | 513 +++++++++++++++++++++ 1 file changed, 513 insertions(+) create mode 100644 demo3/horizontal/launcher/launcher/qml/Launcher.qml (limited to 'demo3/horizontal/launcher/launcher/qml/Launcher.qml') diff --git a/demo3/horizontal/launcher/launcher/qml/Launcher.qml b/demo3/horizontal/launcher/launcher/qml/Launcher.qml new file mode 100644 index 0000000..31a9848 --- /dev/null +++ b/demo3/horizontal/launcher/launcher/qml/Launcher.qml @@ -0,0 +1,513 @@ +/* + * Copyright (C) 2016 The Qt Company Ltd. + * Copyright (C) 2016, 2017 Mentor Graphics Development (Deutschland) GmbH + * Copyright (c) 2018 TOYOTA MOTOR CORPORATION + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import QtQuick 2.6 +import QtQuick.Layouts 1.1 +import QtQuick.Controls 2.0 +import AppModel 1.0 +import "ChangeItemPosition.js" as Cip + +ApplicationWindow { + id: root + + property int pid: -1 + property int firstPox: -1 + property bool iconMoved: false + + Timer { + id: timer + interval: 650 + repeat: false + onTriggered: { + var centerItem = Cip.getCenterItem() + centerItem.state = "pos14" + centerImage.opacity = 1.0 + } + } + + Repeater { + id: repeater + model: ApplicationModel { id: applicationModel } + + property int currentItem + + IconItem { + id: rect1 + property int currentState: 1 + + width: 300 + height: 590 + + smooth: true + + anchors.centerIn: parent + + Behavior on opacity { + NumberAnimation { duration: 200 } + } + + Behavior on z { + NumberAnimation { duration: 300 } + } + transform: [ + Rotation { + id: rotate + angle: 0 + origin.y: 243 + origin.x: 160 + axis { x: 0; y: 1; z: 0 } + Behavior on angle { + NumberAnimation { easing.overshoot: 1; easing.type: Easing.OutBack; duration: 600 } + } + }, + Translate { + id: trans + x: 0 + y: 0 + Behavior on x { + NumberAnimation { easing.overshoot: 1; easing.type: Easing.OutBack; duration: 600 } + } + Behavior on y { + NumberAnimation { easing.overshoot: 1; easing.type: Easing.OutBack; duration: 600 } + } + }, + Scale { + id: scale + origin.x: 160 + origin.y: 243 + xScale: 1 + yScale: 1 + Behavior on xScale { + NumberAnimation { easing.overshoot: 1; easing.type: Easing.OutBack; duration: 600 } + } + Behavior on yScale { + NumberAnimation { easing.overshoot: 1; easing.type: Easing.OutBack; duration: 600 } + } + } + ] + + states: [ + State { + name: "pos0" + PropertyChanges { + target: rotate + angle: 80 + } + PropertyChanges { + target: trans + x: -1050 + y: 270 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 0 + } + PropertyChanges { + target: scale + xScale: 1.2 + yScale: 1.2 + } + }, + State { + name: "pos1" + PropertyChanges { + target: rotate + angle: 75 + } + PropertyChanges { + target: trans + x: -700 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 1.2 + yScale: 1.2 + } + }, + State { + name: "pos2" + PropertyChanges { + target: rotate + angle: 60 + } + PropertyChanges { + target: trans + x: -820 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.79 + yScale: 0.79 + } + }, + State { + name: "pos3" + PropertyChanges { + target: rotate + angle: 40 + } + PropertyChanges { + target: trans + x: -780 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.55 + yScale: 0.55 + } + }, + State { + name: "pos4" + PropertyChanges { + target: rotate + angle: 15 + } + PropertyChanges { + target: trans + x: -470 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.45 + yScale: 0.45 + } + }, + State { + name: "pos5" + PropertyChanges { + target: rotate + angle: 0 + } + PropertyChanges { + target: trans + x: 0 + y: 0 + } + PropertyChanges { + target: rect1 + z: 1 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.42 + yScale: 0.42 + } + }, + State { + name: "pos6" + PropertyChanges { + target: rotate + angle: -15 + } + PropertyChanges { + target: trans + x: 470 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.45 + yScale: 0.45 + } + }, + State { + name: "pos7" + PropertyChanges { + target: rotate + angle: -40 + } + PropertyChanges { + target: trans + x: 780 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.55 + yScale: 0.55 + } + }, + State { + name: "pos8" + PropertyChanges { + target: rotate + angle: -60 + } + PropertyChanges { + target: trans + x: 820 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 0.79 + yScale: 0.79 + } + }, + State { + name: "pos9" + PropertyChanges { + target: rotate + angle: -75 + } + PropertyChanges { + target: trans + x: 700 + y: 0 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 1.2 + yScale: 1.2 + } + }, + State { + name: "pos10" + PropertyChanges { + target: rotate + angle: -80 + } + PropertyChanges { + target: trans + x: 1050 + y: 270 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 0 + } + PropertyChanges { + target: scale + xScale: 1.2 + yScale: 1.2 + } + }, + State { + name: "pos11" + PropertyChanges { + target: rotate + angle: 0 + } + PropertyChanges { + target: trans + x: 1050 + y: 540 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 0 + } + PropertyChanges { + target: scale + xScale: 1 + yScale: 1 + } + }, + State { + name: "pos12" + PropertyChanges { + target: rotate + angle: 0 + } + PropertyChanges { + target: trans + x: 0 + y: 540 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 0 + } + PropertyChanges { + target: scale + xScale: 1 + yScale: 1 + } + }, + State { + name: "pos13" + PropertyChanges { + target: rotate + angle: 0 + } + PropertyChanges { + target: trans + x: -1050 + y: 540 + } + PropertyChanges { + target: rect1 + z: 0 + opacity: 0 + } + PropertyChanges { + target: scale + xScale: 1 + yScale: 1 + } + }, + State { + name: "pos14" + PropertyChanges { + target: rotate + angle: 0 + } + PropertyChanges { + target: trans + x: 0 + y: -50 + } + PropertyChanges { + target: rect1 + z: 1 + opacity: 1 + } + PropertyChanges { + target: scale + xScale: 1 + yScale: 1 + } + } + ] + } + + } + Component.onCompleted: { + repeater.currentItem = 5; + var count = repeater.count; + for ( var i = 0; i < repeater.count; i++) + { + var item = repeater.itemAt(i); + item.currentState = i + 1; + if ( item.currentState >= 1 && item.currentState <= 10 ) + { + item.state = "pos" + item.currentState; + if ( item.currentState === 5 ) + item.state = "pos14"; + } else if ( item.currentState === 15 ){ + item.state = "pos11"; + } else if ( item.currentState === 16 ){ + item.state = "pos12"; + } else if ( item.currentState === 17 ){ + item.state = "pos13"; + } else if ( item.currentState >= 18 ){ + item.state = "pos0"; + } else { + item.state = "pos10"; + } + } + } + + Image { + id: centerImage + source: './images/center_background.png' + height: 590 + width: 350 + anchors.centerIn: parent + opacity: 1.0 + } + + MouseArea { + anchors.fill: parent + propagateComposedEvents: true + z: 2 + + onPressed: { + firstPox = mouseX; + iconMoved = false; + centerImage.opacity = 0.0; + if(mouseX >= 800 && mouseX <= 1120) + { + var item = Cip.getCenterItem() + item.iconPressed() + } + } + + onReleased: { + timer.start() + if(mouseX >= 800 && mouseX <= 1120) + { + var item = Cip.getCenterItem() + item.iconReleased() + } + } + + onClicked: { + if (iconMoved) + { + mouse.accepted = true + } else { + mouse.accepted = false + } + } + + onPositionChanged: { + var item = Cip.getCenterItem() + Cip.move(mouseX, item) + } + } + +} -- cgit 1.2.3-korg