更改閃亮應用程序的佈局

Question

我構建了一個閃亮的應用程序，告訴您剩餘多少天，直到您的生日。但在視覺上，我想文本是在一排，而它是目前這樣的：

我想這應該很容易，但我是新的閃亮，並沒有真正得到它。 這是我的代碼： 庫（閃亮）

ui <- (shinyUI(fluidPage(
    sidebarPanel(
    strong("Wann wurdest du geboren?"), 
    selectInput("a1",label="Tag", choices=(c(1:31))), 
    selectInput("a2",label="Monat", choices=(c(1:12))), 
    selectInput("a3",label="Jahr", choices=(c(1940:year(Sys.time())))), 

    mainPanel(
     verbatimTextOutput('a_out'), 

     # UI output 
     uiOutput("b1") 
) 
)))) 

server <- shinyServer(function(input, output) { 
    data <- reactive({ 
    Geburtsdatum <- paste0(input$a1,".", input$a2, ".", input$a3) 
    Uhrzeit <- "00:00:01" 
    Geb <- paste(Geburtsdatum, Uhrzeit) 
    geburt <- strptime(c(Geb), format = "%d.%m.%Y %H:%M:%S", tz = "CET") 
    geburtstag <- geburt 
    year(geburtstag) <- year(Sys.time()) 
    gebu <- geburtstag - Sys.time() 
    if(gebu < 0){year(geburtstag) <- year(Sys.time())+1} 
    gebu <- geburtstag - Sys.time() 
    Alter <- ceiling((Sys.time() - geburt)/365) 
    runden <- function(Wert){ 
    trunc(Wert) 
    } 
    decimalpl <- function(Wert){ 
    Wert-trunc(Wert) 
    } 
    list(a = (trunc(gebu)), 
     b = (runden(decimalpl(gebu)*24)), 
     c = (runden(decimalpl(decimalpl(gebu)*24)*60)), 
     d = (runden(decimalpl(decimalpl(decimalpl(gebu)*24)*60)*60)), 
     e = (paste(Alter,".", sep=""))) 
    }) 
    output$b1 <- renderUI({ 
    strong(paste("Noch", data()$a, "Tage,", 
       data()$b, "Stunden,", 
       data()$c, "Minuten, und", 
       data()$d, "Sekunden bis zu deinem", 
       data()$e, "Geburtstag!")) 
    }) 
    }) 


shinyApp(ui = ui, server = server) 

真的謝謝了！ 上限：我可以讚美backgorund和文本嗎？或者包含一張圖片？

Answer 1

至於你的應用程序的樣式，這裏是一個例子，給出瞭如何給你的文本，背景和添加圖像上色的提示。

我希望這會有所幫助。

library(shiny) 

ui <- shinyUI(
    fluidPage(
    sidebarPanel(style = "background-color: orange;", 
     strong("Wann wurdest du geboren?"), 
     selectInput("a1",label="Tag", choices=(c(1:31))), 
     selectInput("a2",label="Monat", choices=(c(1:12))), 
     selectInput("a3",label="Jahr", choices=(c(1940:year(Sys.time())))) 
    ), 
    mainPanel(
     #verbatimTextOutput('a_out'), 
     tags$img(src = "http://media.kuechengoetter.de/media/735/13553229675100/geburtstag-kuechengoetter.jpg", style = "z-index: -1; position: fixed;"), 
     # UI output 
     uiOutput("b1", style = "color: blue;") 
    ) 
)) 

server <- shinyServer(function(input, output) { 
    data <- reactive({ 
    Geburtsdatum <- paste0(input$a1,".", input$a2, ".", input$a3) 
    Uhrzeit <- "00:00:01" 
    Geb <- paste(Geburtsdatum, Uhrzeit) 
    geburt <- strptime(c(Geb), format = "%d.%m.%Y %H:%M:%S", tz = "CET") 
    geburtstag <- geburt 
    year(geburtstag) <- year(Sys.time()) 
    gebu <- geburtstag - Sys.time() 
    if(gebu < 0){year(geburtstag) <- year(Sys.time())+1} 
    gebu <- geburtstag - Sys.time() 
    Alter <- ceiling((Sys.time() - geburt)/365) 
    runden <- function(Wert){ 
     trunc(Wert) 
    } 
    decimalpl <- function(Wert){ 
     Wert-trunc(Wert) 
    } 
    list(a = (trunc(gebu)), 
     b = (runden(decimalpl(gebu)*24)), 
     c = (runden(decimalpl(decimalpl(gebu)*24)*60)), 
     d = (runden(decimalpl(decimalpl(decimalpl(gebu)*24)*60)*60)), 
     e = (paste(Alter,".", sep=""))) 
    }) 
    output$b1 <- renderUI({ 
    strong(paste("Noch", data()$a, "Tage,", 
       data()$b, "Stunden,", 
       data()$c, "Minuten, und", 
       data()$d, "Sekunden bis zu deinem", 
       data()$e, "Geburtstag!")) 
    }) 
}) 


shinyApp(ui = ui, server = server)