在 Shiny 应用程序中对齐 ActionButton

Question

In the app below, I would like to change three aspects of the ActionButton :

1. Center the button in its column
2. Reduce the spacing between the button and the top text
3. Increase the spacing between the button and the panels below.

Can this be done within shiny?

library(shiny)
library(shinyBS)

ui <- 
  fluidPage(
    fluidRow(
      column(12,
             bsCollapse(id="instructionsOutput", open="instructionsPanel",
                        bsCollapsePanel("instructionsPanel",
                                        "This is a panel with text",
                                        style="info"
                                        )
                        )
             ),
      column(12,
             actionButton("p1Button", "Expand/Collapse Text")
             )
    ),
  sidebarLayout(
    sidebarPanel(),
    mainPanel()
  )
)

server <- function(input, output, session) {
  observeEvent(input$p1Button, ({
                updateCollapse(session, "instructionsOutput",
                               open="instructionsPanel",
                               close="instructionsPanel")  
  })
  )

}

shinyApp(ui, server)

Answer 1

Very late reply...but if anyone is looking for a possible solution, you can try the following. Similar to the answer by Xiongbing Jin above, you can add style and align as arguments to shiny::column

ui <- 
  fluidPage(
    fluidRow(
      column(
        12,
        bsCollapse(
          id="instructionsOutput", 
          open="instructionsPanel",
          bsCollapsePanel(
            "instructionsPanel",
            "This is a panel with text",
            style="info"
          )
        )
      ),
      column(
        12,
        actionButton(
          "p1Button", 
          "Expand/Collapse Text"
        )
        , align = "center"
        , style = "margin-bottom: 10px;"
        , style = "margin-top: -10px;"
      )
    ),
    sidebarLayout(
      sidebarPanel(),
      mainPanel()
    )
  )

server <- function(input, output, session) {
  observeEvent(input$p1Button, ({
    updateCollapse(
      session, "instructionsOutput",
      open="instructionsPanel",
      close="instructionsPanel"
    )  
  })
  )

}

shinyApp(ui, server)

Answer 2

Thanks @rhyncogale. I applied your comment and it worked for my work.