我有一个闪亮的应用程序,标题上有一个拨动开关。按下切换按钮时,它会运行一个长功能,并向用户显示一条消息,说明正在发生某些事情。下面是一个非常简化的版本。
我拥有的功能很好,但 UI 没有对齐。标题上显示的切换和消息略高于左侧的最小化按钮(汉堡包)。我希望能够将切换和消息向下移动一点,以便它们与最小化按钮水平对齐,但我找不到在 CSS 或各种闪亮/闪亮仪表板/闪亮仪表板Plus中执行此操作的方法职能。
此外,输出消息(和 htmlOutput 元素)在切换的右侧很远,我想缩小切换和消息之间的间隙。
library(shiny)
library(shinycssloaders)
library(shinydashboard)
library(shinyjs)
library(shinydashboardPlus)
library(shinyWidgets)
# Define UI for application that draws a histogram
ui <- dashboardPage(skin = 'blue',
shinydashboardPlus::dashboardHeader(title = 'Example',
leftUi = tagList(
useShinyjs(),
switchInput(inputId = 'swtLabels', label = 'Labels', value = TRUE,
onLabel = 'Label 1', offLabel = 'Label 2',
onStatus = 'info', offStatus = 'info', size = 'mini',
handleWidth = 230),
htmlOutput(outputId = 'labelMessage')
)
),
dashboardSidebar(),
dashboardBody()
)
server <- function(input, output) {
observeEvent(input$swtLabels, {
shinyjs::html(id = 'labelMessage', html = 'Starting...')
shinyjs::showElement(id = 'labelMessage')
Sys.sleep(1)
shinyjs::html(id = 'labelMessage', html = 'Done')
shinyjs::hideElement(id = 'labelMessage', anim = TRUE, animType = 'fade', time = 2.0)
})
}
# Run the application
shinyApp(ui = ui, server = server)