Höhe von Text Eingabefeld mit Benutzereingabe anpassen

Question

Gibt es eine Möglichkeit, es so zu machen, dass, wenn ein Benutzer das Ende der "Zeile" in einem TextInput-Feld erreicht, dass es in der nächsten Zeile fortgesetzt und die Höhe des Textfelds erhöht dass sie die Gesamtheit dessen sehen können, was sie geschrieben haben? Im Augenblick wird der Text in der gleichen Zeile fortgesetzt, wodurch das zuerst Getippte nicht mehr sichtbar ist. Das Erhöhen der Höhe der Textbox würde auch funktionieren, wenn sie das Ende der Textbox erreichen würden, dann erscheint eine Bildlaufleiste, die es ihnen erlaubt, an die Spitze der Eingabe zurückzukehren.

library('shiny') 
ui<-fluidPage(
    fluidRow(
    textInput(inputId = "response1", label = "Type your Response Below") 
)) 
server<-function(input,output,session) 
{} 
shinyApp(ui=ui, server=server) 

Answer 1

Kurz gesagt, ist mein Vorschlag einen HTML-Tag textarea zu verwenden und dann den CSS-Stil glänzend Widgets zu geben.

Im Beispiel unten Ich hatte erstellt zunächst ein neues div, in dem ich den HTML-Tag setzte textarea mit id=response2 und einem Label. Dann fügte ich den css-Stil von textInput hinzu und wendete ihn an das textarea-Tag mit den Tags head und style an.

---

Voll Beispiel:

library(shiny) 
ui <- fluidPage(

    # Default style of normal textInput applied to the textarea (HTML tag) 
    tags$head(
     tags$style("textarea { 
        width:300px; 
        height:34px; 
        display: block; 
        padding: 6px 12px; 
        font-size: 14px; 
        line-height: 1.42857143; 
        color: #555; 
        background-color: #fff; 
        background-image: none; 
        border: 1px solid #ccc; 
        border-radius: 4px; 
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); 
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075); 
        } 

        textarea:focus { 
        border-color: #66afe9; 
        outline: 0; 
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); 
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) 
       }" 
    ) 
    ), 


    h3("Normal text input"), 
    textInput(inputId = "response1", label = "Type your Response Below"), 


    h3("Styled textarea"), 
    withTags(
     div(
     h5(b("Type your Response Below")), 
     textarea(id = "response2") 
    ) 
    ), 


    br(), 
    h3("Text from the styled textarea"), 
    textOutput("out") 
) 

server<-function(input, output, session) { 
    output$out <- renderText({ 
    input$response2 
    }) 
} 

shinyApp(ui = ui, server = server) 

Edit:

Ein anderer Weg, um die gleiche Sache mit einer kleineren Menge des Codes zu tun wäre, die CSS-Klasse von glänzenden hinzufügen Eingänge form-control shiny-bound-input zu dem textarea Tag und ändern Sie die Breite und die Höhe mit style Attribut.

library(shiny) 
ui <- fluidPage(
    h3("Normal text input"), 
    textInput(inputId = "response1", label = "Type your Response Below"), 

    h3("Styled textarea"), 
    withTags(
     div(
     h5(b("Type your Response Below")), 
     textarea(id = "response2", 
       class = "form-control shiny-bound-input", 
       style = "width: 300px; height: 34px") 
    ) 
    ), 

    br(), 
    h3("Text from the styled textarea"), 
    textOutput("out") 
) 

server<-function(input, output, session) { 
    output$out <- renderText({ 
    input$response2 
    }) 
} 

shinyApp(ui = ui, server = server)