Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GuiProgressBar BORDER_WIDTH issue #459

Open
pmHaugen opened this issue Feb 7, 2025 · 0 comments
Open

GuiProgressBar BORDER_WIDTH issue #459

pmHaugen opened this issue Feb 7, 2025 · 0 comments

Comments

@pmHaugen
Copy link

pmHaugen commented Feb 7, 2025

This might be me just being confused. This is the first time I ever submit a issue on git, so im sorry if I failed to find existing information about this or if I did something wrong.

I am getting weird ProgressBar height issue when changing the BORDER_WIDTH. This is the only code I have that alters the style for PROGRESSBAR

GuiSetStyle(LABEL, TEXT, ColorToInt(BLACK));
GuiSetStyle(PROGRESSBAR, BORDER_COLOR_NORMAL, ColorToInt(BLACK));
GuiSetStyle(PROGRESSBAR, BORDER_COLOR_FOCUSED, ColorToInt(BLACK));
GuiSetStyle(PROGRESSBAR, BASE_COLOR_PRESSED, ColorToInt({74, 197, 53, 255}));
GuiSetStyle(PROGRESSBAR, BORDER_WIDTH, 10);
GuiSetStyle(PROGRESSBAR, PROGRESS_PADDING, 0);


GuiProgressBar(Rectangle{200.0f, static_cast<float>(GetRenderHeight())-350.0f, static_cast<float>(GetRenderWidth()/2)-400, 30.0f}, "Health", 
  TextFormat("%.0f", *HealthStat), HealthStat, 0.0f, 10000.0f);
GuiProgressBar(Rectangle{200.0f, static_cast<float>(GetRenderHeight())-300.0f, static_cast<float>(GetRenderWidth()/2)-400, 30.0f}, "Offence", 
  TextFormat("%.0f", *OffenceStat), OffenceStat, 0.0f, 1000.0f);
GuiProgressBar(Rectangle{200.0f, static_cast<float>(GetRenderHeight())-250.0f, static_cast<float>(GetRenderWidth()/2)-400, 30.0f}, "Defence", 
  TextFormat("%.0f", *DefenceStat), DefenceStat, 0.0f, 1000.0f);
GuiProgressBar(Rectangle{200.0f, static_cast<float>(GetRenderHeight())-200.0f, static_cast<float>(GetRenderWidth()/2)-400, 30.0f}, "Speed", 
  TextFormat("%.0f", *SpeedStat), SpeedStat, 0.0f, 1000.0f);
GuiProgressBar(Rectangle{200.0f, static_cast<float>(GetRenderHeight())-150.0f, static_cast<float>(GetRenderWidth()/2)-400, 30.0f}, "Brains", 
  TextFormat("%.0f", *BrainsStat), BrainsStat, 0.0f, 1000.0f);

And all the progressbar gets a weird shrinking in height. The more BORDER_WIDTH I have, the smaller the fill rectangle becomes and the border edges on the right gets offset weirdly. It also overflows the border on the right. The bar and border also shrinks on the right side when the bar is filled.
Image

I were able hack together something that works, probably not helpfull since it might have some bugs, but to display my point I submit it anyway

Image

// Progress Bar control extended, shows current progress value
int GuiProgressBar(Rectangle bounds, const char *textLeft, const char *textRight, float *value, float minValue, float maxValue)
{
    int result = 0;
    GuiState state = guiState;

    float temp = (maxValue - minValue)/2.0f;
    if (value == NULL) value = &temp;

    // Progress bar
    Rectangle progress = { bounds.x + GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) + GuiGetStyle(PROGRESSBAR, PROGRESS_PADDING),
                           bounds.y + GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) + GuiGetStyle(PROGRESSBAR, PROGRESS_PADDING),
                           0,
                           bounds.height - GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) - 2*GuiGetStyle(PROGRESSBAR, PROGRESS_PADDING) -1 };

    // Update control
    //--------------------------------------------------------------------
    if (*value > maxValue) *value = maxValue;

    // WARNING: Working with floats could lead to rounding issues
    progress.width = ((float)*value / (maxValue - minValue)) * (bounds.width - 2 * GuiGetStyle(PROGRESSBAR, BORDER_WIDTH));
    //--------------------------------------------------------------------

    // Draw control
    //--------------------------------------------------------------------
    if (state == STATE_DISABLED)
    {
        GuiDrawRectangle(bounds, GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), GetColor(GuiGetStyle(PROGRESSBAR, BORDER + (state*3))), BLANK);
    }
    else
    {
        if (*value > minValue)
        {
            // Draw progress bar with colored border, more visual
            // Top Bar
            GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x, bounds.y, (int)progress.width + (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_FOCUSED)));
            // Left Bar
            GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x, bounds.y + 1, (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.height - 2 }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_FOCUSED)));
            // Bottom Bar
            GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x, bounds.y + bounds.height - 1, (int)progress.width + (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_FOCUSED)));
        }
        else GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x, bounds.y, (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.height+GuiGetStyle(PROGRESSBAR, BORDER_WIDTH)-1 }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_NORMAL)));
                                // Right Bar
        if (*value >= maxValue) GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x + progress.width + (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.y, (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.height+GuiGetStyle(PROGRESSBAR, BORDER_WIDTH)-1}, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_FOCUSED)));
        else
        {
            // Draw borders not yet reached by value
            //Top Bar
            GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x + (int)progress.width + (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.y, bounds.width - (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) - (int)progress.width - 1, (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_NORMAL)));
            //Bottom Bar
            GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x + (int)progress.width + (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.y + bounds.height - 1, bounds.width - (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) - (int)progress.width - 1, (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH) }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_NORMAL)));
            // Right Bar
            GuiDrawRectangle(RAYGUI_CLITERAL(Rectangle){ bounds.x + bounds.width - (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.y, (float)GuiGetStyle(PROGRESSBAR, BORDER_WIDTH), bounds.height+GuiGetStyle(PROGRESSBAR, BORDER_WIDTH)-1 }, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BORDER_COLOR_NORMAL)));
        }

        // Draw slider internal progress bar (depends on state)
        progress.width -= 2*GuiGetStyle(PROGRESSBAR, PROGRESS_PADDING);
        GuiDrawRectangle(progress, 0, BLANK, GetColor(GuiGetStyle(PROGRESSBAR, BASE_COLOR_PRESSED)));
    }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant