Looking for some constructive feedback over my app I made using the Community Edition/Appgyver!
Toast Photography has been my project for a while now and I’m constantly looking to improve it in order to achieve an overall better product. I’m a hobbyist photographer and Toast is mainly about sharing photography. Please feel free to try out the app & tell me what you dislike, find counter intuitive or what you’d like from the app that would lead to you using it more, you can be as brutal as possible!
Furthermore if you’re also creating your app on Appgyver/SAP Build Apps Community edition and would like to emulate a feature on my app, I’d be more than glad to offer a solution as best as I can to a problem you’re currently facing, so AMA!
Thanks in advance!
Toast is available on iOS, android build will be out soon
2 Likes
Congratulations on the work!
Thank you for the positive feedback!
1 Like
I would just adjust the margins or padding at the top a little. It is very close to the iOS operating system icons. @Tinashe_Mukombe
If the app is for Android and iOS, you can do this:
IF(systemVars.os == “ios”, 32, 20)
‘32’ and ‘20’ are just a representation of the space you defined at the top of the application.
If you don’t understand, feel free to ask.
One of the things I was uncertain with was how much margin I should leave for system icons on iOS. I noticed there would be a larger empty space on iPhones/iPad without a notch compared to an iPhone with a notch, hence the decision to get the padding as small as possible so that the empty space on older iPhones and iPads isn’t too bad (I think I inconsistently used between 28px and 32px)
maybe there could be a way to automatically determine if a device has a notch/hole punch so that the padding can adjust dynamically, I think that would be an ideal solution. But thanks @pedrofarias for pointing it out! Definitely something I’m looking into now
I understood! I think there is little customization in the theme variables.
Nice Job. How you do the footer menu?
Thanks @Rodrigo_Margarit!
For the bottom navigation, I used a custom layout. The entire bottom is a container with Horizontal components and each component cell is a vertical container with an Icon and text below it. When you tap the Icons, it opens the respective pages
The “Post” icon is a little special however. For that I used a Lottie animation view component wrapped into a fully rounded container and text labelled “Post” below it. The two different animations you may have come across is a result of two Lottie animations of type json being switched out depending on weather the post button was clicked or not. I handle this with page variables
I use a page variable set to object with 4 properties to make the animation work as in the first screenshot. The Lottie animation source component is bound to the “current” page variable. It is this variable that I switch out with different variables depending on the action. Next is the “passive” page variable which is allocated to a json text value of the animation that shows up when no action is required as well as when the page is mounted. The “active” animation is what is set to be the current page variable when an action is triggered, in this case when the post icon is clicked. I also change whether or not the animation loops indefinitely or not with the “Loop” boolean property. So when the passive animation is rendered, I have Loop set to false and when the active animation is rendered, I have loop set to true. Hope this answers your question!
1 Like
Nice Thanks. Very insteristing
1 Like