Thêm bố cục
Như bạn đã thấy ở các chương trước, việc dùng bố cục trong một ứng dụng Shiny rất quan trọng để tổ chức giao diện và giúp dễ sử dụng hơn.
Hiện tại ứng dụng chỉ có rất ít đối tượng (một tiêu đề, hai input, một đầu ra word cloud) nên vẫn có thể quản lý mà không cần bố cục. Tuy nhiên, ứng dụng sẽ mở rộng ở các bài tập tiếp theo và có một bố cục với thanh bên sẽ hữu ích. Thêm bố cục sớm luôn là ý hay, vì đưa các phần tử UI mới của Shiny vào một bố cục sẵn có sẽ dễ hơn nhiều so với việc sắp xếp lại một ứng dụng lớn không có cấu trúc.
Giống như thường thấy ở các ứng dụng Shiny và ứng dụng tương tác khác, các input sẽ được đặt trong thanh bên (sidebar) nhỏ hơn, còn đầu ra chính (word cloud) sẽ nằm ở panel chính lớn hơn.
Bài tập này là một phần của khóa học
Nghiên cứu tình huống: Xây dựng ứng dụng web với Shiny trong R
Hướng dẫn bài tập
Nhiệm vụ tiếp theo của bạn là thêm một bố cục có thanh bên (sidebar) vào ứng dụng Shiny hiện tại. Không thêm phần tử UI mới nào ngoài phần cấu trúc cho bố cục. Cụ thể:
- Thêm một bố cục sidebar vào UI.
- Bên trong bố cục này, định nghĩa một sidebar panel để chứa hai input.
- Cũng trong bố cục này, định nghĩa một main panel để chứa đầu ra word cloud (dòng 12).
Bài tập tương tác thực hành trực tiếp
Hãy thử làm bài tập này bằng cách hoàn thành đoạn mã mẫu này.
ui <- fluidPage(
h1("Word Cloud"),
# Add a sidebar layout to the UI
___(
# Define a sidebar panel around the inputs
___(
numericInput("num", "Maximum number of words",
value = 100, min = 5),
colourInput("col", "Background color", value = "white")
),
# Define a main panel around the output
___(
wordcloud2Output("cloud")
)
)
)
server <- function(input, output) {
output$cloud <- renderWordcloud2({
create_wordcloud(artofwar,
num_words = input$num, background = input$col)
})
}
shinyApp(ui = ui, server = server)