Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-04-25 14:33:31 +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
width: 40
height: 40
source: "../../../icons/tablet-mute-icon.svg"
source: "icons/tablet-mute-icon.svg"
anchors.verticalCenter: parent.verticalCenter
}
Rectangle {
@ -154,22 +154,33 @@ Item {
}
Component.onCompleted: {
console.log("AJT: Tablet.onCompleted!");
// AJT: test flow by adding buttons
console.log("Tablet.onCompleted!");
var component = Qt.createComponent("TabletButton.qml");
var buttons = [];
for (var i = 0; i < 9; i++) {
buttons.push(component.createObject(flowMain));
}
var green = "#1fc6a6";
var lightblue = "#1DB5EC";
// set button color
var green = "#1FC6A6";
var lightblue = "#00B4EF";
buttons[3].color = lightblue;
buttons[4].color = lightblue;
buttons[5].color = lightblue;
buttons[6].color = green;
buttons[7].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: [
@ -183,7 +194,7 @@ Item {
PropertyChanges {
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 QtGraphicalEffects 1.0
Rectangle {
Item {
id: tabletButton
property string color: "#1080B8"
property string text: "EDIT"
property string icon: "icons/edit-icon.svg"
width: 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 {
id: icon
width: 60
height: 60
fillMode: Image.Stretch
anchors.bottom: text.top
anchors.bottomMargin: 3
anchors.horizontalCenterOffset: 0
anchors.bottomMargin: 5
anchors.horizontalCenter: parent.horizontalCenter
source: "../../../icons/edit-icon.svg"
fillMode: Image.Stretch
source: tabletButton.icon
}
Text {
id: text
color: "#ffffff"
text: "EDIT"
text: tabletButton.text
font.bold: true
font.pixelSize: 18
anchors.bottom: parent.bottom
@ -30,3 +54,5 @@ Rectangle {
horizontalAlignment: Text.AlignHCenter
}
}