相关疑难解决方法(0)

flex-grow不按预期调整flex项目的大小

似乎flex div中的内容会影响其有关flex-grow属性的计算大小.难道我做错了什么?

在下面提供的小提琴中,你会看到一个数字键盘.除底行外,所有行都包含3个数字.那行应该是'0'是2个数字的宽度,因此flex-grow: 2':'(冒号)是1个数字的大小,因此flex-grow: 1.

我在这里错过了什么吗?

'0'的右侧应与其上方的8,5和2对齐.有点过了.

在此输入图像描述

.numbers {
    display: flex;
    flex-direction: column;
}

.row {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    justify-content: space-between;
}

.button {
    display: flex;
    flex-grow: 1;
    justify-content: center;
    align-items: center;
    margin: 5px;
    border-radius: 5px;
    border: 1px solid gray;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
}

.button#number0 {
    flex-grow: 2;
}

.button#colon {
    flex-grow: 1;
}
Run Code Online (Sandbox Code Playgroud)
<div class="numbers">
    <div class="row">
        <div class="button number" id="number1">1</div>
        <div class="button number" id="number2">2</div>
        <div …
Run Code Online (Sandbox Code Playgroud)

html css css3 flexbox

36
推荐指数
3
解决办法
6318
查看次数

闪亮的R按钮对齐

我的Ui文件中有两个按钮

 submitButton("Analysis"),width=6,downloadButton('downloadData', 'Download Data'))
Run Code Online (Sandbox Code Playgroud)

这给出了以下输出作为应用程序

在此输入图像描述

但是,我正在尝试对齐这些按钮,以便下载数据右对齐,分析按钮位于左侧,而不是现在的样子.我该怎么做?

r shiny

8
推荐指数
1
解决办法
3635
查看次数

添加popovers到闪亮的应用程序?

我想在窗口小部件的标题旁边添加一个(?),以便用户可以悬停或单击它并获取额外的信息和他们可以单击的链接.

这就是我现在所拥有的:

## app.R ##
library(shiny)
library(shinydashboard)
library(shinyBS)
# Header
header <- dashboardHeader()
# Sidebar
sidebar <- dashboardSidebar(fileInput("chosenfile", label = h4("File input"), 
                                      accept = ".csv"),
                            bsButton("q1", label = "", icon = icon("question"),
                                     style = "info", size = "extra-small"),
                            bsPopover(id = "q1", title = "Tidy data",
                                      content = paste0("You should read the ", 
                                                       a("tidy data paper", 
                                                         href = "http://vita.had.co.nz/papers/tidy-data.pdf",
                                                         target="_blank")),
                                      placement = "right", 
                                      trigger = "click", 
                                      options = list(container = "body")
                                      )
                            )
# Body
body <- dashboardBody()
# ui
ui …
Run Code Online (Sandbox Code Playgroud)

r twitter-bootstrap shiny shinybs

6
推荐指数
1
解决办法
3583
查看次数

如何在shiny :: numericInput中使标签和框彼此对齐?

是否可以numericInput()在标签旁边创建一个闪亮的盒子(而不是默认的下面).

这是一个简单的例子:

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)
Run Code Online (Sandbox Code Playgroud)

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

(不幸的是我真的不知道html和css直接修改输入小部件的类.)

是一个类似的问题.但我可以使用fluidRow()处理同一行,我希望标签也在同一行.

r widget shiny

5
推荐指数
2
解决办法
1530
查看次数

Shinydashboard::box 中的 splitLayout

目标

我想在actionButtonaselectInput的页脚中放置 a旁边shinydashboard::box。根据this SO question splitLayout应该做我想做的。

问题

selectInput没有填满整个空间,投入页脚时。似乎一旦在页脚中,selectInput总是采用固定的宽度。有趣的是,当将相同的元素放入框体时,控件会按预期呈现。

我如何管理它selectInputactionButton

  1. 彼此相邻并且
  2. 跨越整条线?

代码

library(shiny)
library(shinydashboard)

boxUI <- function(width) {
  box(
    splitLayout(
      selectInput("x", NULL, paste(strrep("x", 10), 1:10)),
      actionButton("ok", icon("trash")),
      cellWidths = c("85%", "15%"),
      cellArgs = list(style = "vertical-align: top")),
    footer = splitLayout(
      selectInput("y", NULL, paste(strrep("x", 10), 1:10)),
      actionButton("ok", icon("trash")),
      cellWidths = c("85%", "15%"),
      cellArgs = list(style = "vertical-align: top")
    ), width = width, solidHeader = TRUE, …
Run Code Online (Sandbox Code Playgroud)

r shiny shinydashboard

1
推荐指数
1
解决办法
1122
查看次数

标签 统计

r ×4

shiny ×4

css ×1

css3 ×1

flexbox ×1

html ×1

shinybs ×1

shinydashboard ×1

twitter-bootstrap ×1

widget ×1