ミニUIを使った光沢のあるガジェットの画面読み込み

Question

私はminiUIを使用してシャイニーガジェットを構築しています。

library(shiny) 
library(shinyjs) 
library(miniUI) 

sampleApp <- function() { 
    ui <- miniPage(
    gadgetTitleBar("Sample App"), 
    miniTabstripPanel(
     miniTabPanel(
     "Panel 1", 
     fillCol(div("Content of Panel 1")) 
    ), 
     miniTabPanel(
     "Panel 2", 
     fillCol(div("Content of Panel 2")) 
    ), 
     between = p("") # Needed later on to avoid error in shinyjs::hidden() 
    ) 
) 

    server <- function(input, output) { 
    } 

    runGadget(ui, server, viewer = dialogViewer("Sample dialog")) 
} 
sampleApp() 

I：https://github.com/daattali/advanced-shiny/blob/master/loading-screen/app.Rは

ここでガジェットがどのように見えるかの小さな例です：ガジェットは、いくつかの準備作業を行い、このシンプルで便利なソリューションを実装しようとしている間、私はロード画面を表示したいと思います私の例に画面コードを読み込む方法をいくつか試してみました。私は非表示にするには、コンテンツを取得するように見えることはできません。miniTabstripPanel周りに隠された

1. ・プレイス（）（）：

   library(shiny) 
   library(shinyjs) 
   library(miniUI) 
   
   appCSS <- " 
   #loading-content { 
   position: absolute; 
   background: #000000; 
   opacity: 0.9; 
   z-index: 100; 
   left: 0; 
   right: 0; 
   height: 100%; 
   text-align: center; 
   color: #FFFFFF; 
   } 
   " 
   
   sampleApp <- function() { 
   ui <- miniPage(
       useShinyjs(), 
       inlineCSS(appCSS), 
   
       # Loading message 
       div(
       id = "loading-content", 
       h2("Loading...") 
   ), 
   
       # The main app code goes here 
       gadgetTitleBar("AppTitle"), 
       hidden(
       miniTabstripPanel(
        miniTabPanel(
        "Panel 1", 
        fillCol(div("Content of Panel 1")) 
       ), 
        miniTabPanel(
        "Panel 2", 
        fillCol(div("Content of Panel 2")) 
       ), 
        between = p("") # Needed later on to avoid error in shinyjs::hidden() 
       ), 
       id = "app-content" 
   ) 
   ) 
   server <- function(input, output) { 
       # Simulate work being done for 1 second 
       Sys.sleep(1) 
   
       # Hide the loading message when the rest of the server function has executed 
       hide(id = "loading-content", anim = TRUE, animType = "fade") 
       show("app-content") 
   } 
   runGadget(ui, server, viewer = dialogViewer("Sample dialog")) 
   } 
   sampleApp() 
   

2. のdiv内のコンテンツラップ（）。

3. この回答https://stackoverflow.com/a/32386689/5664232

Answer 1

に応じてコードのあなたの第二のブロックは実行されません）（タグリストを使用してください。 between = p("")の前にコンマがありません。

このコードは、読み込み中の画面を表示してフェードアウトするために機能しますが、最初はコンテンツを非表示にしています。 miniUI tabsetpanelは実際に他のdivや要素の中にいるのが好きではないと思われます。 miniUIには多くのバグがあり、通常の光沢のあるUIよりも扱いにくいです。残念ながら、ガジェットを構築するときに対処しなければならない単なるものです。 miniUIが異なるCSSシステム（フレックスボックス）を使用していますが、いずれにせよ、このコードは、コンテンツを隠すことなく動作しますので、それは一部です：

library(shiny) 
library(shinyjs) 
library(miniUI) 

appCSS <- " 
#loading-content { 
position: absolute; 
background: #000000; 
opacity: 0.9; 
z-index: 100; 
left: 0; 
right: 0; 
height: 100%; 
text-align: center; 
color: #FFFFFF; 
} 
" 

sampleApp <- function() { 
    ui <- miniPage(
    useShinyjs(), 
    inlineCSS(appCSS), 

    # Loading message 
    div(
     id = "loading-content", 
     h2("Loading...") 
    ), 

    # The main app code goes here 
    gadgetTitleBar("AppTitle"), 
    miniTabstripPanel(
     miniTabPanel(
     "Panel 1", 
     fillCol(div("Content of Panel 1")) 
    ), 
     miniTabPanel(
     "Panel 2", 
     fillCol(div("Content of Panel 2")) 
    ), 
     between = p("") # Needed later on to avoid error in shinyjs::hidden() 
    ) 
) 
    server <- function(input, output) { 
    # Simulate work being done for 1 second 
    Sys.sleep(1) 

    # Hide the loading message when the rest of the server function has executed 
    hide(id = "loading-content", anim = TRUE, animType = "fade") 
    } 
    runGadget(ui, server, viewer = dialogViewer("Sample dialog")) 
} 
sampleApp() 

あなたは本当にUIからコンテンツを非表示し、それを表示したい場合は、私は」それはいくつかの回避策で行うことができると確信していますが、それをデバッグするのに時間がかかるかもしれません、今私はあなたに同様のあまり理想的な回避策を表示するだけです：すぐにタブとパネルの内容を隠すサーバーは生きており、最後に表示されます。彼らは隠されたとして初期化しないので、それは良いではありませんが、それは私が2分で来ることができる最高です。

library(shiny) 
library(shinyjs) 
library(miniUI) 

appCSS <- " 
#loading-content { 
position: absolute; 
background: #000000; 
opacity: 0.9; 
z-index: 100; 
left: 0; 
right: 0; 
height: 100%; 
text-align: center; 
color: #FFFFFF; 
} 
" 

sampleApp <- function() { 
    ui <- miniPage(
    useShinyjs(), 
    inlineCSS(appCSS), 

    # Loading message 
    div(
     id = "loading-content", 
     h2("Loading...") 
    ), 

    # The main app code goes here 
    gadgetTitleBar("AppTitle"), 
    miniTabstripPanel(
     miniTabPanel(
     "Panel 1", 
     fillCol(div("Content of Panel 1")) 
    ), 
     miniTabPanel(
     "Panel 2", 
     fillCol(div("Content of Panel 2")) 
    ), 
     between = p("") # Needed later on to avoid error in shinyjs::hidden() 
    ) 
) 
    server <- function(input, output) { 
    hide(selector = ".gadget-tabs-content-container, .gadget-tabs-container") 

    # Simulate work being done for 1 second 
    Sys.sleep(1) 

    # Hide the loading message when the rest of the server function has executed 
    hide(id = "loading-content", anim = TRUE, animType = "fade") 
    show(selector = ".gadget-tabs-content-container, .gadget-tabs-container") 
    } 
    runGadget(ui, server, viewer = dialogViewer("Sample dialog")) 
} 
sampleApp()