繁体   English   中英

R闪亮-可折叠菜单项中的右对齐操作按钮会导致重影效果?

[英]R Shiny - Right-aligning action button in collapsible menuItem causing ghosting effect?

我在侧边栏菜单中有一个带有三个可折叠菜单项的闪亮仪表板。 第一个菜单项包含一个我要右对齐的操作按钮。 展开菜单项时,该按钮可见,但溢出到第二个菜单项的标签上:

在此处输入图片说明

是什么导致了这种效果,我该如何解决呢?

这是复制应用程序的代码:

library("shiny")
library("shinydashboard")

header = dashboardHeader()

sidebar = dashboardSidebar(
  sidebarMenu(

    menuItem("Item 1", tabName = "item1", 

             selectInput("letters", "Letters:", choices = LETTERS),

             tags$div(class = "pull-right", 
                      actionButton("clickme", label = "Click me", style = "primary")
             )

    ), 

    menuItem("Item 2"), 
    menuItem("Item 3")

  )
)
body = dashboardBody()

ui = dashboardPage(header, sidebar, body)

server = function(input,output,session){}

shinyApp(ui, server)

style = "float:right;"代替class = "pull-right" style = "float:right;" 具有相同的效果。

添加此样式:

.skin-blue .sidebar-menu>li>.treeview-menu {
    overflow: auto;
}

似乎摆脱了重影问题,但向selectInput下拉列表的溢出部分添加了一个滚动条,我不想这样做:

在此处输入图片说明

要使action button向右对齐,我们可以执行类似于此处的 CSS

sidebar = dashboardSidebar(
  sidebarMenu(
    menuItem("Item 1", tabName = "item1",
             selectInput("letters", "Letters:", choices = LETTERS),
             actionButton("clickme", label = "Click me", style = "primary"),
             tags$style(type='text/css', "button#clickme {margin-left: 60%;}")), 
    menuItem("Item 2"), 
    menuItem("Item 3")
  )
)

另外

menuItem("Item 1", tabName = "item1",
             selectInput("letters", "Letters:", choices = LETTERS),
             div(style="display:inline-block;margin-left: 52%;padding-bottom: 10px;",
                 actionButton("clickme", label = "Click me", style = "primary")) 

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM