Headers and nav bar control

#1

Hi everyone.

I’m a AppGyver newbie and have some questions…

  1. On some pages I would like to have the top header and on other not. Only found an all or nothing toggle.

  2. Depending on the screen content, I would like to be able to colour the headers.

  3. On the main page there will be a nav bar - Same behaviour but I only want the icons and not the rest of the control. Can I make the background transparent?

  4. Can I have the nav bar on some pages and not others?

  5. Positioning of objects on screen seems unintuitive. Can anyone point me to a resource where I can find out more details?

Thanks for your patience.

Paul

#2

Welcome to the community!

Pretty much all of this will be possible with our upcoming upgrade to the navigation editor, which is in its final stretches right now. Currently, your best bet for optimization is to hide the default nav bar completely and use a custom-made container instead, with Scroll view used for content.

Can you share a bit more examples around the fifth question – what exactly is unintuitive? The layouting engine is based on flexbox, which can be a bit confusing, but we’ve tried our best to make things easy to understand. If you want, you can read more about flexbox at e.g. https://css-tricks.com/snippets/css/a-guide-to-flexbox/ – the layout options in the Style panel map pretty much directly to flexbox values; you can see a reference guide at https://docs.appgyver.com/reference/style-properties#layout

#3

@Harri_Sarsa I followed your advice and created my own custom header and everything works great. The only thing I’d like is for it to stay locked in place. Meaning when I drag up or down I dont want it to move and currently is drags with the screen. I create a scroll control and put content in it below the header row but still the header row gets pulled down the page when I pull down unlike the detail header bar. Is there anyway to lock this custom header bar in place at the top of the screen?
Tks!

#4

Cancel that I found the Disable Scroll and Stretch to viewport height in Page > Style > Advanced :slight_smile:

1 Like
#5

Quick question: Did you build a custom nav and added to all the pages in your app? In that case, doesn’t Nav gets hidden behind spinner when moving between pages.

#6

Hey @Ankit_Gupta I havent seen that as an issue, however I only have a spinner on a google chart I’ve added and it works fine and is only covering the chart.