Question

我如何个性化我闪亮的应用程序，默认情况下，siderPanel被放置在topleft，mainPanel在中心anf如果我有somme摘要它在底部... 在我的应用程序中，siderpanel，mainPanel和verbatimTextOutput是一个在另一个之上，你能帮我替换它吗？

shinyUI(fluidPage(
  tags$head(

    tags$link(rel = "stylesheet", type = "text/css", href = "bootstrap.css"),
    tags$style(HTML("
      @import url('//fonts.googleapis.com/css?family=Lobster|Cabin:400,700');
    "))
  ),

  headerPanel(h1("ReprÃ©sentation de Weibull", 
                 style = "font-family: 'Lobster', cursive;
        font-weight: 500; line-height: 1.1; 
        color: #00BFFF;")),
  fluidPage(
    fluidRow(
    column(3,
    sidebarPanel(
      wellPanel(
        fileInput("file1", "Choisir votre 1er fichier tabulÃ©"), 

        checkboxInput("fit_weibull", label = "Ajuster une loi de Weibull", value = FALSE),

        conditionalPanel(
          condition = "input.fit_weibull == true",
          uiOutput("slider"))
      ),
      wellPanel(
        fileInput("file2", "Choisir votre 2e fichier tabulÃ©"), 
        checkboxInput("fit_weibull2", label = "Ajuster une loi de Weibull", value = FALSE),
                conditionalPanel(
                  condition = "input.fit_weibull2 == true",
                  uiOutput("slider2"))  
      )
    )),
    column(9,
    mainPanel(
      list(tags$head(tags$style("body {background-color: #F8F8FF; }"))),
      plotOutput("plot.weibull"),
      conditionalPanel(
        condition = "input.fit_weibull == true",
        verbatimTextOutput("km_lim"),
        verbatimTextOutput("coefficients")

      ),
      conditionalPanel(
        condition = "input.fit_weibull2 == true",
        verbatimTextOutput("km_lim2"),
        verbatimTextOutput("coefficients2")

      )
    ))

  )
)

Answer 1

您的问题通过CSS解决，您可以更改每个元素的属性。记住每个面板的ID，用这个，你可以修复你想要的任何东西。然而，这是一项艰苦的工作任务，我相信使用闪亮主题或shinydashboard等软件包可以更好地个性化。

此程序包可帮助您自定义Web应用程序，但如果要移动其中一个元素的位置，则必须更改CSS属性。

例如：

             float: right
             width: 70%
             height:10%
             margin: 0 0 0 0 (top-right-bottom-left)

个性化闪亮的界面

1 个答案: