Massively overhaul the entire interface colours to make it look similar to legacy osci-render

pull/170/head
James Ball 2023-07-28 21:10:21 +01:00
rodzic 9293214943
commit 5a7124cc80
17 zmienionych plików z 260 dodań i 48 usunięć

Wyświetl plik

@ -39,7 +39,7 @@ EffectsComponent::~EffectsComponent() {
}
void EffectsComponent::resized() {
auto area = getLocalBounds().reduced(20);
auto area = getLocalBounds().withTrimmedTop(20).reduced(20);
frequency.setBounds(area.removeFromTop(30));
area.removeFromTop(6);

Wyświetl plik

@ -0,0 +1,154 @@
#include "LookAndFeel.h"
OscirenderLookAndFeel::OscirenderLookAndFeel() {
setColour(juce::Slider::thumbColourId, Colours::veryDark);
setColour(juce::Slider::textBoxOutlineColourId, juce::Colours::white);
setColour(juce::Slider::textBoxBackgroundColourId, Colours::veryDark);
setColour(juce::Slider::textBoxHighlightColourId, Colours::accentColor.withMultipliedAlpha(0.5));
setColour(juce::Slider::trackColourId, juce::Colours::grey);
setColour(juce::Slider::backgroundColourId, Colours::dark);
setColour(sliderThumbOutlineColourId, juce::Colours::white);
setColour(juce::ToggleButton::tickDisabledColourId, juce::Colours::white);
setColour(juce::ResizableWindow::backgroundColourId, Colours::dark);
setColour(groupComponentBackgroundColourId, Colours::darker);
setColour(groupComponentHeaderColourId, Colours::veryDark);
setColour(juce::PopupMenu::backgroundColourId, Colours::veryDark);
setColour(juce::PopupMenu::highlightedBackgroundColourId, Colours::darker);
setColour(juce::ComboBox::backgroundColourId, Colours::veryDark);
setColour(juce::ComboBox::outlineColourId, juce::Colours::white);
setColour(juce::ComboBox::arrowColourId, juce::Colours::white);
setColour(juce::TextButton::buttonColourId, Colours::veryDark);
setColour(juce::TextEditor::backgroundColourId, Colours::veryDark);
setColour(juce::TextEditor::outlineColourId, juce::Colours::white);
setColour(juce::ListBox::backgroundColourId, Colours::darker);
setColour(juce::ScrollBar::thumbColourId, juce::Colours::white);
setColour(juce::ScrollBar::trackColourId, Colours::veryDark);
setColour(juce::ScrollBar::backgroundColourId, Colours::veryDark);
setColour(effectComponentBackgroundColourId, juce::Colours::transparentBlack);
setColour(effectComponentHandleColourId, Colours::veryDark);
getCurrentColourScheme().setUIColour(ColourScheme::widgetBackground, Colours::veryDark);
}
void OscirenderLookAndFeel::drawComboBox(juce::Graphics& g, int width, int height, bool, int, int, int, int, juce::ComboBox& box) {
juce::Rectangle<int> boxBounds{0, 0, width, height};
g.setColour(box.findColour(juce::ComboBox::backgroundColourId));
g.fillRect(boxBounds.toFloat());
g.setColour(box.findColour(juce::ComboBox::outlineColourId));
g.drawRect(boxBounds.toFloat().reduced(0.5f, 0.5f), 1.0f);
juce::Rectangle<int> arrowZone{width - 15, 0, 10, height};
juce::Path path;
path.startNewSubPath((float)arrowZone.getX(), (float)arrowZone.getCentreY() - 3.0f);
path.lineTo((float)arrowZone.getCentreX(), (float)arrowZone.getCentreY() + 4.0f);
path.lineTo((float)arrowZone.getRight(), (float)arrowZone.getCentreY() - 3.0f);
path.closeSubPath();
g.setColour(box.findColour(juce::ComboBox::arrowColourId).withAlpha((box.isEnabled() ? 0.9f : 0.2f)));
g.fillPath(path);
}
void OscirenderLookAndFeel::positionComboBoxText(juce::ComboBox& box, juce::Label& label) {
label.setBounds(1, 1, box.getWidth() - 15, box.getHeight() - 2);
label.setFont(getComboBoxFont(box));
}
void OscirenderLookAndFeel::drawTickBox(juce::Graphics& g, juce::Component& component,
float x, float y, float w, float h,
const bool ticked,
const bool isEnabled,
const bool shouldDrawButtonAsHighlighted,
const bool shouldDrawButtonAsDown) {
juce::Rectangle<float> tickBounds(x, y, w, h);
g.setColour(component.findColour(juce::TextButton::buttonColourId));
g.fillRect(tickBounds);
g.setColour(component.findColour(juce::ToggleButton::tickDisabledColourId));
g.drawRect(tickBounds, 1.0f);
if (ticked) {
g.setColour(component.findColour(juce::ToggleButton::tickColourId));
auto tick = getTickShape(0.75f);
g.fillPath(tick, tick.getTransformToScaleToFit(tickBounds.reduced(4, 5).toFloat(), false));
}
}
void OscirenderLookAndFeel::drawGroupComponentOutline(juce::Graphics& g, int width, int height, const juce::String& text, const juce::Justification& position, juce::GroupComponent& group) {
auto bounds = group.getLocalBounds();
const float textH = 15.0f;
const float indent = 3.0f;
const float textEdgeGap = 4.0f;
auto cs = 5.0f;
juce::Font f(textH);
juce::Path p;
auto x = indent;
auto y = f.getAscent() - 3.0f;
auto w = juce::jmax(0.0f, (float)width - x * 2.0f);
auto h = juce::jmax(0.0f, (float)height - y - indent);
cs = juce::jmin(cs, w * 0.5f, h * 0.5f);
auto cs2 = 2.0f * cs;
auto textW = text.isEmpty() ? 0
: juce::jlimit(0.0f,
juce::jmax(0.0f, w - cs2 - textEdgeGap * 2),
(float)f.getStringWidth(text) + textEdgeGap * 2.0f);
auto textX = cs + textEdgeGap;
if (position.testFlags(juce::Justification::horizontallyCentred))
textX = cs + (w - cs2 - textW) * 0.5f;
else if (position.testFlags(juce::Justification::right))
textX = w - cs - textW - textEdgeGap;
auto alpha = group.isEnabled() ? 1.0f : 0.5f;
g.setColour(group.findColour(groupComponentBackgroundColourId).withMultipliedAlpha(alpha));
g.fillRect(bounds);
auto header = bounds.removeFromTop(2 * textH);
g.setColour(group.findColour(groupComponentHeaderColourId).withMultipliedAlpha(alpha));
g.fillRect(header);
g.setColour(group.findColour(juce::GroupComponent::textColourId).withMultipliedAlpha(alpha));
g.setFont(f);
g.drawText(text,
juce::roundToInt(header.getX() + x + textX), header.getY() + 7,
juce::roundToInt(textW),
juce::roundToInt(textH),
juce::Justification::centred, true
);
}
void OscirenderLookAndFeel::drawLinearSlider(juce::Graphics& g, int x, int y, int width, int height, float sliderPos, float minSliderPos, float maxSliderPos, const juce::Slider::SliderStyle style, juce::Slider& slider) {
juce::LookAndFeel_V4::drawLinearSlider(g, x, y, width, height, sliderPos, minSliderPos, maxSliderPos, style, slider);
auto kx = slider.isHorizontal() ? sliderPos : ((float)x + (float)width * 0.5f);
auto ky = slider.isHorizontal() ? ((float)y + (float)height * 0.5f) : sliderPos;
juce::Point<float> point = { kx, ky };
auto thumbWidth = getSliderThumbRadius(slider);
g.setColour(slider.findColour(sliderThumbOutlineColourId));
g.drawEllipse(juce::Rectangle<float>(static_cast<float>(thumbWidth), static_cast<float>(thumbWidth)).withCentre(point), 1.0f);
}
void OscirenderLookAndFeel::drawButtonBackground(juce::Graphics& g, juce::Button& button, const juce::Colour& backgroundColour, bool shouldDrawButtonAsHighlighted, bool shouldDrawButtonAsDown) {
auto bounds = button.getLocalBounds().toFloat().reduced(0.5f, 0.5f);
auto baseColour = backgroundColour.withMultipliedSaturation(button.hasKeyboardFocus(true) ? 1.3f : 0.9f)
.withMultipliedAlpha(button.isEnabled() ? 1.0f : 0.5f);
if (shouldDrawButtonAsDown || shouldDrawButtonAsHighlighted)
baseColour = baseColour.contrasting(shouldDrawButtonAsDown ? 0.2f : 0.05f);
g.setColour(baseColour);
g.fillRect(bounds);
g.setColour(button.findColour(juce::ComboBox::outlineColourId));
g.drawRect(bounds, 1.0f);
}

Wyświetl plik

@ -0,0 +1,46 @@
#pragma once
#include <JuceHeader.h>
enum ColourIds {
groupComponentBackgroundColourId,
groupComponentHeaderColourId,
effectComponentBackgroundColourId,
effectComponentHandleColourId,
sliderThumbOutlineColourId,
};
namespace Colours {
const juce::Colour dark{0xff424242};
const juce::Colour darker{0xff212121};
const juce::Colour veryDark{0xff111111};
const juce::Colour grey{0xff555555};
const juce::Colour accentColor{0xff00CC00};
}
class OscirenderLookAndFeel : public juce::LookAndFeel_V4 {
public:
OscirenderLookAndFeel();
void drawComboBox(juce::Graphics& g, int width, int height, bool, int, int, int, int, juce::ComboBox& box) override;
void positionComboBoxText(juce::ComboBox& box, juce::Label& label) override;
void drawTickBox(juce::Graphics& g, juce::Component& component,
float x, float y, float w, float h,
const bool ticked,
const bool isEnabled,
const bool shouldDrawButtonAsHighlighted,
const bool shouldDrawButtonAsDown) override;
void drawGroupComponentOutline(juce::Graphics&, int w, int h, const juce::String &text, const juce::Justification&, juce::GroupComponent&) override;
void drawLinearSlider(juce::Graphics& g, int x, int y, int width, int height,
float sliderPos,
float minSliderPos,
float maxSliderPos,
const juce::Slider::SliderStyle style, juce::Slider& slider) override;
void drawButtonBackground(juce::Graphics& g,
juce::Button& button,
const juce::Colour& backgroundColour,
bool shouldDrawButtonAsHighlighted,
bool shouldDrawButtonAsDown) override;
};

Wyświetl plik

@ -13,6 +13,6 @@ LuaComponent::~LuaComponent() {
}
void LuaComponent::resized() {
auto area = getLocalBounds().reduced(20);
auto area = getLocalBounds().withTrimmedTop(20).reduced(20);
sliders.setBounds(area);
}

Wyświetl plik

@ -108,7 +108,7 @@ void MainComponent::updateFileLabel() {
}
void MainComponent::resized() {
auto bounds = getLocalBounds().reduced(20);
auto bounds = getLocalBounds().withTrimmedTop(20).reduced(20);
auto buttonWidth = 120;
auto buttonHeight = 30;
auto padding = 10;
@ -136,3 +136,11 @@ void MainComponent::resized() {
auto minDim = juce::jmin(bounds.getWidth(), bounds.getHeight());
visualiser.setBounds(bounds.withSizeKeepingCentre(minDim, minDim));
}
void MainComponent::paint(juce::Graphics& g) {
juce::GroupComponent::paint(g);
// add drop shadow to the visualiser
auto dc = juce::DropShadow(juce::Colours::black, 30, juce::Point<int>(0, 0));
dc.drawForRectangle(g, visualiser.getBounds());
}

Wyświetl plik

@ -14,6 +14,7 @@ public:
~MainComponent() override;
void resized() override;
void paint(juce::Graphics& g) override;
void updateFileLabel();
private:
OscirenderAudioProcessor& audioProcessor;

Wyświetl plik

@ -98,7 +98,7 @@ void ObjComponent::disableMouseRotation() {
}
void ObjComponent::resized() {
auto area = getLocalBounds().reduced(20);
auto area = getLocalBounds().withTrimmedTop(20).reduced(20);
double rowHeight = 30;
focalLength.setBounds(area.removeFromTop(rowHeight));
rotateX.setBounds(area.removeFromTop(rowHeight));

Wyświetl plik

@ -42,12 +42,24 @@ OscirenderAudioProcessorEditor::OscirenderAudioProcessorEditor(OscirenderAudioPr
audioProcessor.broadcaster.addChangeListener(this);
}
if (audioProcessor.wrapperType == juce::AudioProcessor::WrapperType::wrapperType_Standalone) {
if (juce::TopLevelWindow::getNumTopLevelWindows() == 1) {
juce::TopLevelWindow* w = juce::TopLevelWindow::getTopLevelWindow(0);
w->setColour(juce::ResizableWindow::backgroundColourId, Colours::veryDark);
}
}
juce::Desktop::getInstance().setDefaultLookAndFeel(&lookAndFeel);
setLookAndFeel(&lookAndFeel);
setSize(1100, 750);
setResizable(true, true);
setResizeLimits(500, 400, 999999, 999999);
}
OscirenderAudioProcessorEditor::~OscirenderAudioProcessorEditor() {
setLookAndFeel(nullptr);
juce::Desktop::getInstance().setDefaultLookAndFeel(nullptr);
juce::MessageManagerLock lock;
audioProcessor.broadcaster.removeChangeListener(this);
}
@ -67,6 +79,16 @@ void OscirenderAudioProcessorEditor::initialiseCodeEditors() {
void OscirenderAudioProcessorEditor::paint(juce::Graphics& g) {
g.fillAll(getLookAndFeel().findColour(juce::ResizableWindow::backgroundColourId));
juce::DropShadow ds(juce::Colours::black, 10, juce::Point<int>(0, 0));
ds.drawForRectangle(g, main.getBounds());
ds.drawForRectangle(g, effects.getBounds());
if (lua.isVisible()) {
ds.drawForRectangle(g, lua.getBounds());
}
if (obj.isVisible()) {
ds.drawForRectangle(g, obj.getBounds());
}
g.setColour(juce::Colours::white);
g.setFont(15.0f);
}
@ -110,13 +132,15 @@ void OscirenderAudioProcessorEditor::resized() {
}
auto effectsSection = area.removeFromRight(1.2 * getWidth() / sections);
main.setBounds(area);
main.setBounds(area.reduced(5));
if (lua.isVisible() || obj.isVisible()) {
auto altEffectsSection = effectsSection.removeFromBottom(juce::jmin(effectsSection.getHeight() / 2, 300));
lua.setBounds(altEffectsSection);
obj.setBounds(altEffectsSection);
lua.setBounds(altEffectsSection.reduced(5));
obj.setBounds(altEffectsSection.reduced(5));
}
effects.setBounds(effectsSection);
effects.setBounds(effectsSection.reduced(5));
repaint();
}
void OscirenderAudioProcessorEditor::addCodeEditor(int index) {

Wyświetl plik

@ -8,6 +8,7 @@
#include "ObjComponent.h"
#include "components/VolumeComponent.h"
#include "components/MainMenuBarModel.h"
#include "LookAndFeel.h"
class OscirenderAudioProcessorEditor : public juce::AudioProcessorEditor, private juce::CodeDocument::Listener, public juce::AsyncUpdater, public juce::ChangeListener {
@ -34,6 +35,8 @@ public:
void updateTitle();
std::atomic<bool> editingPerspective = false;
OscirenderLookAndFeel lookAndFeel;
private:
OscirenderAudioProcessor& audioProcessor;

Wyświetl plik

@ -597,7 +597,8 @@ bool OscirenderAudioProcessor::hasEditor() const {
}
juce::AudioProcessorEditor* OscirenderAudioProcessor::createEditor() {
return new OscirenderAudioProcessorEditor (*this);
auto editor = new OscirenderAudioProcessorEditor(*this);
return editor;
}
//==============================================================================

Wyświetl plik

@ -1,4 +1,5 @@
#include "EffectComponent.h"
#include "../LookAndFeel.h"
EffectComponent::EffectComponent(OscirenderAudioProcessor& p, Effect& effect, int index) : effect(effect), index(index), audioProcessor(p) {
addAndMakeVisible(slider);
@ -15,8 +16,6 @@ EffectComponent::EffectComponent(OscirenderAudioProcessor& p, Effect& effect, in
lfo.addItem("Reverse Sawtooth", static_cast<int>(LfoType::ReverseSawtooth));
lfo.addItem("Noise", static_cast<int>(LfoType::Noise));
lfo.setLookAndFeel(&lfoLookAndFeel);
effect.addListener(index, this);
setupComponent();
}
@ -75,7 +74,7 @@ void EffectComponent::setupComponent() {
lfoSlider.setSliderStyle(juce::Slider::LinearHorizontal);
lfoSlider.setTextBoxStyle(juce::Slider::TextBoxRight, false, 70, lfoSlider.getTextBoxHeight());
lfoSlider.setTextValueSuffix("Hz");
lfoSlider.setColour(juce::Slider::thumbColourId, juce::Colour(0xff00ff00));
lfoSlider.setColour(sliderThumbOutlineColourId, juce::Colour(0xff00ff00));
lfoSlider.onValueChange = [this]() {
effect.parameters[index]->lfoRate->setUnnormalisedValueNotifyingHost(lfoSlider.getValue());
@ -142,7 +141,7 @@ void EffectComponent::resized() {
}
void EffectComponent::paint(juce::Graphics& g) {
g.fillAll(juce::Colours::black);
g.fillAll(findColour(effectComponentBackgroundColourId));
g.setColour(juce::Colours::white);
g.drawText(effect.parameters[index]->name, textBounds, juce::Justification::left);
}

Wyświetl plik

@ -4,34 +4,6 @@
#include "../audio/Effect.h"
#include "LabelledTextBox.h"
class SmallComboBoxArrow : public juce::LookAndFeel_V4 {
void drawComboBox(juce::Graphics& g, int width, int height, bool, int, int, int, int, juce::ComboBox& box) override {
auto cornerSize = box.findParentComponentOfClass<juce::ChoicePropertyComponent>() != nullptr ? 0.0f : 3.0f;
juce::Rectangle<int> boxBounds{0, 0, width, height};
g.setColour(box.findColour(juce::ComboBox::backgroundColourId));
g.fillRoundedRectangle(boxBounds.toFloat(), cornerSize);
g.setColour(box.findColour(juce::ComboBox::outlineColourId));
g.drawRoundedRectangle(boxBounds.toFloat().reduced(0.5f, 0.5f), cornerSize, 1.0f);
juce::Rectangle<int> arrowZone{width - 15, 0, 10, height};
juce::Path path;
path.startNewSubPath((float) arrowZone.getX(), (float) arrowZone.getCentreY() - 3.0f);
path.lineTo((float) arrowZone.getCentreX(), (float) arrowZone.getCentreY() + 4.0f);
path.lineTo((float) arrowZone.getRight(), (float) arrowZone.getCentreY() - 3.0f);
path.closeSubPath();
g.setColour(box.findColour(juce::ComboBox::arrowColourId).withAlpha((box.isEnabled() ? 0.9f : 0.2f)));
g.fillPath(path);
}
void positionComboBoxText(juce::ComboBox& box, juce::Label& label) {
label.setBounds(1, 1, box.getWidth() - 15, box.getHeight() - 2);
label.setFont(getComboBoxFont(box));
}
};
class EffectComponent : public juce::Component, public juce::AudioProcessorParameter::Listener, juce::AsyncUpdater {
public:
EffectComponent(OscirenderAudioProcessor& p, Effect& effect, int index);
@ -55,7 +27,6 @@ public:
Effect& effect;
int index;
juce::ToggleButton selected;
SmallComboBoxArrow lfoLookAndFeel;
juce::ComboBox lfo;
private:

Wyświetl plik

@ -43,7 +43,7 @@ EffectsListComponent::~EffectsListComponent() {}
void EffectsListComponent::paint(juce::Graphics& g) {
auto bounds = getLocalBounds();
g.fillAll(juce::Colours::darkgrey);
g.fillAll(findColour(effectComponentHandleColourId));
g.setColour(juce::Colours::white);
bounds.removeFromLeft(20);
// draw drag and drop handle using circles

Wyświetl plik

@ -27,6 +27,7 @@ void VisualiserComponent::setColours(juce::Colour bk, juce::Colour fg) {
void VisualiserComponent::paint(juce::Graphics& g) {
g.fillAll(backgroundColour);
g.drawRect(getLocalBounds(), 1);
auto r = getLocalBounds().toFloat();
auto minDim = juce::jmin(r.getWidth(), r.getHeight());

Wyświetl plik

@ -125,5 +125,6 @@ void VolumeComponent::resized() {
volumeIcon->setTransformToFit(iconRow.removeFromLeft(iconRow.getWidth() / 2).reduced(1), juce::RectanglePlacement::centred);
thresholdIcon->setTransformToFit(iconRow.reduced(2), juce::RectanglePlacement::centred);
volumeSlider.setBounds(r.removeFromLeft(r.getWidth() / 2));
thresholdSlider.setBounds(r);
auto radius = volumeSlider.getLookAndFeel().getSliderThumbRadius(volumeSlider);
thresholdSlider.setBounds(r.reduced(0, radius / 2));
}

Wyświetl plik

@ -3,8 +3,9 @@
#include <JuceHeader.h>
#include "../concurrency/BufferConsumer.h"
#include "../PluginProcessor.h"
#include "../LookAndFeel.h"
class ThumbRadiusLookAndFeel : public juce::LookAndFeel_V4 {
class ThumbRadiusLookAndFeel : public OscirenderLookAndFeel {
public:
ThumbRadiusLookAndFeel(int thumbRadius) : thumbRadius(thumbRadius) {}
@ -26,7 +27,7 @@ public:
float ky = sliderPos;
auto outlineThickness = slider.isEnabled() ? 0.8f : 0.3f;
auto sliderRadius = (float) (getSliderThumbRadius(slider) - 2);
auto sliderRadius = (float) getSliderThumbRadius(slider);
auto diameter = sliderRadius * 2.0f;
auto halfThickness = outlineThickness * 0.5f;
@ -49,7 +50,7 @@ public:
g.setColour(knobColour);
g.fillPath(p);
g.setColour(knobColour.brighter());
g.setColour(slider.findColour(sliderThumbOutlineColourId));
g.strokePath(p, juce::PathStrokeType(outlineThickness));
}
@ -79,7 +80,7 @@ private:
ThumbRadiusLookAndFeel thumbRadiusLookAndFeel{20};
juce::Slider volumeSlider;
ThresholdLookAndFeel thresholdLookAndFeel{20};
ThresholdLookAndFeel thresholdLookAndFeel{7};
juce::Slider thresholdSlider;
std::unique_ptr<juce::Drawable> volumeIcon;

Wyświetl plik

@ -301,6 +301,8 @@
</GROUP>
<FILE id="uyOdTl" name="LegacyProject.cpp" compile="1" resource="0"
file="Source/LegacyProject.cpp"/>
<FILE id="d2zFqF" name="LookAndFeel.cpp" compile="1" resource="0" file="Source/LookAndFeel.cpp"/>
<FILE id="TJDqWs" name="LookAndFeel.h" compile="0" resource="0" file="Source/LookAndFeel.h"/>
<GROUP id="{75F6236A-68A5-85DA-EDAE-23D1621601DB}" name="lua">
<FILE id="X5i9iw" name="lapi.c" compile="1" resource="0" file="Source/lua/lapi.c"/>
<FILE id="J62WSE" name="lapi.h" compile="0" resource="0" file="Source/lua/lapi.h"/>