adding switches and buttons to testing audio

This commit is contained in:
Wayne Chen 2019-03-04 19:28:12 -08:00
parent a68aaaa7a4
commit 0f2792930a
4 changed files with 62 additions and 88 deletions

View file

@ -27,6 +27,7 @@ Item {
property string labelGlyphOnText: "";
property int labelGlyphOnSize: 32;
property alias checked: originalSwitch.checked;
property string backgroundOnColor: "#252525";
signal onCheckedChanged;
signal clicked;
@ -54,7 +55,7 @@ Item {
}
background: Rectangle {
color: "#252525";
color: checked ? backgroundOnColor : "#252525";
implicitWidth: rootSwitch.switchWidth;
implicitHeight: rootSwitch.height;
radius: rootSwitch.switchRadius;

View file

@ -16,7 +16,7 @@ import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import stylesUit 1.0
import controlsUit 1.0 as HifiControls
import controlsUit 1.0 as HifiControlsUit
import "../../windows"
import "./" as AudioControls
@ -27,6 +27,8 @@ Rectangle {
property var eventBridge;
property string title: "Audio Settings"
property int switchHeight: 16
property int switchWidth: 40
signal sendToScript(var message);
color: hifi.colors.baseGray;
@ -38,7 +40,7 @@ Rectangle {
property bool isVR: AudioScriptingInterface.context === "VR"
property real rightMostInputLevelPos: 0
property real rightMostInputLevelPos: 450
//placeholder for control sizes and paddings
//recalculates dynamically in case of UI size is changed
QtObject {
@ -98,58 +100,68 @@ Rectangle {
Separator { }
ColumnLayout {
x: margins.paddings;
spacing: 16;
RowLayout {
x: 2 * margins.paddings;
spacing: columnOne.width;
width: parent.width;
// mute is in its own row
RowLayout {
spacing: (margins.sizeCheckBox - 10.5) * 3;
AudioControls.CheckBox {
id: muteMic
text: qsTr("Mute microphone");
spacing: margins.sizeCheckBox - boxSize
isRedCheck: true;
ColumnLayout {
id: columnOne
spacing: 12;
x: margins.paddings
HifiControlsUit.Switch {
id: muteMic;
height: root.switchHeight;
switchWidth: root.switchWidth;
labelTextOn: "Mute microphone";
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.muted;
onClicked: {
onCheckedChanged: {
AudioScriptingInterface.muted = checked;
checked = Qt.binding(function() { return AudioScriptingInterface.muted; }); // restore binding
}
}
AudioControls.CheckBox {
id: stereoMic
spacing: muteMic.spacing;
text: qsTr("Enable stereo input");
HifiControlsUit.Switch {
id: stereoInput;
height: root.switchHeight;
switchWidth: root.switchWidth;
labelTextOn: qsTr("Stereo input");
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.isStereoInput;
onClicked: {
onCheckedChanged: {
AudioScriptingInterface.isStereoInput = checked;
checked = Qt.binding(function() { return AudioScriptingInterface.isStereoInput; }); // restore binding
}
}
}
RowLayout {
spacing: muteMic.spacing*2; //make it visually distinguish
AudioControls.CheckBox {
spacing: muteMic.spacing
text: qsTr("Enable noise reduction");
ColumnLayout {
spacing: 12;
HifiControlsUit.Switch {
height: root.switchHeight;
switchWidth: root.switchWidth;
labelTextOn: "Noise Reduction";
backgroundOnColor: "#E3E3E3";
checked: AudioScriptingInterface.noiseReduction;
onClicked: {
onCheckedChanged: {
AudioScriptingInterface.noiseReduction = checked;
checked = Qt.binding(function() { return AudioScriptingInterface.noiseReduction; }); // restore binding
}
}
AudioControls.CheckBox {
spacing: muteMic.spacing
text: qsTr("Show audio level meter");
HifiControlsUit.Switch {
id: audioLevelSwitch
height: root.switchHeight;
switchWidth: root.switchWidth;
labelTextOn: qsTr("Audio Level Meter");
backgroundOnColor: "#E3E3E3";
checked: AvatarInputs.showAudioTools;
onClicked: {
onCheckedChanged: {
AvatarInputs.showAudioTools = checked;
checked = Qt.binding(function() { return AvatarInputs.showAudioTools; }); // restore binding
}
onXChanged: rightMostInputLevelPos = x + width
}
}
}
@ -203,7 +215,7 @@ Rectangle {
width: parent.width - inputLevel.width
clip: true
checkable: !checked
checked: bar.currentIndex === 0 ? selectedDesktop : selectedHMD;
checked: bar.currentIndex === 0 ? selectedDesktop : selectedHMD;
boxSize: margins.sizeCheckBox / 2
isRound: true
text: devicename
@ -215,7 +227,7 @@ Rectangle {
}
}
}
InputPeak {
AudioControls.InputPeak {
id: inputLevel
anchors.right: parent.right
peak: model.peak;
@ -225,8 +237,11 @@ Rectangle {
AudioScriptingInterface.devices.input.peakValuesAvailable;
}
}
Component.onCompleted: {
console.log("width " + rightMostInputLevelPos);
}
}
LoopbackAudio {
AudioControls.LoopbackAudio {
x: margins.paddings
visible: (bar.currentIndex === 1 && isVR) ||
@ -293,7 +308,7 @@ Rectangle {
}
}
}
PlaySampleSound {
AudioControls.PlaySampleSound {
x: margins.paddings
visible: (bar.currentIndex === 1 && isVR) ||

View file

@ -14,7 +14,7 @@ import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import stylesUit 1.0
import controlsUit 1.0 as HifiControls
import controlsUit 1.0 as HifiControlsUit
RowLayout {
property bool audioLoopedBack: AudioScriptingInterface.getServerEcho();
@ -43,29 +43,9 @@ RowLayout {
}
}
Button {
id: control
background: Rectangle {
implicitWidth: 20;
implicitHeight: 20;
radius: hifi.buttons.radius;
gradient: Gradient {
GradientStop {
position: 0.2;
color: audioLoopedBack ? hifi.buttons.colorStart[hifi.buttons.blue] : "#FFFFFF";
}
GradientStop {
position: 1.0;
color: audioLoopedBack ? hifi.buttons.colorFinish[hifi.buttons.blue] : "#AFAFAF";
}
}
}
contentItem: HiFiGlyphs {
size: 14;
color: (control.pressed || control.hovered) ? (audioLoopedBack ? "black" : hifi.colors.primaryHighlight) : "#404040";
text: audioLoopedBack ? hifi.glyphs.stop_square : hifi.glyphs.mic;
}
HifiControlsUit.Button {
text: audioLoopedBack ? qsTr("STOP TESTING YOUR VOICE") : qsTr("TEST YOUR VOICE");
color: audioLoopedBack ? hifi.buttons.red : hifi.buttons.blue;
onClicked: {
if (audioLoopedBack) {
loopbackTimer.stop();
@ -81,6 +61,7 @@ RowLayout {
Layout.leftMargin: 2;
size: 14;
color: "white";
text: audioLoopedBack ? qsTr("Stop testing your voice") : qsTr("Test your voice");
font.italic: true
text: audioLoopedBack ? qsTr("Speak in your input") : "";
}
}

View file

@ -14,7 +14,7 @@ import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import stylesUit 1.0
import controlsUit 1.0 as HifiControls
import controlsUit 1.0 as HifiControlsUit
RowLayout {
property var sound: null;
@ -55,32 +55,9 @@ RowLayout {
HifiConstants { id: hifi; }
Button {
id: control
background: Rectangle {
implicitWidth: 20;
implicitHeight: 20;
radius: hifi.buttons.radius;
gradient: Gradient {
GradientStop {
position: 0.2;
color: isPlaying ? hifi.buttons.colorStart[hifi.buttons.blue] : "#FFFFFF";
}
GradientStop {
position: 1.0;
color: isPlaying ? hifi.buttons.colorFinish[hifi.buttons.blue] : "#AFAFAF";
}
}
}
contentItem: HiFiGlyphs {
// absolutely position due to asymmetry in glyph
// x: isPlaying ? 0 : 1;
// y: 1;
size: 14;
color: (control.pressed || control.hovered) ? (isPlaying ? "black" : hifi.colors.primaryHighlight) : "#404040";
text: isPlaying ? hifi.glyphs.stop_square : hifi.glyphs.playback_play;
}
HifiControlsUit.Button {
text: isPlaying ? qsTr("STOP TESTING YOUR SOUND") : qsTr("TEST YOUR SOUND");
color: isPlaying ? hifi.buttons.red : hifi.buttons.blue;
onClicked: isPlaying ? stopSound() : playSound();
}
@ -88,7 +65,7 @@ RowLayout {
Layout.leftMargin: 2;
size: 14;
color: "white";
text: isPlaying ? qsTr("Stop sample sound") : qsTr("Play sample sound");
font.italic: true
text: isPlaying ? qsTr("Listen to your output") : "";
}
}