右对齐的闪亮元素的mainPanel [英] Right-align elements in Shiny mainPanel

问题描述

我有左侧边栏有光泽的应用程序，我想对准地块的mainPanel的权利。我曾尝试加入风格=对齐：正确的在mainPanel中的每一个元素，以及包装的一切我能想到的在 DIV（.. ，风格=对齐：右）。没有奏效。

您可以使用这个例子的从RStudio画廊。我想在表选项卡中的输出对准右侧。下面是ui.R的相关部分：

 的mainPanel（
  tabsetPanel（TYPE =标签，
    一个tabpanel（暗算，plotOutput（暗算）），
    一个tabpanel（摘要，verbatimTextOutput（摘要）），
    一个tabpanel（表，tableOutput（表））
  ）
）
 

解决方案

您可以添加一个类的表格设置页。在这种情况下，我添加了一个 rightAlign 类吧。 一个tabpanel（表，tableOutput（表）中，class ='​​rightAlign'）然后，您可以样式该选项卡中的任何常规方式的 http://shiny.rstudio.com/articles/css.html 使用类似。 rightAlign {浮动：权利;} 的CSS

 库（闪亮）
runApp（名单（
  UI = fluidPage（
    标签$头（标签$风格（rightAlign {浮动：权利;}）），
    titlePanel（Tabsets），
    sidebarLayout（
      sidebarPanel（
        单选按钮（测距，分散型，
                     C（正常=规范，
                       统一=互可操作​​性框架，
                       对数正态=lnorm
                       指数=EXP）），
        BR（），
        sliderInput（n的，
                    意见数：，
                    值= 500，
                    分= 1，
                    最大= 1000）
      ），
      mainPanel中（
        tabsetPanel（TYPE =标签，
                    一个tabpanel（暗算，plotOutput（暗算）），
                    一个tabpanel（摘要，verbatimTextOutput（摘要）），
                    一个tabpanel（表，tableOutput（表）中，class ='​​rightAlign'）
        ）
      ）
    ）
  ）
  ，服务器=函数（输入，输出）{
    数据＆LT;  - 反应（{
      DIST＆LT;  - 开关（输入$ DIST，规范= RNORM，UNIF = runif，
                     lnorm = rlnorm，EXP = rexp，RNORM）
      DIST（输入$ N）
    }）
    输出$情节＆LT;  -  renderPlot（{
      DIST＆LT;  - 输入$ DIST
      N'LT;  - 输入$ N
      HIST（数据（），主要=膏（R，DIST，'（'，N'）'，九月=''））
    }）
    输出$总结＆LT;  -  renderPrint（{
      摘要（数据（））
    }）
    输出$表＆LT;  -  renderTable（{
      data.frame（X =数据（））
    }）
  }
）
）
 

I have a Shiny app with a sidebar on the left, and I want to align the plots in mainPanel to the right. I have tried adding style = "align:right" to every element in mainPanel, as well as wrapping everything I can think of in div(..., style = "align:right"). None of that worked.

You can use this example from the RStudio gallery. I would want to align the output in the "Table" tab to the right side. Here's the relevant part of ui.R:

mainPanel(
  tabsetPanel(type = "tabs", 
    tabPanel("Plot", plotOutput("plot")), 
    tabPanel("Summary", verbatimTextOutput("summary")), 
    tabPanel("Table", tableOutput("table"))
  )
)

解决方案

You can add a class to the Table tab. In this case I have added a rightAlign class to it. tabPanel("Table", tableOutput("table"), class = 'rightAlign') You can then style this tab in any of the usual manners http://shiny.rstudio.com/articles/css.html using something like .rightAlign{float:right;} for the CSS.

library(shiny)
runApp(list(
  ui = fluidPage(
    tags$head(tags$style(".rightAlign{float:right;}")),
    titlePanel("Tabsets"),
    sidebarLayout(
      sidebarPanel(
        radioButtons("dist", "Distribution type:",
                     c("Normal" = "norm",
                       "Uniform" = "unif",
                       "Log-normal" = "lnorm",
                       "Exponential" = "exp")),
        br(),
        sliderInput("n", 
                    "Number of observations:", 
                    value = 500,
                    min = 1, 
                    max = 1000)
      ),
      mainPanel(
        tabsetPanel(type = "tabs", 
                    tabPanel("Plot", plotOutput("plot")), 
                    tabPanel("Summary", verbatimTextOutput("summary")), 
                    tabPanel("Table", tableOutput("table"), class = 'rightAlign')
        )
      )
    )
  )
  , server = function(input, output) {
    data <- reactive({
      dist <- switch(input$dist, norm = rnorm, unif = runif,
                     lnorm = rlnorm, exp = rexp, rnorm)
      dist(input$n)
    })
    output$plot <- renderPlot({
      dist <- input$dist
      n <- input$n
      hist(data(), main=paste('r', dist, '(', n, ')', sep=''))
    })
    output$summary <- renderPrint({
      summary(data())
    })
    output$table <- renderTable({
      data.frame(x=data())
    })
  }
)
)

这篇关于右对齐的闪亮元素的mainPanel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！