Guest
home
beatmaps
rankings
community
store
help
forum
  1. Forums
  2. osu!
  3. Skinning

How does osu!mania key sizing work?

posted
Total Posts
8
gBasil
2 posts
Joined October 2020
Topic Starter
gBasil
I can't find any documentation on how the size is calculated for the mania-key*.png/KeyImage elements:



All my attempts have resulted in the image being stretched or squished. How exactly does it work, and how can I reliably make images that don't get squished based on a given ColumnWidth?
Redo_
Global Moderator
634 posts
Joined September 2015
Redo_
Well they keys just get stretched or compressed to fit the column width, and there is no way around it.
gBasil
2 posts
Joined October 2020
Topic Starter
gBasil
I understand that, but I'm confused as to what the height is. Other skins that I've looked at (admittedly only one) define ColumnWidths of 80, but from what I can tell, the actual image used for the key is 125×175. The documentation has a different "Recommended SD" size as well. Also, the column width number doesn't seem to directly correspond to the width of the notes.
Last edited by gBasil , edited 1 time in total.
GrubDarlng
32 posts
Joined June 2021
GrubDarlng

gBasil wrote:

I understand that, but I'm confused as to what the height is. Other skins that I've looked at (admittedly only one) define ColumnWidths of 80, but from what I can tell, the actual image used for the key is 125×175. The documentation has a different "Recommended SD" size as well. Also, the column width number doesn't seem to directly correspond to the width of the notes.
The "ColumnWidth" line in the skin.ini file is the what decides the width the the keys. If and column width is 80 and a file is wider than that, itll just be squished to fit into 80 (taller). If a file is smaller, itll be stretched to fit into 80 (wider).

If you set your image size to be that of the column width, the the image will remain the same.

//

If a file is bigger than the column width, but still appears the same size, it might be a higher resolution image and so still fits.
Lothus
Former osu!mania 4K Champion: 2021
19 posts
Joined January 2017
Lothus
the hitbox for pressing notes is around that gray-ish/blue bar above the 4 "keys" you mentioned; changing the ColumnWidth parameter only affects how wide the field and the notes will look like. the keys can be changed in whatever way you want as images but there will be only visual differences
Last edited by Lothus , edited 1 time in total.
AntiMach
3 posts
Joined December 2020
AntiMach
There is no documentation for this as far as I know, however, the process is actually quite simple.


Images and skin.ini

Key image with X width and Y height.



IF the image is stretched (for example, most circular receptor images), take the height of the SOLID part of the image, and use that as X instead of the actual image's width. This will lead the game to unstretch the image.



skin.ini (simple case)
[Mania]
Keys: 4

ColumnWidth: W, W, W, W // Same column width for all columns


Math

With this, we can determine either the desired image width (X) or the desired column width (W), such that no stretching occurs.

SD Resolution:
W is W
X should be W * 1.6

X is X
W should be round(X / 1.6)

HD Resolution (images that end with @2x):
W is W
X should be W * 3.2

X is X
W should be round(X / 3.2)

The math is simple, but not documented. The height is NEVER considered for this case, only for the HitPosition.


Example

X is 125
W should 78

W is 80
X should 128
[LS]breadles
[LS]breadles

AntiMach wrote:

There is no documentation for this as far as I know, however, the process is actually quite simple.


Images and skin.ini

Key image with X width and Y height.



IF the image is stretched (for example, most circular receptor images), take the height of the SOLID part of the image, and use that as X instead of the actual image's width. This will lead the game to unstretch the image.



skin.ini (simple case)
[Mania]
Keys: 4

ColumnWidth: W, W, W, W // Same column width for all columns


Math

With this, we can determine either the desired image width (X) or the desired column width (W), such that no stretching occurs.

SD Resolution:
W is W
X should be W * 1.6

X is X
W should be round(X / 1.6)

HD Resolution (images that end with @2x):
W is W
X should be W * 3.2

X is X
W should be round(X / 3.2)

The math is simple, but not documented. The height is NEVER considered for this case, only for the HitPosition.


Example

X is 125
W should 78

W is 80
X should 128
i'm pretty sure that it was 1.5x column width. im assuming there is no documentation because everyone just does nothing about it or stretches or compresses the receptor images instead, but that leads to sometimes imperfect stretching or compressing
sdfhj
1 post
Joined February 2016
sdfhj
The key images(such as mania-key1.png) can be downloaded here:
wiki/zh/Skinning/osu%21mania#%E6%8C%89%E9%94%AE

Below is a python script I use to resize the key images to appropriate size after changing the parameter HitPosition in skin.ini

# Resize the key.png of osu!mania

import os
import cv2

# define the folder that stores the key images
key_path = 'D:\\Another\\temp\\maniakey'

# define the width and height of the resized key images
resize_width = 50
resize_height = 175

# define the folder that stores the resized key images
resize_key_path = 'D:\\Another\\temp\\maniakey\\resize_maniakey'

# if the folder does not exist, create it
if not os.path.exists(resize_key_path):
os.makedirs(resize_key_path)

# get all the key images
keys = os.listdir(key_path)

for key in keys:
if key.endswith('.png'):
# read the key image
key_file_path = os.path.join(key_path, key)
key_img = cv2.imread(key_file_path, cv2.IMREAD_UNCHANGED)

if key_img is None:
print(f"Warning: Could not read image {key_file_path}. Skipping.")
continue

# resize the key image
resize_key_img = cv2.resize(key_img, (resize_width, resize_height), interpolation=cv2.INTER_CUBIC)

# save the resized key image
resize_key_file_path = os.path.join(resize_key_path, key)
cv2.imwrite(resize_key_file_path, resize_key_img)
Please sign in to reply.

New reply

0
1 / 8