Debug Tools and Scrollable widget

This commit is contained in:
IlyaShurupov 2024-10-18 15:18:50 +03:00
parent f68f91f7d5
commit 458e56fb4c
27 changed files with 274 additions and 103 deletions

View file

@ -10,8 +10,8 @@ target_link_libraries(${PROJECT_NAME} PUBLIC Math Graphics Imgui)
### -------------------------- Applications -------------------------- ###
add_executable(Widgets2Example examples/Example.cpp)
target_link_libraries(Widgets2Example ${PROJECT_NAME} ${GLEW_LIB})
target_include_directories(Widgets2Example PUBLIC ../Externals/glfw/include ${GLEW_INCLUDE_DIR})
add_executable(WidgetsExample examples/Example.cpp)
target_link_libraries(WidgetsExample ${PROJECT_NAME} ${GLEW_LIB})
target_include_directories(WidgetsExample PUBLIC ../Externals/glfw/include ${GLEW_INCLUDE_DIR})
file(COPY "examples/Font.ttf" DESTINATION "${CMAKE_BINARY_DIR}/${PROJECT_NAME}/")

View file

@ -50,23 +50,18 @@ public:
}
void exampleScrolling() {
static Widget widget;
static Widget content;
static ScrollableWidget widget;
static ButtonWidget buttons[10];
static ScrollableBarWidget scrollBar;
// widget.setDirection(false);
setRoot(&widget);
widget.addChild(&scrollBar);
widget.addChild(&content);
for (auto& button : buttons) {
content.addChild(&button);
widget.getContainer()->addChild(&button);
}
widget.setLayout(new ScrollableLayout(&widget));
RootWidget::setWidgetArea(content, { 333, 333, 522, 522 });
RootWidget::setWidgetArea(*widget.getContainer(), { 333, 333, 522, 522 });
}
void examplePopup() {

View file

@ -8,6 +8,8 @@
using namespace tp;
#define SAMPLE(label, scope) gDebugWidget.##label.addSample(TimerWrapper([&]() scope ).exec());
WidgetLayout* WidgetManagerInterface::defaultLayout(Widget* widget) {
return new BasicLayout(widget);
}
@ -35,21 +37,23 @@ void RootWidget::setRootWidget(Widget* widget) {
void RootWidget::processFrame(EventHandler* events, const RectF& screenArea) {
mRoot.setArea(screenArea);
if (!gDebugWidget.update(this, *events)) return;
gDebugWidget.mUpdManager.addSample(TimerWrapper([&]() {
// construct hierarchy tree of widgets to process
mUpdateManager.updateTreeToProcess(&mRoot);
// construct hierarchy tree of widgets to process
mUpdateManager.updateTreeToProcess(&mRoot);
updateAnimations();
updateAreaCache(&mRoot, true);
updateAnimations();
updateAreaCache(&mRoot, true);
// update all events and call all event processing callbacks
mUpdateManager.processWidgets(&mRoot, *events);
// update all events and call all event processing callbacks
mUpdateManager.processWidgets(&mRoot, *events);
updateAreaCache(&mRoot, true);
}).exec());
updateAreaCache(&mRoot, true);
// update widget sizes base on individual size policies
mLayoutManager.adjust(&mRoot);
gDebugWidget.mLayManager.addSample(TimerWrapper([&]() {
// update widget sizes base on individual size policies
mLayoutManager.adjust(&mRoot);
}).exec());
updateAreaCache(&mRoot, false);
@ -67,13 +71,9 @@ bool RootWidget::needsUpdate() const {
void RootWidget::drawFrame(Canvas& canvas) {
canvas.rect(mRoot.getAreaT(), RGBA(0, 0, 0, 1));
drawRecursion(canvas, &mRoot, { 0, 0 });
gDebugWidget.drawDebug(this, canvas);
}
void RootWidget::drawRecursion(Canvas& canvas, Widget* active, const Vec2F& pos) {
if (!active->mFlags.get(ENABLED)) return;
@ -81,7 +81,9 @@ void RootWidget::drawRecursion(Canvas& canvas, Widget* active, const Vec2F& pos)
canvas.pushClamp({ pos, active->getArea().size });
if (canvas.getClampedArea().size.length2() > EPSILON) {
active->draw(canvas);
if (active->getArea().sizeVecW() > active->getArea().pos) {
active->draw(canvas);
}
for (auto child = active->mDepthOrder.lastNode(); child; child = child->prev) {
drawRecursion(canvas, child->data, pos + child->data->getArea().pos);
@ -152,4 +154,3 @@ void RootWidget::closePopup(Widget* widget) {
void RootWidget::lockFocus(Widget* widget) { mUpdateManager.lockFocus(widget); }
void RootWidget::freeFocus(Widget* widget) { mUpdateManager.freeFocus(widget); }
bool RootWidget::isDebug() const { return gDebugWidget.isDebug(); }

View file

@ -5,6 +5,58 @@
using namespace tp;
void WidgetApplication::debugUI() {
ImGui::Text("Proc ms : %i", (int) mProcTime);
ImGui::SameLine(); ImGui::Text("Draw ms : %i", (int) mDrawTime);
// pass
}
void WidgetApplication::setRoot(Widget* widget) {
mRootWidget.setRootWidget(widget);
tp::RootWidget::setWidgetArea(*widget, {{}, mWindow->getSize()});
}
void WidgetApplication::processFrame(EventHandler* eventHandler, halnf deltaTime) {
const auto area = RectF({ 0, 0 }, mWindow->getSize());
gDebugWidget.update(&mRootWidget, *eventHandler);
if (gDebugWidget.isDebug()) {
mGuiArea = area.splitByFactorHL(mDebugSplitFactor);
mDebugArea = area.splitByFactorHR(mDebugSplitFactor);
} else {
mGuiArea = area;
}
if (gDebugWidget.isFrozen()) return;
Timer timer;
mRootWidget.processFrame(eventHandler, mGuiArea);
gDebugWidget.mProcTime.addSample(timer.timePassed());
}
void WidgetApplication::drawFrame(Canvas* canvas) {
Timer timer;
mRootWidget.drawFrame(*canvas);
gDebugWidget.mDrawTime.addSample(timer.timePassed());
if (gDebugWidget.isDebug()) {
ImGui::SetNextWindowPos(ImVec2(mDebugArea.x, mDebugArea.y));
ImGui::SetNextWindowSize(ImVec2(mDebugArea.z, mDebugArea.w));
if (ImGui::Begin(
"Existing Window Name",
nullptr,
ImGuiWindowFlags_NoCollapse | ImGuiWindowFlags_NoResize | ImGuiWindowFlags_NoDecoration
)) {
drawDebug();
debugUI();
gDebugWidget.drawDebug(&mRootWidget, *canvas);
}
ImGui::End();
}
}
bool WidgetApplication::forceNewFrame() {
return mRootWidget.needsUpdate();
}

View file

@ -61,6 +61,8 @@ void DockLayout::toggleWidgetVisibility(Side side) {
void DockLayout::calculateSideAreas() {
auto startArea = getArea().relative();
if (startArea.size.x <= 0 || startArea.size.y <= 0) return;
for (auto& sideWidget : mSideWidgets) {
const auto side = sideWidget.order;
@ -99,11 +101,13 @@ void DockLayout::calculateResizeHandles() {
RectF area = getArea().relative();
for (auto& sideWidget : mSideWidgets) {
if (!sideWidget.widget) continue;
auto& sideSize = sideWidget.absoluteSize;
auto& resizeHandle = sideWidget.resizeHandle;
if (resizeHandle.end < mSideSizePadding * 2) {
sideSize = resizeHandle.end / 2.f;
// sideSize = resizeHandle.end / 2.f;
} else {
sideSize = clamp(sideSize, resizeHandle.start + mSideSizePadding, resizeHandle.end - mSideSizePadding);
}

View file

@ -30,9 +30,9 @@ void ScrollableLayout::updateWidgetRects(const RectF& area, Widget* content, Scr
auto sizeFactor = (area.size[dir] / content->getLayout()->getArea().size[dir]);
auto splitFactor = 1 - ((sizeFactor > 1.f) ? 0 : mScrollerSize / area.size[!dir]);
auto holderArea = area.splitByFactorHL(splitFactor);
auto holderArea = dir ? area.splitByFactorHL(splitFactor) : area.splitByFactorVT(splitFactor);
auto contentArea = content->getLayout()->getArea();
auto scrollerArea = area.splitByFactorHR(splitFactor);
auto scrollerArea = dir ? area.splitByFactorHR(splitFactor) : area.splitByFactorVB(splitFactor);
scroller->updateSizeFactor(sizeFactor);

View file

@ -3,28 +3,26 @@
#include "BasicLayout.hpp"
#include "imgui.h"
#include "implot.h"
#include <sstream>
using namespace tp;
DebugManager tp::gDebugWidget;
#define LIST_SIZE { -FLT_MIN, 150 }
#define LIST_SIZE \
{ -FLT_MIN, 150 }
bool DebugManager::update(RootWidget* rootWidget, EventHandler& events) {
void DebugManager::update(RootWidget* rootWidget, EventHandler& events) {
mRootWidget = rootWidget;
events.setEnableKeyEvents(true);
if (events.isPressed(InputID::D)) mDebug = !mDebug;
if (mDebug) {
auto area = rootWidget->mRoot.getAreaT();
area.size -= { 400, 0 };
rootWidget->mRoot.setArea(area);
events.setEnableKeyEvents(true);
if (events.isPressed(InputID::K)) mDebugStopProcessing = !mDebugStopProcessing;
if (mDebugStopProcessing) return false;
if (auto widget = rootWidget->mUpdateManager.mInFocusWidget) {
if (auto lay = dynamic_cast<BasicLayout*>(widget->getLayout())) {
@ -49,8 +47,6 @@ bool DebugManager::update(RootWidget* rootWidget, EventHandler& events) {
if (events.isPressed(InputID::L)) mLayBreakpoints.insert(breakWidget);
}
}
return true;
}
void DebugManager::drawDebug(RootWidget* rootWidget, Canvas& canvas) {
@ -60,20 +56,24 @@ void DebugManager::drawDebug(RootWidget* rootWidget, Canvas& canvas) {
return;
}
drawPerformance();
// ImGui::Checkbox("Draw debug", &mDebug);
ImGui::SameLine(); ImGui::Text("To Toggle processing press k");
ImGui::SameLine();
ImGui::Text("To Toggle processing press k");
auto& upd = rootWidget->mUpdateManager;
recursiveDraw(canvas, &rootWidget->mRoot, { 0, 0 }, 0);
ImGui::Text("Triggered: %i", (int) upd.mTriggeredWidgets.size());
ImGui::SameLine(); ImGui::Text("Processing: %i", upd.mDebugWidgetsToProcess);
ImGui::SameLine();
ImGui::Text("Processing: %i", upd.mDebugWidgetsToProcess);
ImGui::Checkbox("Stop processing", &mDebugStopProcessing);
ImGui::SameLine(); ImGui::Checkbox("Force new frames", &mDebugRedrawAlways);
ImGui::SameLine(); ImGui::Checkbox("Slow-mo", &mSlowMotion);
ImGui::SameLine();
ImGui::Checkbox("Force new frames", &mDebugRedrawAlways);
ImGui::SameLine();
ImGui::Checkbox("Detailed", &mDetailed);
if (upd.mInFocusWidget) {
ImGui::Text("Under cursor");
@ -87,17 +87,21 @@ void DebugManager::drawDebug(RootWidget* rootWidget, Canvas& canvas) {
}
}
ImGui::Text("Triggered");
{
if (ImGui::BeginListBox("##triggered", LIST_SIZE)) {
for (auto widget : upd.mTriggeredWidgets) {
widgetMenu(widget.first);
if (mDetailed) {
ImGui::Text("Triggered");
{
if (ImGui::BeginListBox("##triggered", LIST_SIZE)) {
for (auto widget : upd.mTriggeredWidgets) {
widgetMenu(widget.first);
}
ImGui::EndListBox();
}
ImGui::EndListBox();
}
}
drawLayoutOrder();
drawLayoutOrder();
recursiveDraw(canvas, &rootWidget->mRoot, { 0, 0 }, 0);
}
}
void DebugManager::recursiveDraw(Canvas& canvas, Widget* active, const Vec2F& pos, int depthOrder) {
@ -174,4 +178,14 @@ void DebugManager::drawLayoutOrder() {
}
ImGui::EndListBox();
}
}
void DebugManager::drawPerformance() {
if (ImPlot::BeginPlot("Per Frame Time")) {
ImPlot::PlotLine("Proc ms", mProcTime.get(), mProcTime.size());
ImPlot::PlotLine("Draw ms", mDrawTime.get(), mDrawTime.size());
ImPlot::PlotLine("UPD ms", mUpdManager.get(), mUpdManager.size());
ImPlot::PlotLine("LAY ms", mLayManager.get(), mLayManager.size());
ImPlot::EndPlot();
}
}

View file

@ -33,7 +33,11 @@ void LayoutManager::findDependencies(Widget* root) {
Widget::dfs(root, [this](Widget* widget) { mDepGraph.insert({ widget, {} }); });
for (auto& [widget, deps] : mDepGraph) {
if (!widget->isUpdate()) continue;
for (auto child : widget->mChildren) {
if (!child->isUpdate()) continue;
mDepGraph.insert({ child, {} });
if (auto depOrder = getLayoutOrder(widget->getLayout(), child->getLayout())) {

View file

@ -80,9 +80,11 @@ void DockWidget::process(const EventHandler& events) {
if (events.isPressed(InputID::MOUSE1)) {
if (layout()->startResize(events.getPointer())) {
triggerWidgetUpdate("dock layout resizing");
lockFocus();
}
} else if (events.isReleased(InputID::MOUSE1)) {
layout()->endResize();
freeFocus();
}
if (layout()->isResizing()) {

View file

@ -1,4 +1,6 @@
#include "ScrollableWidget.hpp"
#include "ScrollableLayout.hpp"
#include "BasicLayout.hpp"
using namespace tp;
@ -84,4 +86,21 @@ void ScrollableBarWidget::updateHandleRect() {
const RectF& ScrollableBarWidget::getHandleRect() const {
return mHandleRect;
}
}
ScrollableWidget::ScrollableWidget() {
addChild(&mScroller);
addChild(&mContent);
setLayout(new ScrollableLayout(this));
mContent.setSizePolicy(SizePolicy::Minimal, SizePolicy::Minimal);
}
void ScrollableWidget::setDirection(bool direction) {
if (auto lay = dynamic_cast<BasicLayout*>(mContent.getLayout())) {
lay->setLayoutPolicy(direction ? LayoutPolicy::Vertical : LayoutPolicy::Horizontal);
}
mScroller.setDirection(direction);
}

View file

@ -61,7 +61,7 @@ namespace tp {
protected:
Vec2<SizePolicy> mSizePolicy = { SizePolicy::Fixed, SizePolicy::Fixed };
Vec2F mMinSize = { 50, 50 };
Vec2F mMinSize = { 30, 30 };
Vec2F mMaxSize = { FLT_MAX / 2, FLT_MAX / 2 };
private:

View file

@ -18,8 +18,6 @@ namespace tp {
void setRootWidget(Widget* widget);
static void setWidgetArea(Widget& widget, const RectF& rect);
[[nodiscard]] bool isDebug() const;
// Graphic Application Interface
public:
void processFrame(EventHandler* events, const RectF& screenArea);

View file

@ -9,41 +9,24 @@ namespace tp {
public:
WidgetApplication() = default;
void setRoot(Widget* widget) {
mRootWidget.setRootWidget(widget);
}
void setRoot(Widget* widget);
private:
void processFrame(EventHandler* eventHandler, halnf deltaTime) override {
const auto rec = RectF({ 0, 0 }, mWindow->getSize());
void processFrame(EventHandler* eventHandler, halnf deltaTime) override;
Timer timer;
mRootWidget.processFrame(eventHandler, rec);
mProcTime = timer.timePassed();
}
void drawFrame(Canvas* canvas) override {
Timer timer;
mRootWidget.drawFrame(*canvas);
mDrawTime = timer.timePassed();
if (mRootWidget.isDebug()) {
drawDebug();
debugUI();
}
}
bool forceNewFrame() override {
return mRootWidget.needsUpdate();
}
void drawFrame(Canvas* canvas) override;
bool forceNewFrame() override ;
private:
void debugUI();
private:
time_ms mProcTime = 0;
time_ms mDrawTime = 0;
halnf mDebugSplitFactor = 0.7;
RootWidget mRootWidget;
private:
RectF mGuiArea;
RectF mDebugArea;
};
}

View file

@ -96,7 +96,7 @@ namespace tp {
bool mResizing = false;
Widget* mCenterWidget = nullptr;
RectF mCenterArea {};
RectF mCenterArea { 0, 0, 10, 10 };
// Parameters
const halnf mHandleSplitFactor = 0.3;

View file

@ -5,12 +5,56 @@
#include <set>
namespace tp {
class DebugTimeline {
enum {
STEP = 10,
LEN = 200,
};
public:
DebugTimeline() = default;
void addSample(time_ms time) {
samples[end] = time;
start++;
end++;
shift();
}
[[nodiscard]] int size() const {
return LEN - STEP;
}
[[nodiscard]] const time_ms* get() const {
return samples + start;
}
private:
void shift() {
if (end >= LEN) {
for (ualni i = STEP; i < LEN; i++) {
samples[i - STEP] = samples[i];
}
start = 0;
end = LEN - STEP;
}
}
private:
ualni start = 0;
ualni end = LEN - STEP;
time_ms samples[LEN + 1] {};
};
class DebugManager {
public:
DebugManager() = default;
bool isRedrawAlways() const { return mDebugRedrawAlways; }
bool update(RootWidget* rootWidget, EventHandler& events);
[[nodiscard]] bool isFrozen() const { return mDebugStopProcessing; }
[[nodiscard]] bool isRedrawAlways() const { return mDebugRedrawAlways; }
void update(RootWidget* rootWidget, EventHandler& events);
void drawDebug(RootWidget* rootWidget, Canvas& canvas);
void checkProcBreakPoints(Widget* widget) {
@ -32,6 +76,7 @@ namespace tp {
private:
void recursiveDraw(Canvas& canvas, Widget* active, const Vec2F& pos, int depthOrder);
void drawPerformance();
static void widgetMenu(Widget*);
void drawLayoutOrder();
@ -42,10 +87,17 @@ namespace tp {
bool mDebug = false;
bool mDebugStopProcessing = false;
bool mDebugRedrawAlways = false;
bool mSlowMotion = false;
bool mDetailed = false;
std::set<Widget*> mProcBreakpoints;
std::set<Widget*> mLayBreakpoints;
public:
DebugTimeline mProcTime;
DebugTimeline mUpdManager;
DebugTimeline mLayManager;
DebugTimeline mDrawTime;
};
extern DebugManager gDebugWidget;

View file

@ -20,6 +20,8 @@ namespace tp {
[[nodiscard]] bool getDirection() const { return mVertical; }
[[nodiscard]] halnf getPosFactor() const { return mPosFactor - mSizeFactor / 2; }
void setDirection(bool direction) { mVertical = direction; }
private:
[[nodiscard]] const RectF& getHandleRect() const;
void updateHandleRect();
@ -53,5 +55,13 @@ namespace tp {
class ScrollableWidget : public Widget {
public:
ScrollableWidget();
void setDirection(bool direction);
Widget* getContainer() { return &mContent; }
private:
Widget mContent;
ScrollableBarWidget mScroller;
};
}

View file

@ -71,7 +71,7 @@ namespace tp {
void draw(Canvas& canvas) override;
[[nodiscard]] bool processesEvents() const override { return true; }
[[nodiscard]] bool needsNextFrame() const override { return mState != SLIDING; }
[[nodiscard]] bool needsNextFrame() const override { return mState != IDLE; }
[[nodiscard]] halnf val() const { return mFactor; }