如何在闪亮的::数字输入中使标签和框彼此对齐? [英] How to make label and box align next to each other in shiny::numericInput?

问题描述

是否可以为闪亮的 numericInput() 创建一个 numericInput() ，其中框位于标签旁边(而不是在标签旁边，这是默认设置).

Is it possible to create a numericInput() for shiny where box is next to the label (instead of below it which is the default).

这是一个简单的例子:

library(shiny)

ui <- shinyUI(fluidPage(

    titlePanel("Shiny with lots of numericInput()"),

    sidebarLayout(

        sidebarPanel(
            fluidRow(
                column(6, numericInput("a1", label = "A1", value = 1)),
                column(6, numericInput("b1", label = "B1", value = 1))
            ),
            fluidRow(
                column(6, numericInput("a2", label = "A2", value = 2)),
                column(6, numericInput("b2", label = "B2", value = 2))
            )
        ),

        mainPanel(
            p('something interesting')
        )
    )
))

server <- function(input, output) {}

shinyApp(ui, server)

这导致 4 行:第一行用于标签A1"和B1"，第二行用于相应的框，等等.如果我尝试调整 width 参数没有帮助numericInput().

This results in 4 lines: first line for the labels "A1" and "B1", second line for the corresponding boxes, etc. It does not help if I try to adjust the width parameter of numericInput().

(可惜我不是很懂 html 和 css 直接修改 input 小部件的类.)

(Unfortunately I do not really know html and css to modify the class of the input widget directly.)

这里是一个类似的问题.但是我可以使用fluidRow()处理同一行，我希望标签也位于同一行.

Here is a similar issue. But I can handle the same row with fluidRow(), I want the labels to be in the same row as well.

推荐答案

好问题，这也与其他控件相关.我感觉到你的痛苦.下面的解决方案是我使用的，但并不理想.如果可以将其设置为控件中的闪亮参数会更好.HTML/CSS 解决方案也很可能看起来更好.

Good question, that is also relevant to other controls. I feel your pain. The solution below is what I use, but is not ideal. It would be better if this could be set as a shiny parameter in the control. An HTML/CSS solution will most likely also look better.

 library(shiny) 
ui <- shinyUI(fluidPage(
  titlePanel("Shiny with lots of numericInput()"), 
   sidebarLayout(  
     sidebarPanel(
        fluidRow(
            column(2,  HTML('<b>A1</b>')),
            column(4, numericInput("a1", label = NULL, value = 1)),
            column(2, HTML('<b>B1</b>')), 
            column(4, numericInput("b1", label = NULL, value = 1))
        ),
        fluidRow(
            column(2, HTML('<b>A2</b>')),
            column(4, numericInput("a2", label = NULL, value = 1)),
            column(2,  HTML('<b>B2</b>')), 
            column(4, numericInput("b2", label = NULL, value = 1))
        )  
    ), 
    mainPanel(
        p('something interesting')
    )
))) 
server <-   function(input, output) { } 
shinyApp(ui, server)

这篇关于如何在闪亮的::数字输入中使标签和框彼此对齐?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！