I would like to align the three boxes below from the UI part of an R shiny to the same horizontal level. They originally were on the same level, However, after I added the helper text ("Label:"), they are no longer on the same level. Any suggestion? Thank you. Below is a reproducible code.
library(shiny)
library(miniUI)
ui <- miniPage(
gadgetTitleBar(h3(strong("UI"), align="center"), left=NULL, right=NULL),
miniTabstripPanel(
miniTabPanel(strong("temp"),
miniContentPanel(
fluidRow(
column(4, radioButtons(inputId="subt", label="Step1:",
inline=TRUE, choices=c("YES", "NO"), selected="YES"),
conditionalPanel(
condition = "input.subt == 'YES'",
fluidRow(
column(4, textInput(inputId="subt.id", label="The step 1 is ...:", ""))
)
)
),
###
### Normalize the response
column(6, radioButtons(inputId="norm", label="Step2:",
inline=TRUE, choices=c("YES", "NO"), selected="YES"),
conditionalPanel(
condition = "input.norm == 'YES'",
fluidRow(align="center",
column(4, textInput(inputId="norm.start", label="step 2.1:", "")),
helpText("Label:"),
column(4, textInput(inputId="norm.from", label="step 2.2:", "")),
column(4, textInput(inputId="norm.to", label="step 2.3:", ""))
)
)
)
)
)
)
))
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)
You can apply some css to align the label text.
div(helpText("Label:"),style = "margin-top: -35px"),
Complete code :
library(shiny)
library(miniUI)
ui <- miniPage(
gadgetTitleBar(h3(strong("UI"), align="center"), left=NULL, right=NULL),
miniTabstripPanel(
miniTabPanel(strong("temp"),
miniContentPanel(
fluidRow(
column(4, radioButtons(inputId="subt", label="Step1:",
inline=TRUE, choices=c("YES", "NO"), selected="YES"),
conditionalPanel(
condition = "input.subt == 'YES'",
fluidRow(
column(4, textInput(inputId="subt.id", label="The step 1 is ...:", ""))
)
)
),
###
### Normalize the response
column(6, radioButtons(inputId="norm", label="Step2:",
inline=TRUE, choices=c("YES", "NO"), selected="YES"),
conditionalPanel(
condition = "input.norm == 'YES'",
fluidRow(align="center",
column(4, textInput(inputId="norm.start", label="step 2.1:", "")),
div(helpText("Label:"),style = "margin-top: -35px"),
column(4, textInput(inputId="norm.from", label="step 2.2:", "")),
column(4, textInput(inputId="norm.to", label="step 2.3:", ""))
)
)
)
)
)
)
))
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)
Related
In the example below how I can have "Input two" match the appearance of "Input one" in terms of bolding the font and putting the label above the checkbox?
I imagine the answer is some kind of css wizardry but not sure how to approach it.
ui <- fluidPage(
fluidRow(
column(3,
sliderInput(inputId = "foo",label="Input one",min = 0,max = 100,value = 50,step = 10)
),
column(3,
checkboxInput(inputId = "bar",label="Input two")
)
)
)
)
server <- function(input, output, session) {}
shinyApp(ui, server)
One simple solution could be:
library(shiny)
ui <- fluidPage(
fluidRow(
column(3,
sliderInput(inputId = "foo",label="Input one",min = 0,max = 100,value = 50,step = 10)
),
column(3,
p(strong("Input two")),
checkboxInput(inputId = "bar",label=NULL)
)
)
)
server <- function(input, output, session) {}
shinyApp(ui, server)
I'm working on a shiny app with dynamic rendering. When the user uncheck the box, he must have an output with 8 wellPanel and when the box is checked, he must have two wellPanel. I used the function renderUI to generate output but when the box is unchecked, I only have 4 wellPanel instead of 8. This is what I did :
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
body <- dashboardBody(
tabItems(
tabItem(tabName = "menutab1",
checkboxInput(inputId = "my_id", "check the box", value = TRUE),
####### renderUI #####
uiOutput("results")
)
)
)
ui <- dashboardPage(
title = "test",
options = list(sidebarExpandOnHover = TRUE),
header = dashboardHeader(disable = FALSE),
sidebar = dashboardSidebar(
minified = TRUE, collapsed = TRUE,
sidebarMenu(id="mymenu",
menuItem("first", tabName = "tab1", icon = icon("fas fa-acorn"),
menuSubItem('menu 1',
tabName = 'menutab1',
icon = icon('fas fa-hand-point-right'))
)
)
),
body
)
############# SERVER ############
server <- function(input, output) {
output$results <- renderUI({
if(input$my_id){
# object 1
fluidRow(
column(6,
wellPanel(
h1("A")
),
br(),
wellPanel(
h1("B")
)
)
)
} else {
# object 2 : doesnt show, why ?
fluidRow(
column(6,
wellPanel(
h1("C")
),
br(),
wellPanel(
h1("D")
)
),
column(6,
wellPanel(
h1("E")
),
br(),
wellPanel(
h1("F")
)
)
)
# object 3 : I only got this
fluidRow(
column(6,
wellPanel(
h1("H")
),
br(),
wellPanel(
h1("I")
)
),
column(6,
wellPanel(
h1("J")
),
br(),
wellPanel(
h1("K")
)
)
)
}
})
}
############# RUN #############
shinyApp(ui = ui, server = server)
How can we fix that ?
Some help would be appreciated
The problem with your above code is, that only the last object of the else statement is returned. You can wrap both fluidRows in a tagList to get the desired output.
library(shiny)
library(shinydashboard)
library(shinydashboardPlus)
body <- dashboardBody(tabItems(tabItem(
tabName = "menutab1",
checkboxInput(inputId = "my_id", "check the box", value = TRUE),
uiOutput("results")
)))
ui <- dashboardPage(
title = "test",
options = list(sidebarExpandOnHover = TRUE),
header = dashboardHeader(disable = FALSE),
sidebar = dashboardSidebar(
minified = TRUE,
collapsed = TRUE,
sidebarMenu(
id = "mymenu",
menuItem(
"first",
tabName = "tab1",
icon = icon("fas fa-acorn"),
menuSubItem(
'menu 1',
tabName = 'menutab1',
icon = icon('fas fa-hand-point-right')
)
)
)
),
body
)
server <- function(input, output) {
output$results <- renderUI({
if (input$my_id) {
fluidRow(column(6,
wellPanel(h1("A")),
br(),
wellPanel(h1("B"))
)
)
} else {
tagList(
fluidRow(
column(6,
wellPanel(h1("C")),
br(),
wellPanel(h1("D"))),
column(6,
wellPanel(h1("E")),
br(),
wellPanel(h1("F")))
),
fluidRow(
column(6,
wellPanel(h1("H")),
br(),
wellPanel(h1("I"))),
column(6,
wellPanel(h1("J")),
br(),
wellPanel(h1("K")))
)
)
}
})
}
shinyApp(ui = ui, server = server)
I am new in shiny, I wonder how to put the "=" close beside the selectInput box?
library(shiny)
ui = fluidPage(
mainPanel(
titlePanel("Calculation:"),#Voltage calculation
fluidRow(
column(3,
selectInput("selc11", h4("Cable"),#Resistivity
choices = list("Copper" = 0.0174, "Alum" = 0.0282), selected = 1)),
h4("=")
)
)
)
server = function(input, output) {
}
shinyApp(ui = ui, server = server)
If you want something like this:
You can achive it with:
library(shiny)
library(shinyjs)
ui = fluidPage(
useShinyjs(),
mainPanel(
titlePanel("Calculation:"),#Voltage calculation
fluidRow(
column(1, h4('Cable')),
column(3, selectInput(
"selc11",
label = '',
choices = list("Copper" = 0.0174, "Alum" = 0.0282), selected = 1)
),
column(3, h4("="))
)
)
)
server = function(input, output) {
runjs("$('label.control-label').remove()")
}
shinyApp(ui = ui, server = server)
I got this UI
(reproductible code):
library(shiny)
ui <- fluidPage(
sidebarPanel(
tabsetPanel(
tabPanel("tab1", checkboxInput("opt1", "opt1 for 1 tab")),
tabPanel("tab2", checkboxInput("opt2", "opt2 for 2 tab"))
)
),
mainPanel(
navbarPage("choose page",
navbarMenu("page1",
tabPanel("panel1",
mainPanel(plotOutput("plot1"))
),
tabPanel("panel2", plotOutput("plot2"))
),
navbarMenu("page2", tabPanel("panel3", plotOutput("plot3")), tabPanel("panel4", plotOutput("plot4")))
)
)
)
server <- function(input, output){
}
shinyApp(ui, server)
I want to add in sidebarPanel:
checkboxInput ONLY for page1 and panel1
checkboxInput ONLY for page1 (common for panel1 and panel2)
is it possible with shiny?
Yes, put an id to the navbarPage and use conditionalPanel:
ui <- fluidPage(
sidebarPanel(
conditionalPanel(
'input.navbar == "panel1"',
checkboxInput("checkbox1", "Hello")
),
conditionalPanel(
'input.navbar == "panel1" || input.navbar == "panel2"',
checkboxInput("checkbox1", "Goodbye")
)
),
mainPanel(
navbarPage("choose page",
navbarMenu("page1",
tabPanel("panel1",
mainPanel(plotOutput("plot1"))
),
tabPanel("panel2", plotOutput("plot2"))
),
navbarMenu("page2", tabPanel("panel3", plotOutput("plot3")), tabPanel("panel4", plotOutput("plot4"))),
id = "navbar"
)
)
)
Why it doesn't work good?
library(shiny)
ui <- fluidPage(
navbarPage("Choose page: " ,
navbarMenu("Discovering the dataset",
sidebarPanel(
checkboxInput("x", "x")
),
tabPanel("volume", mainPanel(plotOutput("pp"))),
tabPanel("amount salary"),
tabPanel("map"),
tabPanel("data"),
tabPanel("animation"),
tabPanel("wordcloud")
),
navbarMenu("Options"),
navbarMenu("More information")
)
)
server <- function(input, output){
output$pp <- reactivePlot({plot(1,1)})
}
shinyApp(ui, server)
here I want the checkbox for all barpage Discovering the dataset
I have a tabsetPanel() and I try to hide one tabPanel() if choice is two and checkbox is on. I tried the following code to do that, however it does not work.
ui
shinyUI(
fluidPage(
titlePanel("Hello Shiny!"),
sidebarLayout(
sidebarPanel(
fluidRow(
column(5,
radioButtons("radio", label = h5("Data uploaded"),
choices = list("Aff" = 1, "Cod" = 2,
"Ill" = 3),selected = 1)
)),
checkboxInput("checkbox", "cheb", value = F)
),
mainPanel(
tabsetPanel(
tabPanel("Plot", "plot1"),
conditionalPanel(
condition = "input.radio !=2 && input.checkbox == false",
tabPanel("Summary", "summary1")
),
tabPanel("Table", "table1")
)
)
)
)
)
server
shinyServer(function(input,output,session){
})
How can I hide a tabPanel()?
You could do it with renderUI():
Create the tabpanels() in a list within the renderUI()
and conditionally add the third one:
if(input$radio == 2 & !input$checkbox)
and then return the whole tabsetPanel() with do.call(tabsetPanel, panels).
ui <- shinyUI(
fluidPage(
titlePanel("Hello Shiny!"),
sidebarLayout(
sidebarPanel(
fluidRow(
column(5,
radioButtons("radio", label = h5("Data uploaded"),
choices = list("Aff" = 1, "Cod" = 2,
"Ill" = 3),selected = 1)
)),
checkboxInput("checkbox", "cheb", value = F)
),
mainPanel(
uiOutput("summary")
)
)
)
)
server <- shinyServer(function(input,output,session){
output$summary <- renderUI({
panels <- list(
tabPanel("Plot", "plot1"),
tabPanel("Table", "table1")
)
if(input$radio == 2 & !input$checkbox) panels[[3]] <- tabPanel("Summary", "summary1")
do.call(tabsetPanel, panels)
})
})
shinyApp(ui, server)