-
-
Notifications
You must be signed in to change notification settings - Fork 368
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
Adding Vertical Gradient for fonts #8262
base: master
Are you sure you want to change the base?
Conversation
Adding GOLDEN_GRADIENT ICN for Normal And Large Fonts
…or LARGE and NORMAL font type - Adding ICN generation for both font types - style Fix
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Clang-Tidy
found issue(s) with the introduced code (1/1)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi, @MaMadDl, I left some suggestions. Please have a look at them should you have the time.
Hi @MaMadDl , before proceeding with this pull request review please update the original description to include all fonts that you are adding here so every reviewer will have visual interpretation of them. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hello @zenseii
Requested Reviews have been changed
also for Large Font I've changed the outline pixel width to 2
Please Take a look
Most letters does have some flair to them like the original, but the S is a little bit off? The original S have extra curves at the ends, but this is straight at the ends, somewhat as an inverted Z. |
@Mr-Bajs you're right. @zenseii what do you think Edit: I might have to check for black pixel value as well as transform layer. Fixed also if possible please check with other Languages. I have access only to English |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Clang-Tidy
found issue(s) with the introduced code (1/1)
@MaMadDl in general yours looks very good so good work on that! I've looked closer on your generated fonts and have some comments about how we can improve them further: Please also have a look at the clang-tidy comments above that @ihhub pointed out that were valid. Also as a tip in case you don't know, you can use |
- Fixing Data type from Sprite to Image
Adding Black contour Wrap at the end
Hello @zenseii here's modified version of Fonts I have changed the function to take in a Color as well fixed Clang-Tidy issues mentioned by @ihhub Let me know what you think |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Clang-Tidy
found issue(s) with the introduced code (1/1)
Hi, @MaMadDl. This is looking very good now! I've looked closer at the original font and noticed that there is a slightly grayer dark contour outside of the black one. I've tried to highlight it here outside of the red line in the image below. Note that it is not the shadow because it goes all the way around, and this case specifically of the font doesn't have a shadow. In places where it does have shadow that gray contour is still there. ![]() In addition I think we could try to see if we can manage to cut one line off from the letters by doing two Copy( in, 0, 0, out, offsetX, offsetY, inWidth, inHeight / 2 );
Copy( in, ( inHeight / 2 ) + 1 , 0, out, offsetX, offsetY + ( inHeight / 2 ), inWidth, ( inHeight / 2 ) - 1 ); It's very possible that this will work better on some letters than others, I'm thinking that the E might have some issues with this, and it might be impossible to do this in a general way, in which case we can easily live without this. I also see that the amount of shadow for the letters depend on the context they are used in but for now I think having 2 pixels' width of shadow overall is fine. What do you think? This larger font is looking much better too. For the game we have this larger font that is used:
I think we could try to see if we can cut off the middle part of the larger one too, like I described for the normal font.
Do you mean to add another style of font with that? If you have any ideas where we could use that then sure. As for this current PR I think it's best if we focus on implementing the golden gradient font first and then we can open a PR with other fonts after. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi, @MaMadDl. I left some more comments. Please have a look should you have the time.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Clang-Tidy
found issue(s) with the introduced code (1/1)
Hello @zenseii I have added a version of silver gradient however it's slightly thicker than those in campaign there's also a problem when I'm trying to separate original white font shade(pixels that's slightly darker) where we are checking by value (Lines let me know what you think |
@MaMadDl. It's looking very promising! Are you saying that because of the problem with distinguishing white color the lower half of the letter doesn't have the gradient effect applied? I will look at the actual code to get some understanding once I have time. I don't think our font being thicker will pose a problem so that's fine. |
Hi @MaMadDl , please use |
@MaMadDl, I've had a look at the current effect generation but since this isn't really my territory I couldn't really find any obvious solution to the issues with the silver gradient effect. I'll have a look again once I have time and perhaps if @Districh-ru has some to spare then any input would be appreciated since he has much more knowledge in this area. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Clang-Tidy
found issue(s) with the introduced code (1/1)
Hi @zenseii, I've managed to fix the issues and made the method a lot simpler and shorter |
@MaMadDl. Well done! I've checked the two effects and compared them to the original and the silver one looks perfect now. The golden gradient needs just a little bit adjustment. It is a bit too bright and the yellow color needs to be a bit darker/more towards red/brown: As I said the silver gradient effect looks 1:1 in my opinion: |
Hi @zenseii and their pixel comparison: Note that center-line in original image is actually White not Yellow which we cannot incorporate into our code so we used light Yellow in its place |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi, @MaMadDl, thanks for the gradient fonts implementation, I like how it looks.
I left several comments, could you please take a look when you have time.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi @Districh-ru
I have made the changes requested , would please take a look?
also on one of the changes requested I had some issues which is commented on.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@MaMadDl, I left some more comments. Could you please check them?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
hi @Districh-ru
I've made the changes requested, could you please check them ?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Well done, @MaMadDl !
based on Discussion #8078
Adding colors bounds for all the colors in pal.h
Adding 3 point Linear vertical gradient creator
Adding new font color for NORMAL and LARGE fonts
Sample Output of Fonts:
![Screenshot 2024-04-14 214121](https://private-user-images.githubusercontent.com/18714088/322305189-732a6fae-8fe5-4b35-ac42-38dd9a3110e0.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI0NDU4NzgsIm5iZiI6MTcyMjQ0NTU3OCwicGF0aCI6Ii8xODcxNDA4OC8zMjIzMDUxODktNzMyYTZmYWUtOGZlNS00YjM1LWFjNDItMzhkZDlhMzExMGUwLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MzElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzMxVDE3MDYxOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWU2M2YzODllYjk4NTdmYmUzMmYwNTAzY2FjMjFmNzA5NjlmNmQ3YTBmOGM1YmZhNmM0NThjMTA0M2U2YmExNDEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.IUawSoahdCHIMImVSIBh28jmd7CsiJ-Tb8AFM-Sh-aE)
![Screenshot 2024-04-14 221955](https://private-user-images.githubusercontent.com/18714088/322305241-bc8f1e1e-31ad-4e7a-87a1-4ceb37fef2c8.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI0NDU4NzgsIm5iZiI6MTcyMjQ0NTU3OCwicGF0aCI6Ii8xODcxNDA4OC8zMjIzMDUyNDEtYmM4ZjFlMWUtMzFhZC00ZTdhLTg3YTEtNGNlYjM3ZmVmMmM4LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MzElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzMxVDE3MDYxOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTllMjZjNWI5OTJkNzFlNTk1ODc2MTQzMTEzNjQyMGJjZjQ4MWJmMWQ0NjNjMTg2NDAyOWNiMjY0YTdkNjkyMmYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.TWnfqVJ659z_tcd2n0BBP_XG92p7k9bfrbOcX4uUVnM)
Large Font:
Normal Font:
![Screenshot 2024-04-14 214214](https://private-user-images.githubusercontent.com/18714088/322305216-4abf0dcb-b7a8-4323-8204-0fc1b8c68c15.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI0NDU4NzgsIm5iZiI6MTcyMjQ0NTU3OCwicGF0aCI6Ii8xODcxNDA4OC8zMjIzMDUyMTYtNGFiZjBkY2ItYjdhOC00MzIzLTgyMDQtMGZjMWI4YzY4YzE1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MzElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzMxVDE3MDYxOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTlkMGVhMjVlN2E0Y2E3ODM2YmU1MzUxNjM4Yzg2MDRiMTllZTY1OGViOGFlMzEwZmJhZDFkNjkyMmEwNTNmNmEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.nwvQNmUDXqQpIxSKd6X50phF1ShqXSct_SodFjrQYrg)
![Screenshot 2024-04-14 222113](https://private-user-images.githubusercontent.com/18714088/322305220-389b7246-e04f-428c-b1f3-06f847a60575.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI0NDU4NzgsIm5iZiI6MTcyMjQ0NTU3OCwicGF0aCI6Ii8xODcxNDA4OC8zMjIzMDUyMjAtMzg5YjcyNDYtZTA0Zi00MjhjLWIxZjMtMDZmODQ3YTYwNTc1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MzElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzMxVDE3MDYxOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTAxYmFiMGNiOTE2NWM4ZWExZWRiNTM1MzFhOTNkNTNkZDdiZjE1YmUxM2NjOWZiMzgzYTMzNzJiOTkyYzBjYzQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.n-choWV9zJS77fYYscl2mJVIpXn4ejWOHsLTZy-N7ZU)