commit cec8f61fa8b576e651b53280bab03c6027c47d05
parent 6f364d77c6c593f44c86bb77b337eb0e8c6aac69
Author: jatinchowdhury18 <jatinchowdhury18@gmail.com>
Date: Mon, 12 Apr 2021 18:49:33 -0700
iOS GUI updates (#183)
* Adjust UI layout for iOS
* Move presets menu to top bar for iOS
Diffstat:
3 files changed, 80 insertions(+), 46 deletions(-)
diff --git a/Plugin/Source/GUI/Assets/gui_ios.xml b/Plugin/Source/GUI/Assets/gui_ios.xml
@@ -32,7 +32,7 @@
background-image="Background_svg" image-placement="stretch">
<View max-height="80" padding="0" margin="0" background-color="">
<View margin="2" padding="" background-color="00000000" flex-direction="column"
- flex-grow="0.75">
+ flex-grow="0.45">
<View flex-grow="0.333" background-color="00000000"/>
<TitleComp background-color="00000000" title="Chow Tape Model" font="28"
padding="1" flex-grow="1.0"/>
@@ -40,6 +40,14 @@
padding="0" margin="5" border=""/>
<View background-color="00000000" flex-grow="0.33"/>
</View>
+ <View margin="2" padding="" background-color="00000000" flex-direction="column"
+ flex-grow="0.4">
+ <View flex-grow="0.15" background-color="00000000"/>
+ <presets margin="0" padding="0" background-color="00000000" border-color="33000000"
+ radius="" border="" lookAndFeel="PresetsLNF" flex-grow="0.25"
+ max-height="100"/>
+ <View flex-grow="0.15" background-color="00000000"/>
+ </View>
<Plot source="scope" plot-color="FFEAA92C" padding="0" background-color="33000000"
plot-decay="0.0" plot-fill-color="FFFFFFFF"/>
</View>
@@ -49,13 +57,19 @@
padding="0" tab-caption="Gain">
<Slider caption="Input Gain [dB]" parameter="ingain" class="Slider" name="Input Gain"
padding="0" margin="0" tooltip="Sets the input gain to the tape model in Decibels."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Dry/Wet" parameter="drywet" class="Slider" tooltip="Sets dry/wet mix of the entire plugin."
padding="0" margin="0" name="Dry/Wet" slider-track="FF0BBDC2"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Output Gain [dB]" parameter="outgain" class="Slider"
padding="0" margin="0" name="Output Gain" tooltip="Sets the output gain from the tape model in Decibels."/>
</View>
<View flex-direction="column" tab-color="" background-color="FF31323A"
padding="0" tab-caption="Filters" margin="0">
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
+ <PowerButton background-color="00000000" max-height="35" min-height="20" margin="0"
+ padding="0" button-color="ff595c6b" button-on-color="FFEAA92C"
+ parameter="ifilt_onoff" name="Filters On/Off" tooltip="Turns the pre-processing filters on or off."/>
<Slider caption="Low Cut" parameter="ifilt_low" class="Slider" name="Low Cut"
tooltip="Applies a low cut filter before applying tape processing."/>
<Slider caption="High Cut" parameter="ifilt_high" class="Slider" name="High Cut"
@@ -65,9 +79,6 @@
button-on-color="FFB41717" lookAndFeel="LookAndFeel_V3" name="Makeup"
tooltip="Adds the signal cut out by the cut filters back to the processed signal."
button-off-text="FFFFFFFF" button-on-text="FFFFFFFF"/>
- <PowerButton background-color="00000000" max-height="25" min-height="20" margin="0"
- padding="0" button-color="ff595c6b" button-on-color="FFEAA92C"
- parameter="ifilt_onoff" name="Filters On/Off" tooltip="Turns the pre-processing filters on or off."/>
</View>
</View>
<View margin="0" padding="0" flex-grow="0.07" background-color="00000000"/>
@@ -75,28 +86,34 @@
<View flex-direction="column" tab-color="" background-color="FF31323A"
padding="0" tab-caption="Tape" margin="0">
<View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
+ <PowerButton flex-grow="1.0" margin="0" padding="0" background-color="00000000"
+ button-on-color="FFEAA92C" min-height="20" max-height="35" button-color="ff595c6b"
+ parameter="hyst_onoff" name="Tape On/Off" tooltip="Turns the tape processing on or off."/>
<Slider caption="Bias" parameter="width" class="Slider" name="Bias" padding="0"
margin="0" tooltip="Controls the amount of bias used by the tape recorder. Turning down the bias can create "deadzone" distortion."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Saturation" parameter="sat" class="Slider" name="Saturation"
padding="0" margin="0" tooltip="Controls the amount of tape saturation applied to the signal."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Drive" parameter="drive" class="Slider" name="Drive"
padding="0" margin="0" tooltip="Controls the amount of amplification done during the tape magnetisation process. Note that unlike the "Input Gain", this amplification is highly nonlinear."/>
- <PowerButton flex-grow="1.0" margin="0" padding="0" background-color="00000000"
- button-on-color="FFEAA92C" min-height="20" max-height="25" button-color="ff595c6b"
- parameter="hyst_onoff" name="Tape On/Off" tooltip="Turns the tape processing on or off."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
</View>
<View flex-direction="column" tab-color="" background-color="FF31323A"
padding="0" tab-caption="Tone" margin="0">
<View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
+ <PowerButton max-height="35" min-height="20" margin="0" padding="0" background-color="00000000"
+ button-color="ff595c6b" button-on-color="FFEAA92C" parameter="tone_onoff"
+ name="Tone On/Off" tooltip="Turns the tone control processing on or off."/>
<Slider caption="Treble" parameter="h_treble" class="Slider" name="Treble"
padding="0" margin="0" tooltip="Controls the treble response of the pre/post-emphasis filters."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Bass" parameter="h_bass" class="Slider" name="Bass"
padding="0" margin="0" tooltip="Controls the bass response of the pre/post-emphasis filters."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Frequency" parameter="h_tfreq" class="Slider" name="Transition Frequency"
padding="0" margin="0" tooltip="Controls the transition frequency between the bass and treble sections of the EQ."/>
- <PowerButton max-height="25" min-height="20" margin="0" padding="0" background-color="00000000"
- button-color="ff595c6b" button-on-color="FFEAA92C" parameter="tone_onoff"
- name="Tone On/Off" tooltip="Turns the tone control processing on or off."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
</View>
</View>
<View margin="0" padding="0" flex-grow="0.07" background-color="00000000"/>
@@ -104,27 +121,35 @@
lookAndFeel="MyLNF">
<View flex-direction="column" tab-caption="Loss" tab-color="" background-color="FF31323A"
padding="0" margin="0">
+ <PowerButton margin="0" padding="0" background-color="00000000" max-height="32"
+ min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
+ parameter="loss_onoff" name="Loss On/Off" tooltip="Turns the loss filters on or off."/>
<Slider caption="Gap [microns]" parameter="gap" slider-type="linear-horizontal"
class="Slider" padding="0" slider-background="ff595c6b" slider-track="ff9cbcbd"
name="Gap" tooltip="Sets the width of the playhead gap. Certain frequencies that resonate with the gap width will be emphasized."
- slidertext-height="18" caption-placement="top-left"/>
+ slidertext-height="18" caption-placement="top-left" max-height="75"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Thickness [microns]" parameter="thick" class="Slider"
slider-type="linear-horizontal" padding="0" slider-background="ff595c6b"
slider-track="ff9cbcbd" name="Thickness" tooltip="Sets the thickness of the tape. Thicker tape has a more muted high-frequency response."
- caption-placement="top-left"/>
+ caption-placement="top-left" max-height="75"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Spacing [microns]" parameter="spacing" slider-type="linear-horizontal"
class="Slider" padding="0" slider-background="ff595c6b" slider-track="ff9cbcbd"
name="Spacing" tooltip="Sets the spacing between the tape and the playhead. A larger spacing means more high frequency signal is lost during playback."
- caption-placement="top-left"/>
+ caption-placement="top-left" max-height="75"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Azimuth [degrees]" parameter="azimuth" slider-type="linear-horizontal"
class="Slider" padding="0" slider-background="ff595c6b" slider-track="ff9cbcbd"
name="Azimuth" tooltip="Sets the azimuth angle between the playhead and the tape. This can create a stereo widening effect at higher tape speeds."
- caption-placement="top-left"/>
+ caption-placement="top-left" max-height="75"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Speed [ips]" parameter="speed" slider-type="linear-horizontal"
class="Slider" padding="0" slider-background="ff595c6b" slider-track="ff9cbcbd"
name="Speed" tooltip="Sets the speed of the tape as it affects the playhead loss effects. Note that this control does not affect the wow/flutter processing."
- caption-placement="top-left"/>
- <View flex-grow="0.53" margin="0" padding="2" background-color="00000000">
+ caption-placement="top-left" max-height="75"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
+ <View flex-grow="0.53" margin="0" padding="2" background-color="00000000" max-height="50" min-height="10">
<TextButton margin="0" padding="2" text="3.75" button-color="00000000" background-color="00000000"
onClick="set_speed_3.75" lookAndFeel="SpeedButtonLNF" button-on-color="00000000"
name="3.75 ips" tooltip="Snaps the tape speed to 3.75 inches per second."/>
@@ -138,13 +163,13 @@
lookAndFeel="SpeedButtonLNF" text="30" button-color="00000000"
button-on-color="00000000" name="30 ips" tooltip="Snaps the tape speed to 30 inches per second."/>
</View>
- <View flex-grow="0.01" background-color="00000000"/>
- <PowerButton margin="0" padding="0" background-color="00000000" max-height="25"
- min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
- parameter="loss_onoff" name="Loss On/Off" tooltip="Turns the loss filters on or off."/>
+ <View flex-grow="0.02" background-color="00000000"/>
</View>
<View tab-caption="Degrade" padding="0" flex-direction="column" background-color="FF31323A"
margin="0">
+ <PowerButton margin="0" padding="0" background-color="00000000" max-height="32"
+ min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
+ parameter="deg_onoff" name="Degrade On/Off" tooltip="Turns the degradation processing on or off."/>
<View flex-direction="column" max-height="140" background-color="FF1E1F22"
flex-grow="2.0" flex-shrink="2.0" padding="0">
<View max-height="5"/>
@@ -172,63 +197,71 @@
margin="0" tooltip="Sets the amount of amplitude envelope applied to the tape degradation. At 0, the degradation will have no envelope."
slider-type="linear-horizontal" max-height="70"/>
<View margin="0" padding="0" flex-grow="0.15" background-color="00000000"/>
- <PowerButton margin="0" padding="0" background-color="00000000" max-height="25"
- min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
- parameter="deg_onoff" name="Degrade On/Off" tooltip="Turns the degradation processing on or off."/>
</View>
<View tab-caption="CHEW" padding="0" flex-direction="column" background-color="FF31323A"
margin="0">
+ <PowerButton margin="0" padding="0" background-color="00000000" max-height="32"
+ min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
+ parameter="chew_onoff" name="Chew On/Off" tooltip="Turns the chew processing on or off."/>
<View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
<Slider parameter="chew_depth" caption="Depth" padding="0" margin="0"
class="Slider" name="Chew Depth" tooltip="Controls how intensely the tape has been chewed up."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Frequency" parameter="chew_freq" padding="0" margin="0"
class="Slider" name="Chew Frequency" tooltip="Controls the amount of time in between chewed-up sections of tape."/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Variance" parameter="chew_var" padding="0" margin="0"
class="Slider" name="Chew Variance" tooltip="Controls the amount of variance in the chew frequency."/>
- <PowerButton margin="0" padding="0" background-color="00000000" max-height="25"
- min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
- parameter="chew_onoff" name="Chew On/Off" tooltip="Turns the chew processing on or off."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
</View>
</View>
<View margin="0" padding="0" flex-grow="0.07" background-color="00000000"/>
<View display="tabbed" padding="0" margin="2" background-color="FF31323A" lookAndFeel="MyLNF">
<View tab-caption="Flutter" flex-direction="column" background-color="FF31323A">
+ <PowerButton margin="0" padding="0" background-color="00000000" max-height="32"
+ min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
+ parameter="flutter_onoff" name="Wow/Flutter On/Off" tooltip="Turns the wow and flutter processing on or off."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
<FlutterMenu margin="0" padding="0" background-color="00000000"
- max-height="30" name="Flutter Sync" tooltip="Snaps the flutter rate to a synchronized value."/>
- <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
+ max-height="35" name="Flutter Sync" tooltip="Snaps the flutter rate to a synchronized value."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
<Slider caption="Depth" parameter="depth" max-height="150" class="Slider"
name="Flutter Depth" tooltip="Sets depth of the tape flutter."
margin="0" padding="0"/>
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
<Slider caption="Rate" parameter="rate" class="Slider" max-height="150"
name="Flutter Rate" tooltip="Sets the rate of the tape flutter."
margin="0" padding="0"/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
<Plot source="flutter" plot-decay="0.8" background-color="FF1E1F22"
flex-grow="0.8" plot-color="FFEAA92C" plot-fill-color="CC8B3232"/>
- <PowerButton margin="0" padding="0" background-color="00000000" max-height="25"
- min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
- parameter="flutter_onoff" name="Wow/Flutter On/Off" tooltip="Turns the wow and flutter processing on or off."/>
</View>
<View tab-caption="Wow" flex-direction="column" background-color="FF31323A" padding="0" margin="3">
+ <PowerButton margin="0" padding="0" background-color="00000000" max-height="32"
+ min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
+ parameter="flutter_onoff" name="Wow/Flutter On/Off" tooltip="Turns the wow and flutter processing on or off."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
<WowMenu margin="0" padding="0" background-color="00000000"
- max-height="30" name="Wow Sync" tooltip="Snaps the wow rate to a synchronized value."/>
- <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
- <Slider caption="Depth" parameter="wow_depth" max-height="150" class="Slider"
+ max-height="35" name="Wow Sync" tooltip="Snaps the wow rate to a synchronized value."/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
+ <Slider caption="Depth" parameter="wow_depth" max-height="65" class="Slider"
name="Wow Depth" tooltip="Sets the depth of the tape wow." margin="0"
padding="0" slider-type="linear-horizontal"/>
- <Slider caption="Rate" parameter="wow_rate" class="Slider" max-height="150"
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
+ <Slider caption="Rate" parameter="wow_rate" class="Slider" max-height="65"
name="Wow Rate" tooltip="Sets the rate of the tape wow." margin="0"
padding="0" slider-type="linear-horizontal"/>
- <Slider caption="Variance" parameter="wow_var" class="Slider" max-height="150"
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
+ <Slider caption="Variance" parameter="wow_var" class="Slider" max-height="65"
name="Wow Variance" tooltip="Sets the amount of variance in the tape wow." margin="0"
padding="0" slider-type="linear-horizontal"/>
- <Slider caption="Drift" parameter="wow_drift" class="Slider" max-height="150"
+ <View margin="0" padding="0" flex-grow="0.1" background-color="00000000"/>
+ <Slider caption="Drift" parameter="wow_drift" class="Slider" max-height="65"
name="Wow Drift" tooltip="Sets the amount of drift in the tape wow." margin="0"
padding="0" slider-type="linear-horizontal"/>
+ <View margin="0" padding="0" flex-grow="0.05" background-color="00000000"/>
<Plot source="wow" plot-decay="0.8" flex-grow="1.45" background-color="FF1E1F22"
- plot-color="FFEAA92C" plot-fill-color="CC8B3232"/>
- <PowerButton margin="0" padding="0" background-color="00000000" max-height="25"
- min-height="20" button-color="ff595c6b" button-on-color="FFEAA92C"
- parameter="flutter_onoff" name="Wow/Flutter On/Off" tooltip="Turns the wow and flutter processing on or off."/>
+ plot-color="FFEAA92C" plot-fill-color="CC8B3232" max-height="250"/>
</View>
</View>
</View>
@@ -250,9 +283,6 @@
margin="0" parameter="mix_group" combo-background="00000000"
tooltip="Adds this plugin to a mix group. When the plugin is added to a group, the group parameters will be copied to this plugin, and their parameters will remain in sync."/>
<MixGroupViz flex-grow="0.3" margin="5" padding="0" background-color="00000000"/>
- <presets margin="5" padding="0" background-color="00000000" border-color="595C6B"
- radius="" border="" lookAndFeel="PresetsLNF" flex-grow="1.9"
- max-height="100"/>
</View>
</View>
</magic>
diff --git a/Plugin/Source/GUI/ScrollView.cpp b/Plugin/Source/GUI/ScrollView.cpp
@@ -19,7 +19,7 @@ ScrollView::ScrollView (foleys::MagicGUIBuilder& builder, ValueTree node)
void ScrollView::resized()
{
viewport.setBounds (getLocalBounds());
- baseView.setSize (getWidth() - viewport.getScrollBarThickness(), jmax (420, getHeight()));
+ baseView.setSize (getWidth() - viewport.getScrollBarThickness(), jmax (465, getHeight()));
}
void ScrollView::update()
diff --git a/Plugin/Source/Presets/PresetComp.cpp b/Plugin/Source/Presets/PresetComp.cpp
@@ -10,11 +10,15 @@ PresetComp::PresetComp (ChowtapeModelAudioProcessor& proc, PresetManager& manage
presetBox.setName ("Preset Manager");
presetBox.setTooltip ("Use this menu to select presets, and to save and manage user presets.");
+#if JUCE_IOS
+ setColour (backgroundColourId, Colour (0x33000000));
+#else
setColour (backgroundColourId, Colour (0xFF595C6B));
+#endif
setColour (textColourId, Colours::white);
addAndMakeVisible (presetBox);
- presetBox.setColour (ComboBox::ColourIds::backgroundColourId, Colours::transparentWhite);
+ presetBox.setColour (ComboBox::backgroundColourId, Colours::transparentWhite);
presetBox.setJustificationType (Justification::centred);
presetBox.setTextWhenNothingSelected ("No Preset selected...");
loadPresetChoices();
