R:glänzend:vergrößern Sie die Breite des von `TextInput` erstellten Texteingabesteuerelements

Question

Ich habe fast eine Web-App fertiggestellt, mit der der Benutzer den der Web-App zugrunde liegenden Datenrahmen mithilfe des von erstellten Texteingabesteuerelements unterteilen kann textInput;siehe meine verwandte Frage zum Parsen der Zeichenfolge als Ausdruck.

Es wäre benutzerfreundlicher, wenn ich die Breite dieses Texteingabesteuerelements vergrößern könnte.Weiß jemand, wie das geht?

Prost für jede Hilfe.

Answer 1

Wenn Ihr textInput ist wie folgt:

textInput(inputId="someid", label="somelable", value = 0.0)
tags$head(tags$style(type="text/css", "#someid {width: 150px}")),

sie können etwas CSS hinzufügen.

oder

tags$head(
    tags$link(rel = 'stylesheet', type = 'text/css', href = 'styles.css'),
)

und fügen Sie einen entsprechenden Eintrag in styles.css

Answer 2

Ich habe eine erstellt custom.css datei für solche Dinge.

Setzen Sie die custom.css datei in einem www verzeichnis im App-Home-Verzeichnis.

Fügen Sie diese Zeile dem custom.css datei, damit alle Auswahleingaben auf die volle Breite ihrer Container passen.

.shiny-input-container:not(.shiny-input-container-inline) {
  width: 100%;
}

Dies ist sehr nützlich für Texteingaben oder Dropdown-Listen mit Optionen mit langen Namen oder vielen Optionen.Es lässt die App auch nur voller aussehen.Ich habe alle meine Filter oben auf der Seite platziert und es gibt viel Leerraum, wenn ich die Eingaben nicht zwinge, ihre Container zu füllen.

Dann können Sie Ihre Eingabegröße einfach in der Benutzeroberfläche steuern.R-Datei, indem Sie die Breite der Spalte festlegen, die den Eingabecontainer enthält.So etwas in der Art...

fluidRow(
  column(4, offset = 0, align = 'center', uiOutput(ns("select_category_type"))),
  column(4, offset = 0, align = 'center', uiOutput(ns("select_category_group"))),
  column(4, offset = 0, align = 'center', uiOutput(ns("select_category")))
),
fluidRow(
  column(6, offset = 3, align = 'center', uiOutput(ns("select_year")))
)

```

Sie müssen auch Ihre benutzerdefinierte laden.css-Datei in der Benutzeroberfläche.R-Datei.Sie können dies als erste Anweisung in der tun dashboardBody funktion bei Verwendung von shiny Dashboard oder in der fluidPage funktion bei Verwendung der Standard-Benutzeroberfläche.

dashboardBody(
  includeCSS("www/custom.css"),
  tabItems(...