git subrepo clone --branch=sono6good https://github.com/essej/JUCE.git deps/juce
subrepo: subdir: "deps/juce" merged: "b13f9084e" upstream: origin: "https://github.com/essej/JUCE.git" branch: "sono6good" commit: "b13f9084e" git-subrepo: version: "0.4.3" origin: "https://github.com/ingydotnet/git-subrepo.git" commit: "2f68596"
This commit is contained in:
essej
320
deps/juce/examples/GUI/FlexBoxDemo.h
vendored
Normal file
320
deps/juce/examples/GUI/FlexBoxDemo.h
vendored
Normal file
@ -0,0 +1,320 @@
|
||||
/*
|
||||
==============================================================================
|
||||
|
||||
This file is part of the JUCE examples.
|
||||
Copyright (c) 2020 - Raw Material Software Limited
|
||||
|
||||
The code included in this file is provided under the terms of the ISC license
|
||||
http://www.isc.org/downloads/software-support-policy/isc-license. Permission
|
||||
To use, copy, modify, and/or distribute this software for any purpose with or
|
||||
without fee is hereby granted provided that the above copyright notice and
|
||||
this permission notice appear in all copies.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS" WITHOUT ANY WARRANTY, AND ALL WARRANTIES,
|
||||
WHETHER EXPRESSED OR IMPLIED, INCLUDING MERCHANTABILITY AND FITNESS FOR
|
||||
PURPOSE, ARE DISCLAIMED.
|
||||
|
||||
==============================================================================
|
||||
*/
|
||||
|
||||
/*******************************************************************************
|
||||
The block below describes the properties of this PIP. A PIP is a short snippet
|
||||
of code that can be read by the Projucer and used to generate a JUCE project.
|
||||
|
||||
BEGIN_JUCE_PIP_METADATA
|
||||
|
||||
name: FlexBoxDemo
|
||||
version: 1.0.0
|
||||
vendor: JUCE
|
||||
website: http://juce.com
|
||||
description: Responsive layouts using FlexBox.
|
||||
|
||||
dependencies: juce_core, juce_data_structures, juce_events, juce_graphics,
|
||||
juce_gui_basics
|
||||
exporters: xcode_mac, vs2019, linux_make, androidstudio, xcode_iphone
|
||||
|
||||
moduleFlags: JUCE_STRICT_REFCOUNTEDPOINTER=1
|
||||
|
||||
type: Component
|
||||
mainClass: FlexBoxDemo
|
||||
|
||||
useLocalCopy: 1
|
||||
|
||||
END_JUCE_PIP_METADATA
|
||||
|
||||
*******************************************************************************/
|
||||
|
||||
#pragma once
|
||||
|
||||
#include "../Assets/DemoUtilities.h"
|
||||
|
||||
//==============================================================================
|
||||
struct DemoFlexPanel : public Component
|
||||
{
|
||||
DemoFlexPanel (Colour col, FlexItem& item)
|
||||
: flexItem (item), colour (col)
|
||||
{
|
||||
int x = 70;
|
||||
int y = 3;
|
||||
|
||||
setupTextEditor (flexOrderEditor, { x, y, 20, 18 }, "0", [this] { flexItem.order = (int) flexOrderEditor.getText().getFloatValue(); });
|
||||
addLabel ("order", flexOrderEditor);
|
||||
y += 20;
|
||||
|
||||
setupTextEditor (flexGrowEditor, { x, y, 20, 18 }, "0", [this] { flexItem.flexGrow = flexGrowEditor.getText().getFloatValue(); });
|
||||
addLabel ("flex-grow", flexGrowEditor);
|
||||
y += 20;
|
||||
|
||||
setupTextEditor (flexShrinkEditor, { x, y, 20, 18 }, "1", [this] { flexItem.flexShrink = flexShrinkEditor.getText().getFloatValue(); });
|
||||
addLabel ("flex-shrink", flexShrinkEditor);
|
||||
y += 20;
|
||||
|
||||
setupTextEditor (flexBasisEditor, { x, y, 33, 18 }, "100", [this] { flexItem.flexBasis = flexBasisEditor.getText().getFloatValue(); });
|
||||
addLabel ("flex-basis", flexBasisEditor);
|
||||
y += 20;
|
||||
|
||||
alignSelfCombo.addItem ("auto", 1);
|
||||
alignSelfCombo.addItem ("flex-start", 2);
|
||||
alignSelfCombo.addItem ("flex-end", 3);
|
||||
alignSelfCombo.addItem ("center", 4);
|
||||
alignSelfCombo.addItem ("stretch", 5);
|
||||
|
||||
alignSelfCombo.setBounds (x, y, 90, 18);
|
||||
alignSelfCombo.onChange = [this] { updateAssignSelf(); };
|
||||
alignSelfCombo.setSelectedId (5);
|
||||
alignSelfCombo.setColour (ComboBox::outlineColourId, Colours::transparentBlack);
|
||||
addAndMakeVisible (alignSelfCombo);
|
||||
addLabel ("align-self", alignSelfCombo);
|
||||
}
|
||||
|
||||
void setupTextEditor (TextEditor& te, Rectangle<int> b, StringRef initialText, std::function<void()> updateFn)
|
||||
{
|
||||
te.setBounds (b);
|
||||
te.setText (initialText);
|
||||
|
||||
te.onTextChange = [this, updateFn]
|
||||
{
|
||||
updateFn();
|
||||
refreshLayout();
|
||||
};
|
||||
|
||||
addAndMakeVisible (te);
|
||||
}
|
||||
|
||||
void addLabel (const String& name, Component& target)
|
||||
{
|
||||
auto label = new Label (name, name);
|
||||
label->attachToComponent (&target, true);
|
||||
labels.add (label);
|
||||
addAndMakeVisible (label);
|
||||
}
|
||||
|
||||
void updateAssignSelf()
|
||||
{
|
||||
switch (alignSelfCombo.getSelectedId())
|
||||
{
|
||||
case 1: flexItem.alignSelf = FlexItem::AlignSelf::autoAlign; break;
|
||||
case 2: flexItem.alignSelf = FlexItem::AlignSelf::flexStart; break;
|
||||
case 3: flexItem.alignSelf = FlexItem::AlignSelf::flexEnd; break;
|
||||
case 4: flexItem.alignSelf = FlexItem::AlignSelf::center; break;
|
||||
case 5: flexItem.alignSelf = FlexItem::AlignSelf::stretch; break;
|
||||
default: break;
|
||||
}
|
||||
|
||||
refreshLayout();
|
||||
}
|
||||
|
||||
void refreshLayout()
|
||||
{
|
||||
if (auto parent = getParentComponent())
|
||||
parent->resized();
|
||||
}
|
||||
|
||||
void paint (Graphics& g) override
|
||||
{
|
||||
auto r = getLocalBounds();
|
||||
|
||||
g.setColour (colour);
|
||||
g.fillRect (r);
|
||||
|
||||
g.setColour (Colours::black);
|
||||
g.drawFittedText ("w: " + String (r.getWidth()) + newLine + "h: " + String (r.getHeight()),
|
||||
r.reduced (4), Justification::bottomRight, 2);
|
||||
}
|
||||
|
||||
void lookAndFeelChanged() override
|
||||
{
|
||||
flexOrderEditor .applyFontToAllText (flexOrderEditor .getFont());
|
||||
flexGrowEditor .applyFontToAllText (flexGrowEditor .getFont());
|
||||
flexShrinkEditor.applyFontToAllText (flexShrinkEditor.getFont());
|
||||
flexBasisEditor .applyFontToAllText (flexBasisEditor .getFont());
|
||||
}
|
||||
|
||||
FlexItem& flexItem;
|
||||
|
||||
TextEditor flexOrderEditor, flexGrowEditor, flexShrinkEditor, flexBasisEditor;
|
||||
ComboBox alignSelfCombo;
|
||||
|
||||
Colour colour;
|
||||
OwnedArray<Label> labels;
|
||||
|
||||
JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR (DemoFlexPanel)
|
||||
|
||||
};
|
||||
|
||||
//==============================================================================
|
||||
struct FlexBoxDemo : public juce::Component
|
||||
{
|
||||
FlexBoxDemo()
|
||||
{
|
||||
setupPropertiesPanel();
|
||||
setupFlexBoxItems();
|
||||
|
||||
setSize (1000, 500);
|
||||
}
|
||||
|
||||
void resized() override
|
||||
{
|
||||
flexBox.performLayout (getFlexBoxBounds());
|
||||
}
|
||||
|
||||
Rectangle<float> getFlexBoxBounds() const
|
||||
{
|
||||
return getLocalBounds().withTrimmedLeft (300)
|
||||
.reduced (10)
|
||||
.toFloat();
|
||||
}
|
||||
|
||||
void paint (Graphics& g) override
|
||||
{
|
||||
g.fillAll (getUIColourIfAvailable (LookAndFeel_V4::ColourScheme::UIColour::windowBackground,
|
||||
Colours::lightgrey));
|
||||
g.setColour (Colours::white);
|
||||
g.fillRect (getFlexBoxBounds());
|
||||
}
|
||||
|
||||
void setupPropertiesPanel()
|
||||
{
|
||||
auto directionGroup = addControl (new GroupComponent ("direction", "flex-direction"));
|
||||
directionGroup->setBounds (10, 30, 140, 110);
|
||||
|
||||
int i = 0;
|
||||
int groupID = 1234;
|
||||
int leftMargin = 15;
|
||||
int topMargin = 45;
|
||||
|
||||
createToggleButton ("row", groupID, leftMargin, topMargin + i++ * 22, true, [this] { flexBox.flexDirection = FlexBox::Direction::row; }).setToggleState (true, dontSendNotification);
|
||||
createToggleButton ("row-reverse", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.flexDirection = FlexBox::Direction::rowReverse; });
|
||||
createToggleButton ("column", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.flexDirection = FlexBox::Direction::column; });
|
||||
createToggleButton ("column-reverse", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.flexDirection = FlexBox::Direction::columnReverse; });
|
||||
|
||||
auto wrapGroup = addControl (new GroupComponent ("wrap", "flex-wrap"));
|
||||
wrapGroup->setBounds (160, 30, 140, 110);
|
||||
|
||||
i = 0;
|
||||
++groupID;
|
||||
leftMargin = 165;
|
||||
|
||||
createToggleButton ("nowrap", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.flexWrap = FlexBox::Wrap::noWrap; });
|
||||
createToggleButton ("wrap", groupID, leftMargin, topMargin + i++ * 22, true, [this] { flexBox.flexWrap = FlexBox::Wrap::wrap; });
|
||||
createToggleButton ("wrap-reverse", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.flexWrap = FlexBox::Wrap::wrapReverse; });
|
||||
|
||||
auto justifyGroup = addControl (new GroupComponent ("justify", "justify-content"));
|
||||
justifyGroup->setBounds (10, 150, 140, 140);
|
||||
|
||||
i = 0;
|
||||
++groupID;
|
||||
leftMargin = 15;
|
||||
topMargin = 165;
|
||||
|
||||
createToggleButton ("flex-start", groupID, leftMargin, topMargin + i++ * 22, true, [this] { flexBox.justifyContent = FlexBox::JustifyContent::flexStart; });
|
||||
createToggleButton ("flex-end", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.justifyContent = FlexBox::JustifyContent::flexEnd; });
|
||||
createToggleButton ("center", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.justifyContent = FlexBox::JustifyContent::center; });
|
||||
createToggleButton ("space-between", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.justifyContent = FlexBox::JustifyContent::spaceBetween; });
|
||||
createToggleButton ("space-around", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.justifyContent = FlexBox::JustifyContent::spaceAround; });
|
||||
|
||||
auto alignGroup = addControl (new GroupComponent ("align", "align-items"));
|
||||
alignGroup->setBounds (160, 150, 140, 140);
|
||||
|
||||
i = 0;
|
||||
++groupID;
|
||||
leftMargin = 165;
|
||||
topMargin = 165;
|
||||
|
||||
createToggleButton ("stretch", groupID, leftMargin, topMargin + i++ * 22, true, [this] { flexBox.alignItems = FlexBox::AlignItems::stretch; });
|
||||
createToggleButton ("flex-start", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignItems = FlexBox::AlignItems::flexStart; });
|
||||
createToggleButton ("flex-end", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignItems = FlexBox::AlignItems::flexEnd; });
|
||||
createToggleButton ("center", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignItems = FlexBox::AlignItems::center; });
|
||||
|
||||
auto alignContentGroup = addControl (new GroupComponent ("content", "align-content"));
|
||||
alignContentGroup->setBounds (10, 300, 140, 160);
|
||||
|
||||
i = 0;
|
||||
++groupID;
|
||||
leftMargin = 15;
|
||||
topMargin = 315;
|
||||
|
||||
createToggleButton ("stretch", groupID, leftMargin, topMargin + i++ * 22, true, [this] { flexBox.alignContent = FlexBox::AlignContent::stretch; });
|
||||
createToggleButton ("flex-start", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignContent = FlexBox::AlignContent::flexStart; });
|
||||
createToggleButton ("flex-end", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignContent = FlexBox::AlignContent::flexEnd; });
|
||||
createToggleButton ("center", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignContent = FlexBox::AlignContent::center; });
|
||||
createToggleButton ("space-between", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignContent = FlexBox::AlignContent::spaceBetween; });
|
||||
createToggleButton ("space-around", groupID, leftMargin, topMargin + i++ * 22, false, [this] { flexBox.alignContent = FlexBox::AlignContent::spaceAround; });
|
||||
}
|
||||
|
||||
void setupFlexBoxItems()
|
||||
{
|
||||
addItem (Colours::orange);
|
||||
addItem (Colours::aqua);
|
||||
addItem (Colours::lightcoral);
|
||||
addItem (Colours::aquamarine);
|
||||
addItem (Colours::forestgreen);
|
||||
}
|
||||
|
||||
void addItem (Colour colour)
|
||||
{
|
||||
flexBox.items.add (FlexItem (100, 150)
|
||||
.withMargin (10)
|
||||
.withWidth (200));
|
||||
|
||||
auto& flexItem = flexBox.items.getReference (flexBox.items.size() - 1);
|
||||
|
||||
auto panel = panels.add (new DemoFlexPanel (colour, flexItem));
|
||||
flexItem.associatedComponent = panel;
|
||||
addAndMakeVisible (panel);
|
||||
}
|
||||
|
||||
ToggleButton& createToggleButton (StringRef text, int groupID, int x, int y, bool toggleOn, std::function<void()> fn)
|
||||
{
|
||||
auto* tb = buttons.add (new ToggleButton());
|
||||
tb->setButtonText (text);
|
||||
tb->setRadioGroupId (groupID);
|
||||
tb->setToggleState (toggleOn, dontSendNotification);
|
||||
|
||||
tb->onClick = [this, fn]
|
||||
{
|
||||
fn();
|
||||
resized();
|
||||
};
|
||||
|
||||
tb->setBounds (x, y, 130, 22);
|
||||
addAndMakeVisible (tb);
|
||||
return *tb;
|
||||
}
|
||||
|
||||
template <typename ComponentType>
|
||||
ComponentType* addControl (ComponentType* newControlComp)
|
||||
{
|
||||
controls.add (newControlComp);
|
||||
addAndMakeVisible (newControlComp);
|
||||
return newControlComp;
|
||||
}
|
||||
|
||||
FlexBox flexBox;
|
||||
|
||||
OwnedArray<DemoFlexPanel> panels;
|
||||
OwnedArray<Component> controls;
|
||||
OwnedArray<ToggleButton> buttons;
|
||||
|
||||
JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR (FlexBoxDemo)
|
||||
};
|
||||
Reference in New Issue
Block a user