## ----setup, echo=FALSE, message=FALSE----------------------------------------- library(bslib) ## ----eval=FALSE--------------------------------------------------------------- # f7Gallery() ## ----eval=FALSE--------------------------------------------------------------- # f7Page( # ..., # options = list(...), # title = NULL, # allowPWA = FALSE # ) ## ----eval=FALSE--------------------------------------------------------------- # options <- list( # theme = c("auto", "ios", "md"), # dark = TRUE, # skeletonsOnLoad = FALSE, # preloader = FALSE, # filled = FALSE, # color = "#007aff", # touch = list( # touchClicksDistanceThreshold = 5, # tapHold = TRUE, # tapHoldDelay = 750, # tapHoldPreventClicks = TRUE, # iosTouchRipple = FALSE, # mdTouchRipple = TRUE # ), # iosTranslucentBars = FALSE, # navbar = list( # iosCenterTitle = TRUE, # hideOnPageScroll = TRUE # ), # toolbar = list( # hideOnPageScroll = FALSE # ), # pullToRefresh = FALSE # ) ## ----eval=FALSE--------------------------------------------------------------- # f7Navbar( # ..., # subNavbar = NULL, # title = NULL, # hairline = TRUE, # bigger = FALSE, # transparent = FALSE, # leftPanel = FALSE, # rightPanel = FALSE # ) ## ----eval=FALSE--------------------------------------------------------------- # f7Toolbar( # ..., # position = c("top", "bottom"), # icons = FALSE, # scrollable = FALSE # ) ## ----eval=FALSE--------------------------------------------------------------- # f7Panel( # ..., # id = NULL, # title = NULL, # side = c("left", "right"), # effect = c("reveal", "cover", "push", "floating"), # resizable = FALSE # ) ## ----eval=FALSE--------------------------------------------------------------- # f7SingleLayout( # ..., # navbar, # toolbar = NULL, # panels = NULL # ) ## ----eval=FALSE--------------------------------------------------------------- # f7Page( # options = list( # dark = FALSE, # filled = FALSE, # theme = "md" # ), # ... # ) ## ----eval=TRUE, echo=FALSE---------------------------------------------------- card( shinyMobile:::create_app_link( "NobwRAdghgtgpmAXGKAHVA6ASmANGAYwHsIAXOMpMAdzgCMAnRRAVwhiLdIAoAdMAPQsAzgwEAbAJZ0BWCdIZQGATwHCAFpIjKAskTqTxcfgEpeEWo2ZbhpKOPF8IAAmf8NW3fsPG851wxwqETCzgC8zgR8YOqkpKjCiAICDFrkDABmUARwGADmkqTqLHQYkkQpaXCZ2XAAtNRQwjB1BIoQAqbmZhDmUoxKytwe2j39iirDmtp6BkZjCoPcaHAAHgTqSukLA5MAJqjiygw7E0N5eYdEpABMPeZ7UHbRcMQQRDCSBMIA+uIkeS6EFeJA+X1+-wgeWcAB46s4Qe9Pt8-gDnABSAB86P8zjyDE4qB+dCGADclJIoHR5hjsbjhFIctxuBBuCY6gBGAAMXJMiFZJnuvQgI2UAEF0E5XCxJOFnBkAOwABSgeTgUtcziIqFI5RFcqktm4jwYAGs5QAxMUAGQAygBRXDywxGPaWm0Op1FODwOX8GB7Uy4XGuXWkIx+sA6ZTONCofjBlyaxW2rR5IzWqDKTg8EOa6CkuhKOWKgByUELSm4YYjEX4qahEcz2ZYpCDedDRCI4iLDBLCoAKl2e1WO5rgsJCnrI3RrqQPgmx65FdatKbuOIqXBxJHVxBzRyE851IEMpHYvFEslqDf8l307liDB20nNcmFXv15u6Nvd2vnDcR4nnAZ51jEcQJEkAg3tQd5EA+GBPkCb6uCYiYoc4ADEzgwFAWiRCQ5BkGOioAMJKHsGoYTmUjAnKA5YAAqo6S7OIokjCHAboRAxzHoRhzh7JIpKSHs1T0UxLGvihNZwJG5EMG66hwFAYkMIu0lvis6ybAwpAAPKtqgrbREoKmkbpbZgD0GE2ZqdlofS1SkuJEQZGwBC6iQ3BaMZpBOjmfkmM4IB5oFrYACRmVAFlbLC8KBBAakSmsGxbNwoWabGqBrFRKGPHYcqImCKKQnk-EYaQyg5ZG0UaQJOFxmmcpQHAwh5RhqxygVcAVQJMYROS4gsHAXIcn1GEZC6crkqkVJGKxdlvsFWI4llrhQKsPzKJtHHGq8ki4eIwgAJIQBa-xPHKdy0uiWHOBALAwD+fZEGeYkEId9ihPOzimnAQSsZtPxpXpwx2AQ-3cc4vH2itdLrbGW07ase24V1EQACxel8ppihwXBypjS3OAAvnZpPdGApMALpAA", # nolint "app", header = FALSE ), full_screen = TRUE, style = "width: 393px; margin: 0 auto; float: none;" ) ## ----eval=FALSE--------------------------------------------------------------- # library(shiny) # library(shinyMobile) # library(apexcharter) # library(dplyr) # library(ggplot2) # # data("economics_long") # economics_long <- economics_long %>% # group_by(variable) %>% # slice((n() - 100):n()) # # shinyApp( # ui = f7Page( # options = list(dark = FALSE, filled = FALSE, theme = "md"), # title = "My app", # f7SingleLayout( # navbar = f7Navbar(title = "Single Layout"), # toolbar = f7Toolbar( # position = "bottom", # f7Link(label = "Link 1", href = "https://www.google.com"), # f7Link(label = "Link 2", href = "https://www.google.com") # ), # # main content # f7Card( # outline = TRUE, # raised = TRUE, # divider = TRUE, # title = "Card header", # apexchartOutput("areaChart") # ) # ) # ), # server = function(input, output) { # output$areaChart <- renderApexchart({ # apex( # data = economics_long, # type = "area", # mapping = aes( # x = date, # y = value01, # fill = variable # ) # ) %>% # ax_yaxis(decimalsInFloat = 2) %>% # number of decimals to keep # ax_chart(stacked = TRUE) %>% # ax_yaxis(max = 4, tickAmount = 4) # }) # } # ) ## ----eval=FALSE--------------------------------------------------------------- # f7TabLayout( # ..., # navbar, # messagebar = NULL, # panels = NULL # ) ## ----eval=FALSE--------------------------------------------------------------- # f7Page( # options = list( # dark = FALSE, # filled = FALSE, # theme = "md" # ), # ... # ) ## ----eval=TRUE, echo=FALSE---------------------------------------------------- card( shinyMobile:::create_app_link( "NobwRAdghgtgpmAXGKAHVA6ASmANGAYwHsIAXOMpMAdzgCMAnRRAVwhiLdIAoAdMAPQsAzgwEAbAJZ0BWCdIZQGATwHCAFpIjKAskTqTxcfgEpeEWo2ZbhpKOPF8IAAmf8NW3fsPG851wxwqETCzgC8zgR8YOqkpKjCiAICDFrkDABmUARwGADmkqTqLHQYkkQpaXCZ2XAAtNRQwjB1BIoQAqbmZhDmUoxKytwe2j39iirDmtp6BkZjCoPcaHAAHgTqSuk95sEOzgA8dc4AJlB2GBmK8E6uUBDCtAzhkdEAmnDC-LhuYAByRFMuH8zhcESiACYAKwAFh+EIAzAAOHo7B7TZQAQXQt2cLEkLwyAHYAApQPJwXGuIioUjlB4vKS2bhnBgAaxeADFMQAZADKAFEfhlDEYTlzeYKfkU4PAXvwYCcgSDXHTSEZ5WAdMpnGhUN8Vc5iQAVKB0HlQZScHiG1yoe5wcShCJ2PI8yTM22uI2kh2OL3e5xqjURfg8uAZUjOMkQR3fNwuQNJ4SSE5wTVGSMGxNJ73EmOOnQUFhU3PemxwKMRY1YACqQoDSetUljLxr9eBObLrgAxM5a8J04VZaEmkGzaCoAA3SR5c705wkcTKRuB-N+gCS5Bgpe7qrNf1g6dDYDsdEHpDqproAEZs3uk8Hj79jURnNfnHe-F2H5JiGCfQ3f9ogyIhxDTBhlR-PdsjpKdn3bAVV29ExOwfVx11jcQt1lXc9zPQ85RPM8LyvM0IXvdDVUKEMXzfD8KO-KjXD-EhCSJICSGiNk4GUOgiCUJUwB6KjUOQjDfSwnCd3E70CKPTUSMrMi6ARSiqKfTVX3fCc1KY5jWIA4lOIgaJxEtaphAAfXsUgumg3MRL3VCEwfCMMjgAgq1+DJxAEukIDyfhGzEhyfQLRxNJPLBZ1iaM-XjFM001VI8lieNiQAIT8gg2WibKzXMoFnHczzvP4Xz-K0ILhK9ULc2gKc6CUdjDyapQ8Oo9Vn34a9QgtK0WDs-Tc02SQGBbBC6wbMLM1ICK22mtCy1S2IFuraa6uWtciT6zrdQgSQYHOOBxQ2jtG1TRSzQvdSkxNM19q62jeonL9trLeSiJfM13uQwz2JMkCwIgqCH1gyR4MWi6wokgBhQSnu9ZstCmmHu0UD1TuhmbuxOSHU2qHGPofKLfgRhhxXUOAoFBkb0JWdZNgYUgAHkhtQIbolQSRfCch9+aTeqyweugkbJ166GcRiScfA8FJPa8Zf+-9AeA-geL4gTKbBvdiQpk4kepIbJuJxtMcHM73yWxt8ZnCCzdhx8aJ6sADecanaeqO7wdQNYNi2dn4i59wCHOdJ7NEkLZYk69xZdrTdJ9uW6EI13rz0mPy1ViJjPVsBzOUSybPEYbhe7fXEdklHW3O3GVqgLGrcQrO7cJ5466z3MJbdwSPZpumu-uok+WOlm+UdMqjaTfgpyUSRCt8Ifc34AA1efF9CUg3w0IhqEQZOHyifg4eUFsIK+MBNQIM-D-Q3r2maD0UxIfhNVgO+H34ABxGmGEvzUFIlC62YouP2EANwAXcNTSsn8ywwBYKXSQqBaKIVkq4cu6EzxGCDpzG0YAzh2EjuhQWgZSHOEFk5YWg4GDwQ7kaNgXl6TcC0Hgn41o2HOEHMIF+EATDOBAOYQ0fZUh0OcCgogdkuyEM+IcY4gQIbwWGHAAAjhgAAIidbgfJlDCA0Vo-hxwEQAAYfg6L0Zo8g3AXJ0B1BEVhQ0AAktiTBokDBwpxPN0xHGcIECAEFsT+2ZjwQR0FGb7UIVAF4exxBZ1IMoP2movF32OugaqLwoCfG4KsDJDwng-DsaCchgsAC+bjkYcyccIMOcQiY+L8QEv2TMtjcFCbmcJttzhRIiDAUgYd-5xISa7ap4dvb00DKknmgUMlZOQjkiI1BSBD0KTAVAeQh4in2OCW+YVimGjKUI3oXY+yROwcYLsHjSCOMiXI3xFAILXiMK0r0vT+nCGAD8Y+YBVk1R+A4q5c9UiLxcicBgNIJT8gFAAXX2T8MF1BoDwGdNbesTkSndDACUqFQA", # nolint "app", header = FALSE ), full_screen = TRUE, style = "width: 393px; margin: 0 auto; float: none;" ) ## ----eval=FALSE--------------------------------------------------------------- # library(shiny) # library(shinyMobile) # library(apexcharter) # # poll <- data.frame( # answer = c("Yes", "No"), # n = c(254, 238) # ) # # shinyApp( # ui = f7Page( # options = list(dark = FALSE, filled = FALSE, theme = "md"), # title = "My app", # f7TabLayout( # panels = tagList( # f7Panel( # title = "Left Panel", # side = "left", # f7PanelMenu( # inset = TRUE, # outline = TRUE, # # Use items as tab navigation only # f7PanelItem( # tabName = "tabset-Tab1", # title = "To Tab 1", # icon = f7Icon("folder"), # active = TRUE # ), # f7PanelItem( # tabName = "tabset-Tab2", # title = "To Tab 2", # icon = f7Icon("keyboard") # ), # f7PanelItem( # tabName = "tabset-Tab3", # title = "To Tab 3", # icon = f7Icon("layers_alt") # ) # ), # effect = "floating" # ), # f7Panel( # title = "Right Panel", # side = "right", # f7Block("Blabla"), # effect = "floating" # ) # ), # navbar = f7Navbar( # title = "Tabs Layout", # hairline = TRUE, # leftPanel = TRUE, # rightPanel = TRUE # ), # f7Tabs( # animated = TRUE, # id = "tabset", # f7Tab( # title = "Tab 1", # tabName = "Tab1", # icon = f7Icon("folder"), # active = TRUE, # f7Card( # outline = TRUE, # raised = TRUE, # divider = TRUE, # title = "Card header", # apexchartOutput("pie") # ) # ), # f7Tab( # title = "Tab 2", # tabName = "Tab2", # icon = f7Icon("keyboard"), # f7Card( # outline = TRUE, # raised = TRUE, # divider = TRUE, # title = "Card header", # apexchartOutput("scatter") # ) # ), # f7Tab( # title = "Tab 3", # tabName = "Tab3", # icon = f7Icon("layers_alt"), # f7Card( # outline = TRUE, # raised = TRUE, # divider = TRUE, # title = "Card header", # f7SmartSelect( # "variable", # "Variables to show:", # c( # "Cylinders" = "cyl", # "Transmission" = "am", # "Gears" = "gear" # ), # openIn = "sheet", # multiple = TRUE # ), # tableOutput("data") # ) # ) # ) # ) # ), # server = function(input, output, session) { # # river plot # dates <- reactive(seq.Date(Sys.Date() - 30, Sys.Date(), by = input$by)) # # output$pie <- renderApexchart({ # apex( # data = poll, # type = "pie", # mapping = aes(x = answer, y = n) # ) # }) # # output$scatter <- renderApexchart({ # apex( # data = mtcars, # type = "scatter", # mapping = aes( # x = wt, # y = mpg, # fill = cyl # ) # ) # }) # # # # datatable # output$data <- renderTable( # { # mtcars[, c("mpg", input$variable), drop = FALSE] # }, # rownames = TRUE # ) # } # ) ## ----eval=FALSE--------------------------------------------------------------- # f7SplitLayout( # ..., # navbar, # sidebar, # toolbar = NULL, # panels = NULL # ) ## ----eval=FALSE--------------------------------------------------------------- # f7Panel( # title = "Sidebar", # side = "left", # effect = "push", # options = list( # visibleBreakpoint = 1024 # ), # f7PanelMenu( # id = "menu", # f7PanelItem( # tabName = "tab1", # title = "Tab 1", # icon = f7Icon("email"), # active = TRUE # ), # f7PanelItem( # tabName = "tab2", # title = "Tab 2", # icon = f7Icon("home") # ) # ) # ) ## ----eval=TRUE, echo=FALSE---------------------------------------------------- card( shinyMobile:::create_app_link("NobwRAdghgtgpmAXGKAHVA6ASmANGAYwHsIAXOMpMAdzgCMAnRRAVwhiLdIAoAdMAPQsAzgwEAbAJZ0BWCdIZQGATwHCAFpIjKAskTqTxcfgEpeEWo2ZbhpKOPF8IAAmf8NW3fsPG851wxwqETCzgC8zgR8YOqkpKjCiAICDFrkDABmUARwGADmkqTqLHQYkkQpaXCZ2XAAtNRQwjB1BIoQAqbmZhDmUoxKytwe2j39iirceXmo4kSkAExjCoPDmtp6BkbLA5NocAAeBOpK6TsTQ0VwMFCkkgQ95hkMLIWhADx1zgAmt1AYz1gcCcrmg8HCkWiAEF0EZhPxcG4wAB5dp5ODwvBIgBCUGg0ExiP42OqqQxplw-mcADd7Cw4BCogAWJmIgCsbMRADYAOyIgAcAGYeo8yOprrd7gB9EZDDIkUgQ-hQFikIhdXoQCBwahSmCkAhKD5fQIafYgn5-CHiqDfbj6w0MYQmSkuZySb60hhKsAcb5wcQIqle5RaPIQqS2bhRfjfRSkBFI6gJsAmF1Uu7wUIRGNgOO3RP8ZMUqnfSSBAh3Eg+uYQPJBt3UjBgjE+2niekN1xxoioRnRGCoetY-gEZSBkcxVCFvOSWwzgCOwjgBBn1MJSNgM-RShnjroGtFsphqAtrwhGR5AAUoOiLa47qQjD6AMqzQrOcRQZScFOu1yuJeb5SKQAAy36-veAHCB69BKBe154gGUEAc4j7PhE-AvrBdC7n4bqoa4MH+jWcAZH+VKEc4ZEZCuiqYWAqAiOoXZUc4vZVhA2afnOPCUWx1JztIRjYoEUAANbBGkEI8gADLJ-GoemBGEZeN7auIOgUCwKGER6PrwBALCsWxzi2AwJDhhEAAqWAAKoAKL-qZzhqUh4gAJLkDAulUXYdAAHJAj6-kAIwmS56EMgx1lQHQzjhfhLkAfc1YRJeHnEBA0RwAuLD2FKBDlgQRglippnZHc1LRc4tmOYphHKclbkaV51y+YR-lBeCDH+QsEWmVFPqxfF-VJcl7pZQhmUkDleUFUVDAlb4PTJU1LktQGbU+Q1flxd1NX8P5goDWxQ0xXFzgneNyWpS46U8jN2X8Ll+XiIVxWlamu0AatbHrVRrzIqqTF8WAy5GJWcDfFK-kalRAMAdA1K4d6D1BSjSgdedSLAR+4E-qqp2uCc5ZSNqEIAGJQqBL5OT9RjkepAYQnVDkNYjD5EEQ4iowh1nc7zWM-cEMGcT6dDzGqMDE65PKgVo4ncF+dAswxCsQOJCWJuogQZD6sTxIkyTUKb+Tc3kRgYMQMups5VGXhrSsq2rSJO84Y2IrrZEG3ECRJAIpvUObRCW7kNvw419sAQAxM4NxaJECoUAm5Vy9twgdRl3kdQ++3Bb1cWJdHDs8tiqpqs9YBqtMRgvuKcB-kiV5zIqqBKEC6SYpzqk8vXcCN7nKXfD6GgD6Qxc-ahLviD6LfzM4N6KPAXey6hRBkmQkppUiktxEQtsl2xwjUJIqBwALADCczLqz9n02nVG4QQ4k9n2Nn30fpcvlI-oMEPqF+D6EJFPQi-AAosBgKrb0RB9bAOqLSTiiQ16ERgInCIslEQ3AOBCUK8lMGgNQu2ekEI2TyUIc4P6pke6oUYNwGhAFZjzGBvEVU0Qyy2HnimKhUcfrZ3aqArqBckR9RQfsI4JwGCkBYaDaIihfgMEjgjL+6cc6CPzj1ERcVroqMAjyAWtdgQUK0KDDyI8GJMNIDKdQRBqAoNcDPV8NjqCL1bgAfnsZEcUL9oZ33qo-X6ujnDiOOKcGRbD+AwBYOIO4Up5GSHsEoxqHN+J-XWsuBg1U0auTYJWco2UTGqkRL+UGiJlzCBgiQEwzgQD8XgZkuADlqpkG4IU0gAASGuYd+6N0RLUtOLBUC-HIJTPuDceD6QYmPRuiUeEAF9RTrzoBk6qTSU6tIgKDdpwC+kNUkPrDZWzgHOHeM4Mhslqn9NMpeAK8x9lD3IAceizh262DgLJABSJrLijMr-aoNI6QMjnOxCA4hlBIkRG07ZyyiRgAwK4uATRjABNQloNoiLb6FH4KAhhrg7rTSytESWMSpQZEMBOXFaFCgYSRFCIwUiUFRSwJIPIsRrKHGeS+ZQwgMAABFbjAh4UpBqcz+ILPMBKlSJTVTtPkfBT4zhAgQD-jCQ4oSpHcCuYRcRHVhlQAhNqXUDojQqNIMoc+Po5WKJuqgtAqAwwQigBiIeOCIh+gDEE8FERiFwCCXkCygyISZmRdQlJKlxWanXiDGVEM6LQ1hpdBVSq-52Q8pqhqAAJayOhQLcFeeQD5-BL4sAYEqp84LY1QxHv5RAEKzKkAsnWQ5MrDIsDTPMxZAFpUdI4aQLhJyTQUD-lw9Nade0DsVRADePkoXAKFc4TQUZe0dslVG1hHSokxMkHE20CTZ5JqHdUVVEjTijqovs5wzaOmWOsbYy5P0dV6ovC8N4iIzUWoYvE+wuJrVYLtQ6iITrM6uucC2REXqAUdjgGmEVYq-qiogCYMAcyAC6QA", # nolint "app", header = FALSE, height = "1024" ), full_screen = TRUE, style = "width: 768px; margin: 0 auto; float: none;" ) ## ----eval=FALSE--------------------------------------------------------------- # library(shiny) # library(ggplot2) # library(shinyMobile) # library(apexcharter) # library(thematic) # # fruits <- data.frame( # name = c("Apples", "Oranges", "Bananas", "Berries"), # value = c(44, 55, 67, 83) # ) # # thematic_shiny(font = "auto") # # new_mtcars <- reshape( # data = head(mtcars), # idvar = "model", # varying = list(c("drat", "wt")), # times = c("drat", "wt"), # direction = "long", # v.names = "value", # drop = c("mpg", "cyl", "hp", "dist", "qsec", "vs", "am", "gear", "carb") # ) # # shinyApp( # ui = f7Page( # title = "Split layout", # f7SplitLayout( # sidebar = f7Panel( # title = "Sidebar", # side = "left", # effect = "push", # options = list( # visibleBreakpoint = 700 # ), # f7PanelMenu( # id = "menu", # strong = TRUE, # f7PanelItem( # tabName = "tab1", # title = "Tab 1", # icon = f7Icon("equal_circle"), # active = TRUE # ), # f7PanelItem( # tabName = "tab2", # title = "Tab 2", # icon = f7Icon("equal_circle") # ), # f7PanelItem( # tabName = "tab3", # title = "Tab 3", # icon = f7Icon("equal_circle") # ) # ), # uiOutput("selected_tab") # ), # navbar = f7Navbar( # title = "Split Layout", # hairline = FALSE, # leftPanel = TRUE # ), # toolbar = f7Toolbar( # position = "bottom", # f7Link(label = "Link 1", href = "https://www.google.com"), # f7Link(label = "Link 2", href = "https://www.google.com") # ), # # main content # f7Items( # f7Item( # tabName = "tab1", # f7Button("toggleSheet", "Plot parameters"), # f7Sheet( # id = "sheet1", # label = "Plot Parameters", # orientation = "bottom", # swipeToClose = TRUE, # backdrop = TRUE, # f7Slider( # "obs", # "Number of observations:", # min = 0, max = 1000, # value = 500 # ) # ), # br(), # plotOutput("distPlot") # ), # f7Item( # tabName = "tab2", # apexchartOutput("radar") # ), # f7Item( # tabName = "tab3", # f7Toggle( # inputId = "plot_show", # label = "Show Plot?", # checked = TRUE # ), # apexchartOutput("multi_radial") # ) # ) # ) # ), # server = function(input, output, session) { # observeEvent(input$toggleSheet, { # updateF7Sheet(id = "sheet1") # }) # # observeEvent(input$obs, { # if (input$obs < 500) { # f7Notif( # text = paste0( # "The slider value is only ", input$obs, ". Please # increase it" # ), # icon = f7Icon("bolt_fill"), # title = "Alert", # titleRightText = Sys.Date() # ) # } # }) # # # output$radar <- renderApexchart({ # apex( # data = new_mtcars, # type = "radar", # mapping = aes( # x = model, # y = value, # group = time # ) # ) # }) # # output$selected_tab <- renderUI({ # HTML(paste0("Currently selected tab: ", strong(input$menu))) # }) # # output$distPlot <- renderPlot({ # dist <- rnorm(input$obs) # hist(dist) # }) # # output$multi_radial <- renderApexchart({ # if (input$plot_show) { # apex(data = fruits, type = "radialBar", mapping = aes(x = name, y = value)) # } # }) # } # ) ## ----eval = FALSE------------------------------------------------------------- # library(shiny) # library(shinyMobile) # runGadget(shinyAppDir(system.file("examples/tab_layout", package = "shinyMobile")))