App interface different in Android Studio and Emulator

[Ali S]

Hi,

An Android App development beginner here. I created a simple app which converts KMs to Miles and vice versa. Issue seems to be with the interface. The interface for activity_main.xml is as below:

But once I emulate it on an Nexus 6 API 29 emulator, it looks weird and doesn't work properly. Tried it on a Nexus 5 emulator as well, same issue. Here's a screenshot:

Moreover, when I tried installing the apk file on my Samsung Note 8, it doesn't install, even after changing the settings and allowing unknown apps to be installed. Please help.

 

[markolino]

Because you must implement constrains when you use Constrain Layout.
If you look at the designer, you can see an exclamation point with red background for each control: this means that the control has not constrains.
On the other hand, your app is not on google play store so to install it you must turn on setting about unknow app to be installed.
Hope this help.