mirror of
https://github.com/HifiExperiments/overte.git
synced 2025-07-22 22:44:45 +02:00
Style Button controls
This commit is contained in:
David Rowe
parent
1164e3e303
commit
61d359a9b5
3 changed files with 91 additions and 11 deletions
54
interface/resources/qml/controls-uit/Button.qml
Normal file
54
interface/resources/qml/controls-uit/Button.qml
Normal file
|
|
@ -0,0 +1,54 @@
|
|||
//
|
||||
// Button.qml
|
||||
//
|
||||
// Created by David Rowe on 16 Feb 2016
|
||||
// Copyright 2016 High Fidelity, Inc.
|
||||
//
|
||||
// Distributed under the Apache License, Version 2.0.
|
||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||
//
|
||||
|
||||
import QtQuick 2.5
|
||||
import QtQuick.Controls 1.4 as Original
|
||||
import QtQuick.Controls.Styles 1.4
|
||||
|
||||
import "../styles-uit"
|
||||
|
||||
Original.Button {
|
||||
id: button
|
||||
property int color: 0
|
||||
width: 120
|
||||
height: 30
|
||||
|
||||
style: ButtonStyle {
|
||||
|
||||
background: Rectangle {
|
||||
radius: hifi.buttons.radius
|
||||
gradient: Gradient {
|
||||
GradientStop {
|
||||
position: 0.2
|
||||
color: enabled
|
||||
? (!pressed && button.color != hifi.buttons.black || (!hovered || pressed) && button.color == hifi.buttons.black
|
||||
? hifi.buttons.colorStart[button.color] : hifi.buttons.colorFinish[button.color])
|
||||
: hifi.buttons.colorStart[hifi.buttons.white]
|
||||
}
|
||||
GradientStop {
|
||||
position: 1.0
|
||||
color: enabled
|
||||
? ((!hovered || pressed) && button.color != hifi.buttons.black || !pressed && button.color == hifi.buttons.black
|
||||
? hifi.buttons.colorFinish[button.color] : hifi.buttons.colorStart[button.color])
|
||||
: hifi.buttons.colorFinish[hifi.buttons.white]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
label: RalewayBold {
|
||||
font.capitalization: Font.AllUppercase
|
||||
color: enabled ? hifi.buttons.textColor[button.color] : hifi.colors.lightGrayText
|
||||
size: hifi.fontSizes.buttonLabel
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: control.text
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -88,8 +88,16 @@ Window {
|
|||
Row {
|
||||
id: allButtons
|
||||
spacing: 8
|
||||
Button { text: "Reload all"; onClicked: reloadAll() }
|
||||
Button { text: "Stop all"; onClicked: stopAll() }
|
||||
HifiControls.Button {
|
||||
text: "Reload all"
|
||||
color: hifi.buttons.black
|
||||
onClicked: reloadAll()
|
||||
}
|
||||
HifiControls.Button {
|
||||
text: "Stop all"
|
||||
color: hifi.buttons.red
|
||||
onClicked: stopAll()
|
||||
}
|
||||
}
|
||||
|
||||
ScrollView {
|
||||
|
|
@ -163,12 +171,14 @@ Window {
|
|||
hasSeparator: true
|
||||
|
||||
Row {
|
||||
id: row1
|
||||
spacing: 8
|
||||
anchors.right: parent.right
|
||||
|
||||
Button {
|
||||
text: "from URL";
|
||||
onClicked: fromUrlTimer.running = true;
|
||||
HifiControls.Button {
|
||||
text: "from URL"
|
||||
color: hifi.buttons.black
|
||||
height: 26
|
||||
onClicked: fromUrlTimer.running = true
|
||||
|
||||
// For some reason trigginer an API that enters
|
||||
// an internal event loop directly from the button clicked
|
||||
|
|
@ -186,9 +196,11 @@ Window {
|
|||
}
|
||||
}
|
||||
|
||||
Button {
|
||||
HifiControls.Button {
|
||||
text: "from Disk"
|
||||
onClicked: fromDiskTimer.running = true;
|
||||
color: hifi.buttons.black
|
||||
height: 26
|
||||
onClicked: fromDiskTimer.running = true
|
||||
|
||||
Timer {
|
||||
id: fromDiskTimer
|
||||
|
|
@ -265,9 +277,10 @@ Window {
|
|||
}
|
||||
}
|
||||
|
||||
Button {
|
||||
HifiControls.Button {
|
||||
id: loadButton
|
||||
text: "Load"
|
||||
color: hifi.buttons.blue
|
||||
enabled: selectedScript.text != ""
|
||||
onClicked: root.loadScript(selectedScript.text)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ Item {
|
|||
readonly property alias colors: colors
|
||||
readonly property alias dimensions: dimensions
|
||||
readonly property alias fontSizes: fontSizes
|
||||
readonly property alias buttons: buttons
|
||||
readonly property alias effects: effects
|
||||
|
||||
Item {
|
||||
|
|
@ -61,8 +62,8 @@ Item {
|
|||
readonly property real sectionName: dimensions.largeScreen? 11 : 9
|
||||
readonly property real inputLabel: dimensions.largeScreen? 11 : 9
|
||||
readonly property real textFieldInput: dimensions.largeScreen? 16 : 11
|
||||
readonly property real buttonLabel: dimensions.largeScreen? 15 : 10
|
||||
readonly property real button: dimensions.largeScreen? 15 : 10
|
||||
readonly property real buttonLabel: dimensions.largeScreen? 12 : 10
|
||||
readonly property real button: dimensions.largeScreen? 12 : 10
|
||||
readonly property real listItem: dimensions.largeScreen? 11 : 9
|
||||
readonly property real tabularData: dimensions.largeScreen? 11 : 9
|
||||
readonly property real logo: dimensions.largeScreen? 15 : 10
|
||||
|
|
@ -72,6 +73,18 @@ Item {
|
|||
readonly property real shortcutText: dimensions.largeScreen? 12 : 8
|
||||
}
|
||||
|
||||
Item {
|
||||
id: buttons
|
||||
readonly property int white: 0
|
||||
readonly property int blue: 1
|
||||
readonly property int red: 2
|
||||
readonly property int black: 3
|
||||
readonly property var textColor: [ colors.darkGray, colors.white, colors.white, colors.white ]
|
||||
readonly property var colorStart: [ "#ffffff", "#00b4ef", "#d42043", "#343434" ]
|
||||
readonly property var colorFinish: [ "#afafaf", "#1080b8", "#94132e", "#000000" ]
|
||||
readonly property int radius: 5
|
||||
}
|
||||
|
||||
/*
|
||||
SystemPalette { id: sysPalette; colorGroup: SystemPalette.Active }
|
||||
readonly property alias colors: colors
|
||||
|
|
|
|||
Loading…
Reference in a new issue