All button shapes are set to default. How can I make it so the actual installed version looks the same as the testing environment in the companion?
AI Companion
Installed apk
Installed apk
Use a Classic screen Theme instead of Device Default. Device Default displays vary depending on the Android operating system version.
How did you style your buttons ?
Which theme are you using ?
The UI looks quite sleek. What are you using to style the components?
All button settings are set to default and I'm using dark theme. This is just how the Companion displays it though,the installed version looks different.
No styling, defaults. Dark theme.
Classic theme buttons look pretty ugly. I'm trying to find a way to make the buttons of the app when it is installed on an android, look the same as what they do during testing, in the Companion.
You can not. How the Buttons look depend on the version of the Android they are installed on.
Not happy with Classic, then live with how the Android operating system works. If you want consistent Button appearance on all versions, Classic is your only option with App Inventor.
Perhaps there is an extension that will help. I do not know.
I have been searching for a few hours but found nothing. Thanks for the responses anyway. What I will try as a last resort is to edit the background image, add the button text to each corresponding position of it and then make the buttons with no text only white color and transparent.
Your idea might work to make your UI the way you want. Good luck. Please share your experiments.
You might also try these alternatives to using Buttons. You might free yourself from the quirks of the operating system:
- have all your graphics on the ScreenBackground that is a canvas. Use 'buttons' that are based on the color of the Background of a Canvas at that point. This means not using 'Buttons' at all.
- instead of Buttons, use Image controls with pictures of a 'button' and use the Image control like a button. An Image control has an event Click() that occurs when an image is clicked.
- use color 'hot spots' on a Canvas where the canvas fills the entire screen. Use either GetBackgroundPixelColor( x , y ) which gets the color of the given pixel, ignoring sprites or
GetPixelColor( x , y ) that gets the color of the given pixel, including sprites. - use sprites on a Canvas as 'buttons'
All of these ideas are a bit difficult to implement but might help you design a screen pleasing to your aesthetics.
Quick demo of what "could" be done with classic theme
For buttons 1&2 I used an online button maker for style and text
For buttons 3&4 as above but without text, using the Ai2 button text
For buttons 5&6 using the Ai2 "rounded" button
buttonStyleClassic.aia (25.6 KB)
with a bit of time, effort, trial and error, most things are possible.....