StyleBoxFlat more customisable

[toger5]

StyleBoxFlat is limited in some ways at the moment.

Issue
Especially with the nowadays UI's having simple flat designs a huge amount could be achieved with StyleBoxFlat. Currently a lot of things need to be done with textures although it's super simple.

proposed features
If all these values could be changed would be great!

roundedTL: Float (radius)
roundedTR: Float (radius)
roundedBL: Float (radius)
roundedBR: Float (radius)
ColourTL: Color
ColourTR: Color
ColourBL: Color
ColourBR: Color
WidthTL: Float 
WidthTR: Float 
WidthBL: Float 
WidthBR: Float 
fillColour: Color

It would allow to almost make the whole theme based on flat style box's. It also allows for much better prototyping for game devs. without going to gimp and create small pngs for a button.

How we to Implement?

	GDCLASS(StyleBoxFlat, StyleBox);

//new: colors for each border
	Color bg_color;
	Colour colorTL;
        Colour colorTR;
        Colour colorBR;
        Colour colorBL;

	int border_size;
	int additional_border_size[4];
//new: radius for each border
        int corner_radius[4];
	bool draw_center;
	bool blend;

protected:
	virtual float get_style_margin(Margin p_margin) const;
	static void _bind_methods();

public:
//new setters for color
	void set_bg_color(const Color &p_color);
	void set_colorTL(const Color &p_color);
	void set_colorTR(const Color &p_color);
        void set_colorBL(const Color &p_color);
        void set_colorBR(const Color &p_color);
//new getters for color
	Color get_bg_color() const;
	Color get_colorTL() const;
	Color get_colorTR() const;
        Color get_colorBL() const;
        Color get_colorBR() const;

	void set_border_size(int p_size);
	int get_border_size() const;

	void _set_additional_border_size(Margin p_margin, int p_size);
	int _get_additional_border_size(Margin p_margin) const;

//could be dropped for performance reasons
	void set_border_blend(bool p_blend);
	bool get_border_blend() const;

//new different setter and getter
	void set_corner_radius(int radius);
	void set_corner_radius_TL(int radius);
	void set_corner_radius_TR(int radius);
	void set_corner_radius_BR(int radius);
	void set_corner_radius_BL(int radius);
	void set_corner_radius(int radius_top_left, int radius_top_right, int radius_botton_right, int radius_bottom_left);
	
	int get_smallest_corner_radius() const;
	PoolIntArray get_corner_radius() const;
	int get_corner_radius_TL() const;
	int get_corner_radius_TR() const;
	int get_corner_radius_BR() const;
	int get_corner_radius_BL() const;

//could get dropped because it is only supported when there are no rounded corners
//and would lead to some unnecessary if's... Also: what is it actually needed for... And: transparent BGcolor does the same trick for non rounded styleboxes.
	void set_draw_center(bool p_draw);
	bool get_draw_center() const;
	virtual Size2 get_center_size() const;

[Zephilinox]

Good point, would eliminate a lot of textures and make it easier to change.

[mablin7]

+1 on that! I don't think it would be hard to do, I will check it the code once I have time.

[toger5]

@magyar123 would be great if you work on that Thank you!

[SirPigeonz]

Good idea.

[volzhs]

I'm doing something similar while making flat editor theme.
WindowDialog with StyleBoxFlat demo here.

it will be great if I have this requested feature too.

[Zephilinox]

Making 4 different border colours is easy, the code is already there you just have to duplicate it.

doing different borders for each side is okay, a bit glitchy, looks terrible depending on your colours and the blend mode does not work well with it (or at least I can't fix it)

rounded borders are beyond what I can do, but I accidentally caused the blend mode to make a gradient. I think it looks rather nice, might be a worth adding.

Someone more experienced should handle these changes, my pr would be hacky. It may be worth making a new StyleBox instead of editing the flat one.

[Zylann]

Are you generating the image from code?

[Zephilinox]

Same way it's currently done, just a few more calls to the visual server

[toger5]

I started working on this issue.
I will update the first post to show the current though process what style box flat should support and how those properties should be accessible.

[toger5]

draw_center makes the center transparent, can't be implemented with rounded corners...
(except if there is some kind of mask system I don't know about...)
blend can be supported with and without rounded corners. It is bad performance wise...

SHOULD WE DROP THEM?

[toger5]

Since Better Flat style box is merged this is DONE!
there is also a PR for renaming filled -> draw_center

so discussions about that can be continued there.