Mirrors/overte-thingvellir
3
0
Fork 0
mirror of https://thingvellir.net/git/overte synced 2025-03-27 23:52:03 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Style tabs and background

Browse source
This commit is contained in:
David Rowe 2016-03-19 14:52:40 +13:00
parent 6a2cb393fa
commit 3fa678a652
4 changed files with 83 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
examples/html/edit-style.css
View file

@ -15,8 +15,8 @@ body {
margin: 0;
padding: 0;
background-color: rgb(76, 76, 76);
color: rgb(204, 204, 204);
background-color: #404040;
color: #afafaf;
font-family: Arial;
font-size: 9.0pt;

61
interface/resources/qml/ToolWindow.qml
View file

@ -10,11 +10,13 @@
import QtQuick 2.5
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import QtWebEngine 1.1
import Qt.labs.settings 1.0
import "windows-uit"
import "controls-uit"
import "styles-uit"
Window {
id: toolWindow
@ -28,6 +30,9 @@ Window {
title: "Tools"
property string newTabSource
property alias tabView: tabView
HifiConstants { id: hifi }
onParentChanged: {
if (parent) {
x = 120;
@ -59,11 +64,67 @@ Window {
id: tabView;
width: pane.contentWidth
height: pane.scrollHeight // Pane height so that don't use Window's scrollbars otherwise tabs may be scrolled out of view.
onCountChanged: {
if (0 == count) {
toolWindow.visible = false
}
}
style: TabViewStyle {
frame: Rectangle { // Background shown before content loads.
anchors.fill: parent
color: hifi.colors.baseGray
}
frameOverlap: 0
tab: Rectangle {
implicitWidth: control.count > 1 ? styleData.availableWidth / control.count : text.contentWidth + 4 * hifi.dimensions.contentMargin.x
implicitHeight: 3 * text.height
color: styleData.selected ? hifi.colors.black : hifi.colors.tabBackgroundDark
RalewayRegular {
id: text
text: styleData.title
font.capitalization: Font.AllUppercase
size: hifi.fontSizes.tabName
width: control.count > 1 ? parent.width - 2 * hifi.dimensions.contentSpacing.x : implicitWidth
elide: Text.ElideRight
color: styleData.selected ? hifi.colors.primaryHighlight : hifi.colors.lightGrayText
horizontalAlignment: Text.AlignHCenter
anchors.centerIn: parent
}
Rectangle { // Separator.
width: 1
height: parent.height
color: hifi.colors.black
anchors.left: parent.left
anchors.top: parent.top
visible: styleData.index > 0
Rectangle {
width: 1
height: 1
color: hifi.colors.baseGray
anchors.left: parent.left
anchors.bottom: parent.bottom
}
}
Rectangle { // Active underline.
width: parent.width - (styleData.index > 0 ? 1 : 0)
height: 1
anchors.right: parent.right
anchors.bottom: parent.bottom
color: styleData.selected ? hifi.colors.primaryHighlight : hifi.colors.baseGray
}
}
tabOverlap: 0
}
}
function updateVisiblity() {

2
interface/resources/qml/styles-uit/HifiConstants.qml
View file

@ -114,6 +114,8 @@ Item {
readonly property color dropDownDarkStart: "#7d7d7d"
readonly property color dropDownDarkFinish: "#6b6a6b"
readonly property color textFieldLightBackground: "#d4d4d4"
readonly property color tabBackgroundDark: "#252525"
readonly property color tabBackgroundLight: "#d4d4d4"
}
Item {

18
tests/ui/qml/main.qml
View file

@ -220,6 +220,24 @@ ApplicationWindow {
}
}
Button {
text: "Add Tab 2"
onClicked: {
console.log(desktop.toolWindow);
desktop.toolWindow.addWebTab({ source: "Foo 2" });
desktop.toolWindow.showTabForUrl("Foo 2", true);
}
}
Button {
text: "Add Tab 3"
onClicked: {
console.log(desktop.toolWindow);
desktop.toolWindow.addWebTab({ source: "Foo 3" });
desktop.toolWindow.showTabForUrl("Foo 3", true);
}
}
Button {
text: "Destroy Tab"
onClicked: {