IRscope代码拆解二:ui相关的代码

2020-06-16 10:54:26 浏览数 (1)

IRscope是用来可视化叶绿体基因组边界收缩扩张的一个shiny应用。最想学习的是其中鉴定反向重复区的代码和画图用到的代码。

但是这两个函数实在是太长了,看起来还有些吃力。

今天记录一下ui相关的代码

他的ui代码主要用到的就是tabPanel,里面没有太复杂的知识点。

以下是自己手动敲的代码

代码语言:javascript复制
library(shiny)

ui <- fluidPage(
  tags$br(),
  HTML('<!DOCTYPE html>
       <html>
       <head>
       <style type="text/css">
       h1 {color:#267A43}
       </style>
       </head>
       <body>
       <div>
       <h1>IRScope</h1>
       </div>
       </body>
       </html>'),
  tags$br(),
  fluidRow(column(width = 1,""),
           column(width=11,offset = 1,tabsetPanel(
             tabPanel(strong("Home"),br(),
                      column(width = 6,h4(tags$em("Welcome to IRscope...")),
                             br(),p(tags$strong("IRscope"),"is a tool for "))),
             tabPanel("Files upload",br(),
                      fluidRow(column(width=11,br(),p("You need .."))),
                      br(),br(),br(),
                      tabsetPanel(tabPanel("GB file",br(),br(),p("In this section you can")),
                                  fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
                                           column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
                                           column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
                                           column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
                                           column(width=1,br())),
                                  fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
                                           column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
                                           column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
                                           column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
                                           column(width=1,br())),
                                  fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
                                           column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
                                           column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
                                           column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
                                           column(width=1,br())),
                                  fluidRow(column(width=2,textInput(inputId = "acc1",label = "Accession No.",placeholder = "1st Accession..")),
                                           column(width = 3,fileInput(inputId = "data1",label="GenBank File",placeholder = "Or GB file")),
                                           column(width = 5,br(),verbatimTextOutput("sp1",placeholder = TRUE)),
                                           column(width = 1,strong("SSC"),br(),checkboxInput("S1",label=icon("transfer",lib="glyphicon"),value=FALSE)),
                                           column(width=1,br())),
                                  column(width=10,verbatimTextOutput("stat"),actionButton("Gbsub",label = "Submit"),
                                         br(),br(),p("After submission the section below will turn innactive")),
                                  downloadButton("downloadData",label="Download"))),
             tabPanel("Manual Files",br(),p("In case your GB files are of low quality or otherwise"),
                      fluidRow(br(),
                               column(width=3,fileInput(inputId="dogma1",label = "Annotations",placeholder = "And Fasta file")),
                               column(width = 6,textInput(inputId = "IR1",label = "IR info (optional)",placeholder = "IR end, IRb start, IRa end")),
                               column(width = 2,br())),
                      fluidRow(column(width=3,fileInput(inputId = "fas1",label = "Genome Fasta",placeholder = "And Fasta file"))),
                      column(width = 10,actionButton("Go","Submit"),br(),br(),p("After submission"))),
             tabPanel("FAQ",br(),column(width=1,""),br(),
                      column(width = 6,h4(strong("Q:"),tags$em(strong("Why the gene names are not displayed properly?"))),
                             p(strong("A:"),"Check your input file(s)"),br(),
                             h4(strong("Q:")))),
             tabPanel("About",br(),column(width=6,p("IRscope and its all dependencies"))),
             tabPanel("Contact",br(),column(width = 6,p("The paper describing this")))
           )))
)

server <- function(input,output){
  
}


shinyApp(ui,server)

最终的效果就是这个样子

image.png

基本上看懂了代码结构,他的源代码最多支持10个画图,如果有需求画大于10个的话自己应该可以改他的代码满足需求。

0 人点赞