2017-12-15 17 views
1

明るくて暗いテーマを持つShiny Appを作成する必要があります。ユーザーはUI内で選択できます。 RStudioのサイトでは、ページ番号themesとthemeSelector()が表示されていますが、「テーマセレクタはアプリケーションの開発中にのみ使用するためのものです」と記載されています。制作準備が整っているテーマを動的に変更できるライブラリはありますか?Prodution ready themeSelector for Shiny

+1

デプロイアプリ上themeSelectorをさせないことはできますか?私はそれがテーマを選択するのに役立つと思うが、あなたはあなたのアプリでそれを可能にすることができます。 – qfazille

+0

私は本当にユーザーにテーマを選択させたくありません。私はちょうど暗いまたは軽いテーマを選択するオプションを持つユーザーをしたい。 GyDのselectInputコントロールをactionButtonに変更し、cosmoとdarklyの2つのテーマの中から選択します。 – Frek

答えて

1

開発中のみ使用することを意味するかもしれませんが、実稼働環境で使用できない理由はありません。 codeを見ると、headセクションのstylesheet linkを検索して変更するだけです。

javaScriptを使用する以外にこれを達成する方法は他にありませんので、すでに書かれているものを使用してください。

あなたは、このような単純なselectInputにドラッグ可能な固定パネルから変更するthemeSelector機能を変更できます。

library(shiny) 
library(shinythemes) 

themeSelector <- function() { 
    div(
     div(
     selectInput("shinytheme-selector", "Choose a theme", 
        c("default", shinythemes:::allThemes()), 
        selectize = FALSE 
     ) 
    ), 
     tags$script(
     "$('#shinytheme-selector') 
     .on('change', function(el) { 
     var allThemes = $(this).find('option').map(function() { 
     if ($(this).val() === 'default') 
     return 'bootstrap'; 
     else 
     return $(this).val(); 
     }); 
     // Find the current theme 
     var curTheme = el.target.value; 
     if (curTheme === 'default') { 
     curTheme = 'bootstrap'; 
     curThemePath = 'shared/bootstrap/css/bootstrap.min.css'; 
     } else { 
     curThemePath = 'shinythemes/css/' + curTheme + '.min.css'; 
     } 
     // Find the <link> element with that has the bootstrap.css 
     var $link = $('link').filter(function() { 
     var theme = $(this).attr('href'); 
     theme = theme.replace(/^.*\\//, '').replace(/(\\.min)?\\.css$/, ''); 
     return $.inArray(theme, allThemes) !== -1; 
     }); 
     // Set it to the correct path 
     $link.attr('href', curThemePath); 
     });" 
    ) 
    ) 
    } 

ui <- fluidPage(
    fluidRow(
    column(4, themeSelector()) 
) 
) 

server <- function(input, output) { 

} 

shinyApp(ui, server) 
+0

私のアプリケーションにあなたのコードを落として、それは完全に機能しました。私はまだあなたのコードを最終的なアプリケーションに統合する必要がありますが、私はあなたのソリューションがもっと幸せにならないでしょう。 – Frek