make a tabPanel x scrollable in Shiny - shiny

I am using rpivotTable inside a tabsetPanel in Shiny.
tabPanel("Pivot Table",
tags$head(tags$style("
div[data-tabsetid='7008'] {
width:500px !important,
height:500px !important,
overflow-x: scroll !important;
}"
)
),
shinycssloaders::withSpinner(
rpivotTableOutput("pivot_table")
)
)
I can't work out how to make the content x-scollable, the data-tabsetid changes every execution, and I dont know in advance how wide the pivot table will be so need to make the content x scrollable.

Related

Changing the text color for matrixInput in sidebar of shinydashboard

I am working with Shinydashboard and I would like to use a matrixInput widget in the sidebar. When I try input a value, the background in the input cell highlights in white and the input text is also white. As a result I am not able to view the text.
I would like to use CSS to change the font colour to black, but I am not getting it right. I included a simple example below of my problem.
Kind regards
Daniel
library(shiny)
library(shinydashboard)
library(shinyMatrix)
mat <- matrix(rep("text", 9), 3, 3)
ui <- dashboardPage(
dashboardHeader(),
dashboardSidebar(
tags$style(".skin-blue .sidebar .matrix-input-cell {color: #444; }"), #my attempted css to change the color of the text
matrixInput(
"mInput",
value = mat,
class = "character"
)
),
dashboardBody()
)
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)
You need to modify the CSS when the matrix cell is active.
By the way, I found this using the browser inspector mode of CSS and HTML, and activating the ":active" option in CSS (you also have ":hover", ":focus" ...)
tags$style(".vue-input td.active, .vue-input th.active {color: #444;}")
Edit : note that if you have another table in your app, it may affect it because I modified the CSS class and not a div. You will need to parent the CSS modifications with your input id if you want to make sure only this matrix input have black text when a cell is active

Shiny fileInput widget in sidebar scrolls to the top of the page

My shinyApp has lots of input options in the sidebar that go well below the screen height and the user access them after scrolling. One of the last options at the bottom of the scrolling is a fileInput widget. When one clicks on it, the page automatically jumps to the top of the sidebar right before the file browser opens.
Is there a way to avoid that automatic scrolling/jump?
I'm using Shiny v 1.7.1. I'm not 100% sure, but I think this was not the behavior of fileInput in past versions of Shiny (?).
This is an example of what happens in my case, but limited to 500 px for simplicity. Just imagine a much longer list of input options with different widgets.
ui <- fluidPage(
sidebarLayout(
sidebarPanel(
width = 4,
style = "height: 500px; overflow-y: scroll;",
fileInput("file1", "Choose file 1"),
fileInput("file2", "Choose file 2"),
fileInput("file3", "Choose file 3"),
fileInput("file4", "Choose file 4"),
fileInput("file5", "Choose file 5"),
fileInput("file6", "Choose file 6"),
fileInput("file7", "Choose file 7"),
),
mainPanel(
# something very interesting is shown here
)
)
)
server <- function(input, output) {
# something very interesting is done here
}
shinyApp(ui, server)

Shiny - how to center and fix width of dashboard

Hello R Studio Community,
I've been developing an app in Shiny and it's be great. I have one simple question.
As different browsers have different widths, is there a way to set the rule on resizing the Shiny dashboard based on the following:
1) If browser width is more than x, limit to width to x and center the entire dashboard
2) If browser width is less than x, follow default autosizing
3) Not essential. But how do I set the blank space color to the left and right of the dashboard
The motivation is that I need a fixed width so that some pictures are scaled correctly. I hope my request can be done through some div tag on the dashboardPage.
This is the current behavior which I do NOT want.
Shiny dashboard stretches to fit window
Cheers,
Donny
Hi to achive what you are asking for just add the following code to the beginning of your dashboardBody. something like this
dashboardBody(
tags$head(
tags$style(
"body{
min-height: 611px;
height: auto;
max-width: 800px;
margin: auto;
}"
)
),
... #the rest of you ui code
hope this helps

Customize the size of a modal window in ShinyBS

I recently used shinyBS to create a modal window, as in
bsModal(id, title, trigger, ..., size)
The size argument is either 'small' or 'large' (or absent).
As you can see, even the large window is pretty small and things get packed in pretty tightly:
Is there any possible hack anyone out there has found that can help to customize the size of the window?
I know this topice is old but since I found a solution I post it for the person going here to find an answer.
You can do it by changing the CSS style. At the begging of your app just precise :
.modal-lg {
width: 4000px;
}
or
.modal-lg {
width: 95%;
}
To change the size of the size = "large"argument in the modal or
.modal-sm {
width: 40px;
}
to change for the small one. Of course change the px to change the size as you want to.
In your application, put the code here to have it available for your app:
dashboardBody(
tags$head(tags$style(HTML('
.modal-lg {
width: 4000px;
}
'))),
#ALL YOUR APP GOES HERE
)

reactive Slider in Shiny and rendering a html file does not work together

I would like to use tabPanels and have a problem with the combination of a reactive Slider and including a html file in ui.R. It seems that this problem is not due to tabPanel and also shows up when I put it all with includeX in the mainPanel.
If I do this like shown here I get Panel text with formulas rendered right, but the slider is messed up.
If the text is included as rmd ( or as md ) the slider is shown right, but the formulas are not rendered right.
I have posted a similar, but slightly different question here at stackoverflow, these question may have the same reason, but I am not sure.
server.R
library(shiny)
shinyServer(function(input, output, session) {
output$first <- renderUI({
sliderInput('xScale', '',
min=7.0,max=9.0, value=c(7.5, 8.5), step=0.01)
})
session$onSessionEnded(function() {
stopApp()
})
})
ui.R
shinyUI(fluidPage(
titlePanel("Test"),
sidebarLayout(
sidebarPanel(
uiOutput('first')
),
mainPanel(
tabsetPanel(
tabPanel('Text', includeHTML("post.html"))
#tabPanel('Text', includeMarkdown('post.rmd'))
)
)
)
)
)
Any help is appreciated. Thanks.