adding changes to design + truly separating muted/ptt

This commit is contained in:
Wayne Chen 2019-03-25 15:35:05 -07:00
parent 9a8c5e5a54
commit 49ce30d536
6 changed files with 59 additions and 38 deletions

View file

@ -24,6 +24,7 @@ CheckBox {
leftPadding: 0
property int colorScheme: hifi.colorSchemes.light
property string color: hifi.colors.lightGrayText
property int fontSize: hifi.fontSizes.inputLabel
readonly property bool isLightColorScheme: colorScheme === hifi.colorSchemes.light
property bool isRedCheck: false
property bool isRound: false
@ -109,7 +110,7 @@ CheckBox {
contentItem: Text {
id: root
font.pixelSize: hifi.fontSizes.inputLabel
font.pixelSize: fontSize;
font.family: "Raleway"
font.weight: Font.DemiBold
text: checkBox.text

View file

@ -21,6 +21,7 @@ Item {
property int switchWidth: 70;
readonly property int switchRadius: height/2;
property string labelTextOff: "";
property int labelTextSize: hifi.fontSizes.inputLabel;
property string labelGlyphOffText: "";
property int labelGlyphOffSize: 32;
property string labelTextOn: "";
@ -89,7 +90,7 @@ Item {
RalewaySemiBold {
id: labelOff;
text: labelTextOff;
size: hifi.fontSizes.inputLabel;
size: labelTextSize;
color: originalSwitch.checked ? hifi.colors.lightGrayText : "#FFFFFF";
anchors.top: parent.top;
anchors.right: parent.right;
@ -130,7 +131,7 @@ Item {
RalewaySemiBold {
id: labelOn;
text: labelTextOn;
size: hifi.fontSizes.inputLabel;
size: labelTextSize;
color: originalSwitch.checked ? "#FFFFFF" : hifi.colors.lightGrayText;
anchors.top: parent.top;
anchors.left: parent.left;

View file

@ -31,6 +31,8 @@ Rectangle {
property string title: "Audio Settings"
property int switchHeight: 16
property int switchWidth: 40
property bool pushToTalk: (bar.currentIndex === 0) ? AudioScriptingInterface.pushToTalkDesktop : AudioScriptingInterface.pushToTalkHMD;
property bool muted: (bar.currentIndex === 0) ? AudioScriptingInterface.desktopMuted : AudioScriptingInterface.hmdMuted;
readonly property real verticalScrollWidth: 10
readonly property real verticalScrollShaft: 8
signal sendToScript(var message);
@ -44,7 +46,7 @@ Rectangle {
property bool isVR: AudioScriptingInterface.context === "VR"
property real rightMostInputLevelPos: 440
property real rightMostInputLevelPos: root.width
//placeholder for control sizes and paddings
//recalculates dynamically in case of UI size is changed
QtObject {
@ -92,7 +94,9 @@ Rectangle {
}
}
Component.onCompleted: enablePeakValues();
Component.onCompleted: {
enablePeakValues();
}
Flickable {
id: flickView;
@ -167,15 +171,25 @@ Rectangle {
height: root.switchHeight;
switchWidth: root.switchWidth;
labelTextOn: "Mute microphone";
labelTextSize: 16;
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.muted;
checked: muted;
onClicked: {
if (AudioScriptingInterface.pushToTalk && !checked) {
if (pushToTalk && !checked) {
// disable push to talk if unmuting
AudioScriptingInterface.pushToTalk = false;
if ((bar.currentIndex === 0)) {
AudioScriptingInterface.pushToTalkDesktop = false;
}
else {
AudioScriptingInterface.pushToTalkHMD = false;
}
}
if ((bar.currentIndex === 0)) {
AudioScriptingInterface.desktopMuted = checked;
}
else {
AudioScriptingInterface.hmdMuted = checked;
}
AudioScriptingInterface.muted = checked;
checked = Qt.binding(function() { return AudioScriptingInterface.muted; }); // restore binding
}
}
@ -187,6 +201,7 @@ Rectangle {
anchors.topMargin: 24
anchors.left: parent.left
labelTextOn: "Noise Reduction";
labelTextSize: 16;
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.noiseReduction;
onCheckedChanged: {
@ -203,6 +218,7 @@ Rectangle {
anchors.topMargin: 24
anchors.left: parent.left
labelTextOn: qsTr("Push To Talk (T)");
labelTextSize: 16;
backgroundOnColor: "#E3E3E3";
checked: (bar.currentIndex === 0) ? AudioScriptingInterface.pushToTalkDesktop : AudioScriptingInterface.pushToTalkHMD;
onCheckedChanged: {
@ -211,13 +227,6 @@ Rectangle {
} else {
AudioScriptingInterface.pushToTalkHMD = checked;
}
checked = Qt.binding(function() {
if (bar.currentIndex === 0) {
return AudioScriptingInterface.pushToTalkDesktop;
} else {
return AudioScriptingInterface.pushToTalkHMD;
}
}); // restore binding
}
}
}
@ -235,6 +244,7 @@ Rectangle {
anchors.top: parent.top
anchors.left: parent.left
labelTextOn: qsTr("Warn when muted");
labelTextSize: 16;
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.warnWhenMuted;
onClicked: {
@ -252,6 +262,7 @@ Rectangle {
anchors.topMargin: 24
anchors.left: parent.left
labelTextOn: qsTr("Audio Level Meter");
labelTextSize: 16;
backgroundOnColor: "#E3E3E3";
checked: AvatarInputs.showAudioTools;
onCheckedChanged: {
@ -268,6 +279,7 @@ Rectangle {
anchors.topMargin: 24
anchors.left: parent.left
labelTextOn: qsTr("Stereo input");
labelTextSize: 16;
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.isStereoInput;
onCheckedChanged: {
@ -281,6 +293,7 @@ Rectangle {
Item {
id: pttTextContainer
visible: pushToTalk;
anchors.top: switchesContainer.bottom;
anchors.topMargin: 10;
anchors.left: parent.left;
@ -303,7 +316,7 @@ Rectangle {
Separator {
id: secondSeparator;
anchors.top: pttTextContainer.bottom;
anchors.top: pttTextContainer.visible ? pttTextContainer.bottom : switchesContainer.bottom;
anchors.topMargin: 10;
}
@ -330,7 +343,7 @@ Rectangle {
width: margins.sizeText + margins.sizeLevel;
anchors.left: parent.left;
anchors.leftMargin: margins.sizeCheckBox;
size: 16;
size: 22;
color: hifi.colors.white;
text: qsTr("Choose input device");
}
@ -338,7 +351,7 @@ Rectangle {
ListView {
id: inputView;
width: parent.width - margins.paddings*2;
width: rightMostInputLevelPos;
anchors.top: inputDeviceHeader.bottom;
anchors.topMargin: 10;
x: margins.paddings
@ -347,7 +360,7 @@ Rectangle {
clip: true;
model: AudioScriptingInterface.devices.input;
delegate: Item {
width: rightMostInputLevelPos
width: rightMostInputLevelPos - margins.paddings*2
height: margins.sizeCheckBox > checkBoxInput.implicitHeight ?
margins.sizeCheckBox : checkBoxInput.implicitHeight
@ -363,6 +376,7 @@ Rectangle {
boxSize: margins.sizeCheckBox / 2
isRound: true
text: devicename
fontSize: 16;
onPressed: {
if (!checked) {
stereoInput.checked = false;
@ -395,7 +409,7 @@ Rectangle {
Separator {
id: thirdSeparator;
anchors.top: loopbackAudio.bottom;
anchors.top: loopbackAudio.visible ? loopbackAudio.bottom : inputView.bottom;
anchors.topMargin: 10;
}
@ -422,7 +436,7 @@ Rectangle {
anchors.left: parent.left
anchors.leftMargin: margins.sizeCheckBox
anchors.verticalCenter: parent.verticalCenter;
size: 16;
size: 22;
color: hifi.colors.white;
text: qsTr("Choose output device");
}
@ -452,6 +466,7 @@ Rectangle {
checked: bar.currentIndex === 0 ? selectedDesktop : selectedHMD;
checkable: !checked
text: devicename
fontSize: 16
onPressed: {
if (!checked) {
AudioScriptingInterface.setOutputDevice(info, bar.currentIndex === 1);
@ -514,7 +529,7 @@ Rectangle {
RalewayRegular {
// The slider for my card is special, it controls the master gain
id: gainSliderText;
text: "Avatar volume";
text: "People volume";
size: 16;
anchors.left: parent.left;
color: hifi.colors.white;

View file

@ -12,24 +12,26 @@
import QtQuick 2.5
import QtGraphicalEffects 1.0
Rectangle {
Item {
property var peak;
width: 70;
height: 8;
color: "transparent";
Item {
QtObject {
id: colors;
readonly property string unmuted: "#FFF";
readonly property string muted: "#E2334D";
readonly property string gutter: "#575757";
readonly property string greenStart: "#39A38F";
readonly property string greenEnd: "#1FC6A6";
readonly property string yellow: "#C0C000";
readonly property string red: colors.muted;
readonly property string fill: "#55000000";
}
Text {
id: status;
@ -79,23 +81,19 @@ Rectangle {
anchors { fill: mask }
source: mask
start: Qt.point(0, 0);
end: Qt.point(70, 0);
end: Qt.point(bar.width, 0);
gradient: Gradient {
GradientStop {
position: 0;
color: colors.greenStart;
}
GradientStop {
position: 0.8;
position: 0.5;
color: colors.greenEnd;
}
GradientStop {
position: 0.801;
color: colors.red;
}
GradientStop {
position: 1;
color: colors.red;
color: colors.yellow;
}
}
}

View file

@ -44,8 +44,11 @@ RowLayout {
}
HifiControlsUit.Button {
text: audioLoopedBack ? qsTr("STOP TESTING YOUR VOICE") : qsTr("TEST YOUR VOICE");
text: audioLoopedBack ? qsTr("STOP TESTING VOICE") : qsTr("TEST YOUR VOICE");
color: audioLoopedBack ? hifi.buttons.red : hifi.buttons.blue;
fontSize: 15;
width: 200;
height: 32;
onClicked: {
if (audioLoopedBack) {
loopbackTimer.stop();
@ -59,7 +62,7 @@ RowLayout {
RalewayRegular {
Layout.leftMargin: 2;
size: 14;
size: 18;
color: "white";
font.italic: true
text: audioLoopedBack ? qsTr("Speak in your input") : "";

View file

@ -59,11 +59,14 @@ RowLayout {
text: isPlaying ? qsTr("STOP TESTING YOUR SOUND") : qsTr("TEST YOUR SOUND");
color: isPlaying ? hifi.buttons.red : hifi.buttons.blue;
onClicked: isPlaying ? stopSound() : playSound();
fontSize: 15;
width: 200;
height: 32;
}
RalewayRegular {
Layout.leftMargin: 2;
size: 14;
size: 18;
color: "white";
font.italic: true
text: isPlaying ? qsTr("Listen to your output") : "";