Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-04-26 07:16:25 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

drop shadow on tablet buttons + set text at instantiation

Browse source
This commit is contained in:
Faye Li 2016-12-13 15:32:21 -08:00
parent 8fcc42e537
commit ad905ac6dc
2 changed files with 50 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
interface/resources/qml/hifi/tablet/Tablet.qml
View file

@ -81,7 +81,7 @@ Item {
id: muteIcon id: muteIcon
width: 40 width: 40
height: 40 height: 40
source: "../../../icons/tablet-mute-icon.svg" source: "icons/tablet-mute-icon.svg"
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
Rectangle { Rectangle {
@ -154,22 +154,33 @@ Item {
} }
Component.onCompleted: { Component.onCompleted: {
console.log("AJT: Tablet.onCompleted!"); console.log("Tablet.onCompleted!");
// AJT: test flow by adding buttons
var component = Qt.createComponent("TabletButton.qml"); var component = Qt.createComponent("TabletButton.qml");
var buttons = []; var buttons = [];
for (var i = 0; i < 9; i++) { for (var i = 0; i < 9; i++) {
buttons.push(component.createObject(flowMain)); buttons.push(component.createObject(flowMain));
} }
var green = "#1fc6a6"; // set button color
var lightblue = "#1DB5EC"; var green = "#1FC6A6";
var lightblue = "#00B4EF";
buttons[3].color = lightblue; buttons[3].color = lightblue;
buttons[4].color = lightblue; buttons[4].color = lightblue;
buttons[5].color = lightblue; buttons[5].color = lightblue;
buttons[6].color = green; buttons[6].color = green;
buttons[7].color = green; buttons[7].color = green;
buttons[8].color = green; buttons[8].color = green;
// set button text
buttons[0].text = "GO TO";
buttons[1].text = "BUBBLE";
buttons[2].text = "MENU";
buttons[3].text = "MARKET";
buttons[4].text = "SWITCH";
buttons[5].text = "PAUSE";
buttons[6].text = "EDIT";
buttons[7].text = "SNAP";
buttons[8].text = "SCRIPTS";
} }
} }
states: [ states: [
@ -183,7 +194,7 @@ Item {
PropertyChanges { PropertyChanges {
target: muteIcon target: muteIcon
source: "../../../icons/tablet-unmute-icon.svg" source: "icons/tablet-unmute-icon.svg"
} }
} }
] ]

40
interface/resources/qml/hifi/tablet/TabletButton.qml
View file

@ -1,27 +1,51 @@
import QtQuick 2.0 import QtQuick 2.0
import QtGraphicalEffects 1.0
Rectangle { Item {
id: tabletButton id: tabletButton
property string color: "#1080B8"
property string text: "EDIT"
property string icon: "icons/edit-icon.svg"
width: 132 width: 132
height: 132 height: 132
color: "#1d94c3"
Rectangle {
id: buttonBg
color: tabletButton.color
anchors.right: parent.right
anchors.rightMargin: 0
anchors.left: parent.left
anchors.leftMargin: 0
anchors.bottom: parent.bottom
anchors.bottomMargin: 0
anchors.top: parent.top
anchors.topMargin: 0
layer.enabled: true
layer.effect: DropShadow {
horizontalOffset: 0
verticalOffset: 3
color: "#aa000000"
radius: 20
samples: 41
}
}
Image { Image {
id: icon id: icon
width: 60 width: 60
height: 60 height: 60
fillMode: Image.Stretch
anchors.bottom: text.top anchors.bottom: text.top
anchors.bottomMargin: 3 anchors.bottomMargin: 5
anchors.horizontalCenterOffset: 0
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
source: "../../../icons/edit-icon.svg" fillMode: Image.Stretch
source: tabletButton.icon
} }
Text { Text {
id: text id: text
color: "#ffffff" color: "#ffffff"
text: "EDIT" text: tabletButton.text
font.bold: true font.bold: true
font.pixelSize: 18 font.pixelSize: 18
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
@ -30,3 +54,5 @@ Rectangle {
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
} }
} }