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

Ability to set different border widths and colors for a rectangle's sides #463

Open
Homailot opened this issue Jun 3, 2023 · 4 comments
Labels
enhancement New feature or request

Comments

@Homailot
Copy link

Homailot commented Jun 3, 2023

It would be very useful to have this feature. For example, I might want to render a vertical or horizontal bar to separate different UI elements, and this would be easily done by creating a border that is only active on one side.

This could be modified from the theme JSON file where instead of

"border_width": 1

You would define:

"border_width": {
    "left": 1,
    "right": 0,
    "bottom": 0,
    "top": 0
}

I'm not really sure if there is any alternative to the issue I've mentioned, and if anyone has any ideas I would appreciate it if you could share them! Thank you

@Homailot Homailot added the enhancement New feature or request label Jun 3, 2023
@MyreMylar
Copy link
Owner

I agree with this general idea, I think it will also become very important when we (eventually) have a spreadsheet/table like element for displaying data.

@chavi362
Copy link

chavi362 commented Nov 9, 2023

Hi, @MyreMylar , I would like to work on it!
I'm new in pygame gui, so can you please explain on which file should me work on this issue?
I mean, where is the border defined?
Thank you so much! (also for this great library)
Chavi

@MyreMylar
Copy link
Owner

Hello Chavi,

This is really a couple of nested problems to solve;

  1. Defining an interface for users to set theming border widths for all four sides of a shape (and what to do for circles that don't really have sides). Here we would need to clarify what happens for all the existing shapes and how the new theming options interact with the existing one for setting a border width and colour for all four sides.
  2. Pass the information from the users theming down through the UI systems so it reaches the drawable shapes parts of the code. This section could be done on it's own without changing the interface but it would probably be good to look at them together to get a feel for what information would be needed. With steps 1 and 2 figured out we should be able to pass all (or at least nearly all) the existing unit tests without needing to change any user code - so our code is backwards compatible.
  3. This is the part where we figure out how to draw the four borders separately and in different colours or gradients. At the moment the borders are mostly created by cutting out a smaller shape (smaller by the border width in all directions) from a larger one drawn in the border colour - so with the simplest case, a 100x200 rectangle with a border width of 1 we would draw the 100x200 rectangle in our border colour and then subtract from it a 98x198 pixel rectangle leaving a 1 pixel border. This method works for all three of our shape types.

The code for all these parts is spread all over the GUI library as border_width is is used in lots of places, but there are important sections for the drawing in redraw_state() of each of the drawable shapes (core/drawable_shapes). A lot of the code for defining the shape theming interface is in __check_shape_theming_changed() but a search for border_width in the codebase should find you lots of mentions. I would probably focus in on getting it working for one element like the button first and then figuring out the rest.

@chavi362
Copy link

Thank you so much @MyreMylar , Do you recommend me to work on it? Maby, you have something easier for me as a new contributor? I prefer to enhance than solve bugs.
But. I want very much to contribute to pygame gui!
Which ussueshould you recommend me?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants