CODEWITHSUNDEEP
user-interfacekivy
Jonathan Coignard
Jonathan Coignard

Reputation: 61

Kivy application looks different on Mac

My Kivy application has a different look under Mac than under Windows or Linux. What could be the reason behind this ? The screen resolution ? The installation process under different OS ? ... ?

Here is the code for the first page:

#:kivy 1.0.9

<MenuButton>:
    font_size: 20
    size_hint: None, None
    height: 75
    width: 300
    pos_hint: {'center_x': .5, 'center_y': .5}

MyScreenManager:
    HomePage:

#### Home Page ##############################################
<HomePage>:
    name: 'Home'
    BoxLayout:
        orientation: 'vertical'
        spacing: 50
        padding: 20 
        BoxLayout:
            orientation: 'vertical'
            size_hint: 1, 0.23
            Label:
                text: 'V2G-Sim'
                font_size: 50
            Label:
                text: 'Vehicle to Grid Simulator'
                font_size: 30

        BoxLayout:
            orientation: 'vertical'
            size_hint: 1, 0.64
            spacing: 20
            RelativeLayout:
                MenuButton:
                    text: 'Create vehicles'
                    on_release: 
                        app.root.transition.direction = 'left'  
                        app.root.current = 'Itinerary'
            RelativeLayout:
                MenuButton:
                    text: 'Grid initialization'
                    on_release: 
                        app.root.transition.direction = 'left'  
                        app.root.current = 'Grid'
            RelativeLayout:
                MenuButton:
                    text: 'Simulate vehicles'
                    on_release: 
                        app.root.transition.direction = 'left'  
                        app.root.current = 'SimulationType'
            RelativeLayout:
                MenuButton:
                    text: 'Visualizations'
                    on_press:
                        root.raise_popup()
                    on_release: 
                        root.visualization()

        BoxLayout:
            orientation: 'horizontal'
            size_hint: 1, 0.13
            spacing: 30
            Button:
                text: 'Project status'
                font_size: 20
                size_hint: 0.7, 1
                on_release: 
                    app.root.transition.direction = 'left'  
                    app.root.current = 'ProjectStatus'
            Button:
                text: 'Exit'
                font_size: 20
                size_hint: 0.7, 1
                on_release:
                    root.exit_app()

Here is the look under a Windows/Linux distribution:enter image description here

Here is the look under Mac (tested with 2 different Mac book) enter image description here

Upvotes: 4

Views: 748

Answers (1)

inclement
inclement

Reputation: 29460

The mac probably has a high dpi display, so your fixed size declarations for the buttons and font size are half the actual size since they're given in pixels.

You can use the dp function from kivy.metrics (automatically imported in kv) to avoid this, e.g. font_size: dp(20).

Note that screens are all a bit different and may not have their dpi reported correctly anyway, so you will probably still get some (smaller) differences with different hardware.

Upvotes: 4

Related Questions