R包shiny开发网页--2.UI

ui（user interface）是用户界面，也就是用户看到的网页显示些什么，是台前工作，而server则是幕后工作。

1.界面布局

代码来自shiny的cheatsheet。公众号后台回复shiny即可获得。

（1）fluidRow()

ui <- fluidPage(
fluidRow(column(width = 4),
column(width = 2, offset = 3)),
fluidRow(column(width = 12))
)

（2）flowLayout()

ui <- fluidPage(
flowLayout( # object 1,
# object 2,
# object 3
)
)

（3）sidebarLayout()常用

ui <- fluidPage(
sidebarLayout(
sidebarPanel(),
mainPanel()
)
)

（4）splitLayout()

ui <- fluidPage(
splitLayout( # object 1,
# object 2
)
)

（5）verticalLayout()

ui <- fluidPage(
verticalLayout( # object 1,
# object 2,
# object 3
)
)

2.选项卡、导航栏、标签页

选项卡

ui <- fluidPage( tabsetPanel(
tabPanel("tab 1", "contents"),
tabPanel("tab 2", "contents"),
tabPanel("tab 3", "contents")))
server<-function(input,output){
}
shinyApp(ui=ui,server=server)

导航栏

ui <- fluidPage( navlistPanel(
tabPanel("tab 1", "contents"),
tabPanel("tab 2", "contents"),
tabPanel("tab 3", "contents")))
server<-function(input,output){
}
shinyApp(ui=ui,server=server)

标签页

ui <- navbarPage(title = "Page",
tabPanel("tab 1", "contents"),
tabPanel("tab 2", "contents"),
tabPanel("tab 3", "contents"))
server<-function(input,output){
}
shinyApp(ui=ui,server=server)

3.html元素

ui <- fluidPage(
  h1("标题1"),
  hr(),
  br(),
  p(strong("文字加粗")),
  p(em("文字倾斜")),
  p(code("代码")),
  a(href="", "链接"),
  HTML("<p>Raw html</p>")
)
server<-function(input,output){
}
shinyApp(ui=ui,server=server)

显示效果：

4.交互式控件inputs和outputs

用户可以在网页上做什么，比如输入文字、文件等等，输出网页会给用户反馈什么，比如图表。这一来一回的互动就叫“交互”

（1）inputs--输入

• 文字输入--textInput
• 数字输入--numericInput
• 密码输入--passwordInput
• 选择输入--框选、单选、多选
  • selectInput
  • radioButtons
  • checkboxGroupInput
    （学到这里发现把计算器脚本里的checkboxGroupInput改成radioButtons，就是把多选变成了单选咯）
• 滑动输入--sliderInput
• 提交按钮--submitButton
• 上传文件--fileInput
• action Button
• 日期输入dateInput
• 日期范围输入dateRangeInput

（2）outputs输出

表格、图片、图表、界面
（还没搞透先不写了，学到这里可以自己看小抄咯）