Shiny.Semantic 侧边栏布局不符合 R 中的预期行为答案

【问题标题】：Shiny.Semantic sidebar layout not conforming to expected behavior in RShiny.Semantic 侧边栏布局不符合 R 中的预期行为
【发布时间】：2021-02-26 00:47:20
【问题描述】：

Shiny.semantic repo 标识以下示例代码。在 UI 演示中，这显示为有一个侧边栏，然后一个面板并排有两张卡片。但是，当在 Golem 项目中本地运行时，我看到所有内容都垂直堆叠，并且侧边栏没有显示侧边栏行为。

此外，我将这段代码移到了它自己的非项目 R 文件中，并在 RStudio 和 Chrome 的预览窗口中以相同的行为运行它。

有没有人看到这种行为，对修复有什么想法？稍后我将使用 R 4.X 进行测试，但希望这不是版本问题。

ui <- semanticPage(


title = "My first page",
  h1("My page"),
  sidebar_layout(
    sidebar_panel(
      dropdown_input("mtcars_dropdown", c("mpg", "cyl", "disp", "hp"), value = "mpg"),
      textOutput("dropdown")
    ),
    main_panel(
      segment(
         cards(
           class = "two",
           card(class = "red",
             div(class = "content",
                 div(class = "header", "Main title card 1"),
                 div(class = "meta", "Sub title card 1"),
                 div(class = "description", "More detail description card 1")
             )
           ),
           card(class = "blue",
             div(class = "content",
                 div(class = "header", "Main title card 2"),
                 div(class = "meta", "Sub title card 2"),
                 div(class = "description", "More detail description card 2")
             )
           )
         )
      )
      )
    )
)

server <- function(input, output, session) {
  output$dropdown <- renderText(input$mtcars_dropdown)
}

shinyApp(ui, server)

平台 x86_64-w64-mingw32
拱 x86_64
操作系统 mingw32
系统 x86_64、mingw32
状态
专业 3
次要 6.3
2020 年
02月
第 29 天
svn 版本 77875
语言 R
version.string R 版本 3.6.3 (2020-02-29) 昵称拿着风向袋

附加信息以下代码应明确设置网格系统以复制应为原生的内容。在 R 版本 4.0.3 中运行时，这仍然会垂直显示所有内容。

ui <- semanticPage(
    shinyjs::useShinyjs(),
    
    grid(
        grid_template = grid_template(
            default = list(
                areas = rbind(
                    c("title", "title"),
                    c("sidebar", "cardarea"),
                    c("sidebar", "cardarea")
                ),
                cols_width = c("25%", "75%"),
                rows_height = c("40px", "100px", "auto")
            )
        ),
    
    
    
    title = "My first page",
    h1("My page"),
    sidebar = sidebar_layout(
        sidebar_panel(
            dropdown_input("mtcars_dropdown", c("mpg", "cyl", "disp", "hp"), value = "mpg"),
            textOutput("dropdown")
        ),
        main_panel()
    ),
        cardarea = 
            segment(
                cards(
                    class = "two",
                    card(class = "red",
                         div(class = "content",
                             div(class = "header", "Main title card 1"),
                             div(class = "meta", "Sub title card 1"),
                             div(class = "description", "More detail description card 1")
                         )
                    ),
                    card(class = "blue",
                         div(class = "content",
                             div(class = "header", "Main title card 2"),
                             div(class = "meta", "Sub title card 2"),
                             div(class = "description", "More detail description card 2")
                         )
                    )
                )
            )
        
    )
    
)

server <- function(input, output, session) {
    output$dropdown <- renderText(input$mtcars_dropdown)
}

shinyApp(ui, server)

我还尝试比较 2020 年比赛中使用 Shiny.Semantic 的应用。这是来自 Appsilon.ai 网站上的 FIFA 示例

这是来自本地运行的相同代码。颜色不同，布局不正确。

【问题讨论】：

我看到所有 UI 组件并排显示，与他们的 repo 中显示的相同。虽然我使用的是 R 4.0.3，但我非常怀疑这是一个 R 版本问题。
我也怀疑是版本问题。在 R 4.0.3 的我的 MAC 上在家中加载它，并且我也看到它是垂直的。非常令人困惑。

标签： r shiny semantic-ui

【解决方案1】：

这个格式问题似乎与当前 git 版本的 shiny.semantic 有关。 0.4.2版

卸载发行版并安装开发版可更正问题，shiny.semantic 格式正确。

remotes::install_github("Appsilon/shiny.semantic@develop")

【讨论】：