2017-11-30 9 views
0

아래 예제 코드는 한 열에는 텍스트가 있고 다른 열에는 이미지가있는 UI를 생성합니다.다중 열 레이아웃에서 빈 화면 공간을 차지하는 방법은 무엇입니까?

library(shiny) 
library(stringi) 

ui = fluidPage(
    fluidRow(
     column(6, 
       h4('Text Section'), 
       p(stri_rand_lipsum(2)), 
       p(stri_rand_lipsum(2))), 
     column(6, 
       img(src = 'http://via.placeholder.com/200x200') 
    ) 
)) 

server = function(input,output){} 

shinyApp(ui = ui, server = server) 

페이지의 너비에 따라 첫 번째 열은 두 번째 열의 이미지보다 길거나 짧을 수 있습니다. 다음은 첫 번째 열이 더 긴 경우입니다.

application output

질문은 아래의 그림과 같이 두 번째 열의에 남아있는 빈 공간을 점유하는 첫 번째 열의 텍스트를 수 있습니다 레이아웃이있다,있다? 당신이 할 수

enter image description here

답변

1

유일한 방법은 여분의 열 그리드를 제거하고 오른쪽으로 정렬 된 이미지와 같은 모든 퍼팅입니다.

enter image description here

library(shiny) 
library(stringi) 

ui = fluidPage(
    fluidRow(
    column(8, 
      h4('Text Section'), 
      img(src = 'http://via.placeholder.com/200x200', align = 'right'), 
      p(stri_rand_lipsum(2)), 

      p(stri_rand_lipsum(2))) 



)) 

server = function(input,output){} 

shinyApp(ui = ui, server = server) 
+0

임의의 div의이 작품을 만들 수있는 방법이 있습니까? div 권리를 정렬하는 것과 이미지를 정렬하는 것과 같은 방식으로 작동하지 않는 것 같습니다. – OganM