Stacklayout의 이미지 배열을 루프를 통해 추가했습니다.

Question

저는 for 루프를 사용하여 xamarin 양식에 익숙해지기 위해 198 개의 항목, 절반 숫자 및 절반 이미지를 추가하지만 세로에서 가로로 전환 할 수는 없습니다. 원하는 출력은 한 행에 일련 번호가있는 4 개의 이미지를 갖는 것입니다.

편집 : 나는 여러 줄

Image[] show = new Image[100]; 
for(int i=0;i<100;i++) 
{ 
    show[i]=new Image{ Aspect = Aspect.AspectFit }; 
    show[i].WidthRequest = 30; 
    show[i].HeightRequest = 30; 
    show[i].Source = images[i]; 
} 

for (int i=0;i<99;i++) 
{ 
    if (i % 4 == 0) 
    { 
     layout.HorizontalOptions = LayoutOptions.Start; 
     layout.Spacing = 15; 
     layout.Orientation = StackOrientation.Vertical; 
     layout.Children.Add(new Label { Text = (i+1).ToString() }); 
     layout.Spacing = 10; 
     layout.Children.Add(show[i]); 
    } 
    else 
    { 
     layout.HorizontalOptions = LayoutOptions.StartAndExpand; 
     layout.Spacing = 10; 
     layout.Orientation = StackOrientation.Horizontal; 
     layout.Children.Add(new Label { Text = (i+1).ToString() }); 
     layout.Children.Add(show[i]); 
    } 
} 

이 현재 출력에 표시 할 수 없습니다입니다 Output

Answer 1

나는 그리드를 사용하는 것이 좋습니다,하지만 당신이 더 많은 것을 필요 레이아웃을 사용하는 이 같은

이 모든 수평 레이아웃을 유지하는 외측 수직 레이아웃을 생성

 var outerLayout = new StackLayout {Orientation = StackOrientation.Vertical}; 
     var innerLayout = new StackLayout(); 
     for (int i = 0; i < 99; i++) 
     { 
      if (i%4 == 0) 
      { 
       if (i != 0) 
        outerLayout.Children.Add(innerLayout); 
       innerLayout = new StackLayout {Orientation = StackOrientation.Horizontal}; 
      } 
      innerLayout.Children.Add(new Label { Text = (i + 1).ToString() }); 
      innerLayout..Children.Add(show[i]); 
     } 
     outerLayout.Children.Add(innerLayout); 
     MainPage = new ContentPage {Content = outerLayout}; 

는, 각 그룹에 대한 수평 레이아웃을 생성하는 요 너는 수평으로 표시하고 싶다.