【问题标题】:Set bsButton position in shiny dashboard在闪亮的仪表板中设置 bsButton 位置
【发布时间】:2019-10-08 05:17:58
【问题描述】:

我在下面有一个基本的闪亮仪表板,我想知道是否可以将 bs 按钮“显示/隐藏侧边栏”稍微向左或向右。

#ui.r
library(shinydashboard)
library(shiny)
library(shinyBS)
dashboardPage(
  dashboardHeader(),
  dashboardSidebar(disable = TRUE),
  dashboardBody(
    tabsetPanel(
      id = 'testingDPEtab',
      tabPanel("Upload",
               bsButton("showpanel8", "Show/Hide sidebar",icon = icon("toggle-off"), type = "toggle",style = "info", value = TRUE),
               dashboardPage(
                 dashboardHeader(),
                 dashboardSidebar(),
                 dashboardBody())

    )
  )
))
#server.r
server <- function(input, output) { }

【问题讨论】:

  • 只有按钮还是上传按钮和下面的蓝色区域?
  • 按钮。我认为“蓝色区域”是侧边栏,如果我没记错的话是不能移动的
  • 我想要一个具有该名称的按钮,它会在我单击的内容上放置一个大红色 X。

标签: r shiny shinydashboard shinybs


【解决方案1】:

取决于您是否要将“移动”应用于特定按钮或所有这些按钮,您可以执行以下操作:

tags$head(
  tags$style(HTML('#showpanel8{margin-left:10px}'))
)

这里,按钮是由 id 引用的。因此,更改将仅适用于该按钮。 #showpanel8{margin-left:10px} 是用于设置按钮样式的 CSS 语法。 对于其他边距,您可以使用:

  • 上边距
  • 右边距
  • 下边距
  • 左边距

请看这里:https://www.w3schools.com/css/css_margin.asp

完整的可重现示例:

library(shinydashboard)
library(shiny)
library(shinyBS)
ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(disable = TRUE),
  dashboardBody(
    tags$head(
      tags$style(HTML('#showpanel8{margin-left:10px}'))
    ),
    tabsetPanel(
      id = 'testingDPEtab',
      tabPanel("Upload",
               bsButton("showpanel8", "Show/Hide sidebar",
                        icon = icon("toggle-off"), type = "toggle",
                        style = "info", value = TRUE),
               dashboardPage(
                 dashboardHeader(),
                 dashboardSidebar(),
                 dashboardBody())

      )
    )
))
#server.r
server <- function(input, output) { }

shinyApp(ui, server)

【讨论】:

    猜你喜欢
    • 2019-07-02
    • 1970-01-01
    • 1970-01-01
    • 2015-04-22
    • 1970-01-01
    • 1970-01-01
    • 2019-02-12
    • 1970-01-01
    • 2019-06-20
    相关资源
    最近更新 更多