f7MultiLayout {shinyMobile}

Framework7 multi pages layout

Description

Experimental multi pages layout. This has to be used with the brochure R package. See in the corresponding pkgdown article.

Usage

f7MultiLayout(
  ...,
  toolbar = NULL,
  title = NULL,
  options = f7DefaultOptions(),
  allowPWA = FALSE,
  basepath = "/"
)

Arguments

...

Pages. Must be an element like shiny::tags$div(class = "page", ...)

toolbar

Contrary to f7SingleLayout or any other layout, the multi page layout can have a common toolbar for all pages. See more at https://framework7.io/docs/toolbar-tabbar#common-toolbar. You can pass f7Toolbar in this slot or f7Tabs but if you do so, don't pass any toolbar in the different pages elements.

title

Page title.

options

shinyMobile configuration. See f7DefaultOptions and https://framework7.io/docs/app.html. Below are the most notable options. General options:

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

• dark: Dark layout. TRUE, FALSE, or "auto". The default is "auto". If set to "auto" automatically enables dark theme based on user system color scheme preference.

• 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 https://framework7.io/docs/color-themes.html. 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 https://framework7.io/docs/pull-to-refresh#examples.

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

Touch module options https://framework7.io/docs/app#param-touch:

• touchClicksDistanceThreshold: Distance threshold (in px) to prevent short swipes. So if tap/move distance is larger than this value then "click" will not be triggered.

• tapHold: It triggers (if enabled) after a sustained, complete touch event. By default it is enabled. See f7TapHold for usage.

• 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.

• tapHoldPreventClicks: When enabled (by default), then click event will not be fired after tap hold event.

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

• mdTouchRipple: Default to TRUE. Enables touch ripple effect for MD theme.

Navbar options https://framework7.io/docs/navbar#navbar-app-parameters:

• 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 https://framework7.io/docs/toolbar-tabbar#toolbar-app-parameters:

• 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.

allowPWA

Whether to include PWA dependencies. Default to FALSE.

basepath

Useful when the app is deployed on a server like https://user.shinyapps.io/base_path.