How to set widget size that is independent of screen resolution/density in kivy

Question

I had coded a simple click game with Python-kivy to android.

You should click dots which are popping out randomly at screen. I set their size 20px to 60px as your level. But it seems when I try on different device screen resolution change the hardness of game. low resolution phones have higher change. I also look at some game (2048 - piano tiles etc) they are also have the same problem.

Should I keep ignore the resolution or try to solve this problem? If so how?

Answer 1

I can't off code itself but i can offer the theory behind it with some pseudo code

First of all some theory: Screens have a resolution this is mesured in pixels so for example, 1920*1080 on a screen of 10 inches, this is more pixels per inch so 20 pixels on this screen would take up less space then 20 pixels on a 40inch screen, because of this some math before the game starts is needed.

int width = getScreenWidth();
int height = getScreenHeight();
int dispWidth = getDeviceWidth();
int dispHeight = getDeviceWidth();
int PPI = caclulate the PPI with algorithm

You would then need to change some code to work out the pixels needed to fix say 1/2 inch diameter circle. which would be easy enough.

Another way to do it is looking on the Developer Documentation https://developer.android.com/reference/android/util/DisplayMetrics.html

it lists the size of the screens on different densities and then set variables according to that, It's been a few years since I've done any work with android but i believe you can also set pixel density on a canvas too.

Answer 2

To make sizes independent of screen resolution/pixel density, you need to use kivy.metrics. The dp function gives you a screen independent way to specify distance. The sp function does this as well as scales based on the user font preference. See https://kivy.org/docs/api-kivy.metrics.html for more info. The following should display the same size on different screens:

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput
from kivy.metrics import dp, sp

class Test(Widget):
    def __init__(self, **kwargs):
        super(Test, self).__init__(**kwargs)
        wid = Button()
        wid.size = dp(200), dp(50)
        wid.text = "test"
        wid.font_size = sp(20)

        self.add_widget(wid)

class MyApp(App):

    def build(self):
        return Test()

if __name__ == '__main__':
    MyApp().run()

Answer 3

To make widget size that is independent to screen resolution you need to know the screen resolution first look at this

from kivy.core.window import Window
//import that first

class winApp(App):
 size_x = NumericProperty(0)
 size_y = NumericProperty(0)
 def on_start(self):
     window_sizes=Window.size
     self.size_x , self.size_y = window_sizes
     print(self.size_x, self.size_y)

After getting the size of any screen of any device you can do anything Example

wid = Button()
    wid.size = self.size_x, self.size_y
    wid.text = "test"
    wid.font_size = sp(20)

`