动态改变闪亮材质的主题

时间:2021-06-18 08:09:40

标签: r shiny materialize

有没有办法动态更改 shinymaterial 页面中使用的主题?

相比之下,shinydashboardshinydashboardPlus

提醒一下,Eric Rayanderson 解释了 here 如何在 material_page() 中设置颜色,但我没有看到任何 update_material_page()

material_page(
  title = "Basic Page", 
  primary_theme_color = "blue", 
  secondary_theme_color = "red",
  material_row(
    material_column(
      width = 12,
      material_button("button", "Button"),
      material_switch("switch", "", "off", "on"),
      material_radio_button("radio", "", c("A", "B", "C"))
    )
  )
)

所需输出的示例:在 bs4Dash 包中有一个右上角的按钮,允许例如在明暗模式之间切换:

library(shiny);library(bs4Dash)
shinyApp(ui = dashboardPage(dashboardHeader(), dashboardSidebar(), dashboardBody(), title = "switch theme via top right btn"),
 server = function(input, output) { })

1 个答案:

答案 0 :(得分:0)

由于没有 update_material_page(),因此仅使用 R 的可能解决方法是在每次按下开关输入时呈现新的 ui。为了在颜色更改时保持输入状态,可以将它们的值保存在 reactiveValues 中,然后在不同颜色的 ui 完成渲染后再次插入它们。

在这段代码中,一个新的 ui 被渲染,所有的输入都恢复到它们的默认值。

#Dynamically change theme of shinymaterial

library(shiny)
library(shinymaterial)

ui <- fluidPage(
  uiOutput('material_ui')
)

server <- function(input, output, session) {
    
    
    clrs <- reactiveValues()
    clrs$primary <- 'blue'
    clrs$secondary <- 'red'
    clrs$switch_status <- FALSE
    

    
    output$material_ui <- renderUI({
        
        print(clrs$switch_status)
        
        material_page(
            title = "Basic Page", 
            primary_theme_color = clrs$primary, 
            secondary_theme_color = clrs$secondary,
            material_row(
                material_column(
                    width = 12,
                    material_button("button", "Button"),
                    checkboxInput("switch", "Dark mode:",value = clrs$switch_status),
                    material_radio_button("radio", "", c("A", "B", "C"))
                )
            )
        )
        
    })
    
    
    
    observeEvent(input$switch, {
        
        if (input$switch) {
            
            clrs$primary <- 'black'
            clrs$secondary <- 'grey'
            clrs$switch_status <- TRUE
            

        } else {
            
            clrs$primary <- 'blue'
            clrs$secondary <- 'red'
            clrs$switch_status <- FALSE
            

        }
    })
}

shinyApp(ui, server)
相关问题