Skip to contents

f7Page is the main app container.


  title = NULL,
  options = list(theme = c("auto", "ios", "md", "aurora"), dark = TRUE, skeletonsOnLoad =
    FALSE, preloader = FALSE, filled = FALSE, color = "#007aff", touch = list(tapHold =
    TRUE, tapHoldDelay = 750, iosTouchRipple = FALSE), iosTranslucentBars = FALSE, navbar
    = list(iosCenterTitle = TRUE, hideOnPageScroll = TRUE), toolbar =
    list(hideOnPageScroll = FALSE), pullToRefresh = FALSE),
  allowPWA = FALSE



Slot for shinyMobile skeleton elements: f7Appbar, f7SingleLayout, f7TabLayout, f7SplitLayout.


Page title.


shinyMobile configuration. See Below are the most notable options. General options:

  • theme: App skin: "ios", "md", "auto" or "aurora".

  • dark: Dark layout. TRUE or FALSE.

  • skeletonsOnLoad: Whether to display skeletons on load. This is a preloading effect. Not compatible with preloader.

  • preloader: Loading spinner. Not compatible with skeletonsOnLoad.

  • filled: Whether to fill the f7Navbar and f7Toolbar with the current selected color. FALSE by default.

  • color: Color theme: See Expect a name like blue, red or hex code like `#FF0000`. If NULL, use the default color. If a name is specified it must be accepted either by col2hex or getF7Colors (valid Framework 7 color names).

  • pullToRefresh: Whether to active the pull to refresh feature. Default to FALSE. See

  • iosTranslucentBars: Enable translucent effect (blur background) on navigation bars for iOS theme (on iOS devices). FALSE by default.

Touch module options

  • tapHold: It triggers (if enabled) after a sustained, complete touch event. By default it is disabled. Note, that Tap Hold is a part of built-in Fast Clicks library, so Fast Clicks should be also enabled.

  • tapHoldDelay: Determines how long (in ms) the user must hold their tap before the taphold event is fired on the target element. Default to 750 ms.

  • iosTouchRipple: Default to FALSE. Enables touch ripple effect for iOS theme.

Navbar options

  • iosCenterTitle: Default to TRUE. When enabled then it will try to position title at the center in iOS theme. Sometime (with some custom design) it may not needed.

  • hideOnPageScroll: Default to FALSE. Will hide Navbars on page scroll.

Toolbar options

  • hideOnPageScroll: Default to FALSE. Will hide tabs on page scroll.

In any case, you must follow the same structure as provided in the function arguments.


Whether to include PWA dependencies. Default to FALSE.


David Granjon,