Android Question How do I make my controls look less basic?

Pete_engineer

Member
Licensed User
I have just merged the bluetooth and oscilloscope B4A examples (many thanks Klaus and Erel it ran straight away and is great!) and I've ran a dozen other B4A examples so far and am slowly refamiliarising myself with this wonderful ecosystem. (I used to have b4ppc long long ago)..

However, most of the controls such as check boxes/spinners/buttons etc aren't much more than 2D colored rectangles, and on spinners for example I cannot control the back ground color, which are sometimes different on different android devices, causing me difficulty..
The Oscilloscope example in the manuals shows lovely polished, professional-looking controls and mine does not look like that on my old android Galaxy S4 phone, new Pixel2 phone or a Pixelbook laptop.
I don't know whether I'm missing something from my installation or whether the beautiful graphics are another step that I haven't learned about yet.
With so much to learn, so many tutorials, so much documentation spanning ten years and over 500,000 forum posts to search through it can be hard to find what you need, especialy when you're a noob and don't know what to search for! :)
So any suggestions/pointers will be gratefully received.

Many thanks.
 

KMatle

Expert
Licensed User
I know what you mean but it only seems so. When you add a view and don't add any "extra's" to it, it IS of course simple. Take a look at the designer an play with it.

What I do is (example) add gradients to the views which make them look great

B4X:
Dim GD As GradientDrawable
    Dim Clrs(2) As Int
    Clrs(0) = Colors.White
    Clrs(1) = Colors.white
    GD.Initialize("TOP_BOTTOM", Clrs)
    GD.CornerRadius=20dip
    SomeEdittext.Background=GD

Use other fonts like

B4X:
EncryptBTN.Typeface=Typeface.CreateNew(Typeface.MONOSPACE,Typeface.STYLE_BOLD)

Play with colours, etc. There are a lot of libs with ready made custom views and XUI (search for that, too to have an idea).

https://www.b4x.com/android/forum/pages/results/?query=custom+views
 
Upvote 0

Erel

Administrator
Staff member
Licensed User
Make sure that the theme is set correctly. targetSdkVersion should be 26 and you should have this line in the manifest editor:
B4X:
CreateResourceFromFile(Macro, Themes.DarkTheme)
Or:
B4X:
CreateResourceFromFile(Macro, Themes.LightTheme)

The default theme for Android 5+ devices is the material theme. The controls are simple but should look nice.
 
Upvote 0

klaus

Expert
Licensed User
However, most of the controls such as check boxes/spinners/buttons etc aren't much more than 2D colored rectangles ...
This is the problem with newer versions of Android.
The Android target version in the 'original' Oscilloscope project is 4, now it should be 26 and the look is diffferent.
The 'default' look of the views is changed almost with every new Android version.
I don't like the newer look either.
 
Upvote 0

Pete_engineer

Member
Licensed User
Thanks everyone, the app looks a lot better now.
Its now consistent on all installations, I added the " CreateResourceFromFile(Macro, Themes.LightTheme)" to the manifest as Erel instructed as it had been been using whatever the default theme was on the users device.
So now the spinner lists all get the SAME background colour, so I am able to design the text colour to be DIFFERENT from the backgroundcolour, so that its no longer INVISIBLE when you open the list ! :) - that improves its usability a lot !!

<embarrased> I wasn't even aware of the manifest editor until that point .. </embarrassed>..

The Gradient buttons look fabulous. Thank you KMatle.
Rounded corners and borders on labels look great. Thank you Guardian17.
 
Upvote 0
Top