Xamarin表格網格佈局

我很難在網格上設置文本和圖片。以下是我需要做的：Xamarin表格網格佈局

兩列
第一列包含文本的兩排，左對齊。
第二列包含單個圖像，佔據整個高度，但是右對齊。

所以它將基本上是這樣的：

我已經試過兩種方法。

第一種方法是創建一個2×2的網格，並且所述圖像的ColumnSpan設置爲2。但該圖標沒有被垂直居中，它仍然是在頂行英寸
第二種方法是創建1x2網格（1行2列），然後添加一個包含兩個文本字符串的StackLayout到第一個子節點，並將圖像添加到第二個子節點。這次圖像垂直居中，但不幸的是左對齊。

任何人都可以幫忙嗎？

謝謝。

代碼第二種方法：

 Content = new Grid 
     { 
      //Padding = new Thickness(75, 5, 25, 5), 
      VerticalOptions = LayoutOptions.FillAndExpand, 
      HorizontalOptions = LayoutOptions.StartAndExpand, 

      RowDefinitions = 
      { 
       new RowDefinition(), 
      }, 

      ColumnDefinitions = 
      { 
       new ColumnDefinition(), 
       new ColumnDefinition(), 
      }, 
     }; 

     (Content as Grid).RowDefinitions[0].Height = new GridLength(1, GridUnitType.Star); 
     (Content as Grid).ColumnDefinitions[0].Width = new GridLength(9, GridUnitType.Star); 
     (Content as Grid).ColumnDefinitions[1].Width = new GridLength(1, GridUnitType.Star); 

     StackLayout left = new StackLayout 
     { 
      HorizontalOptions = LayoutOptions.StartAndExpand, 
      VerticalOptions = LayoutOptions.Center, 
      Orientation = StackOrientation.Vertical, 
      Children = 
      { 
       firstName, 
       lastName, 
      } 
     }; 

     StackLayout right = new StackLayout 
     { 
      HorizontalOptions = LayoutOptions.Start, 
      VerticalOptions = LayoutOptions.Center, 
      Orientation = StackOrientation.Horizontal, 
      Children = 
      { 
       icon, 
      } 
     }; 

     (Content as Grid).Children.Add(left, 0, 0); 
     (Content as Grid).Children.Add(right, 1, 0); 
     //(Content as Grid).Children[1].HorizontalOptions = LayoutOptions.End

這現在看起來是這樣的：

的形象應該是在網格的最右側。

謝謝。

來源

2017-08-16 MrProgrammer

個人，我會使用2x2網格並將圖像的RowSpan（不列）設置爲2.您應該能夠調整圖像對齊設置以獲得所需。 – Jason

在＃2示例中，「右」StackLayout具有HorizontalOptions.Start，這意味着它將左對齊。您可能希望將其填充到容器中，然後將其中的圖像右對齊。或者完全擺脫StackLayout – Jason

Duh，我簡直不敢相信它那麼簡單。謝謝你指出。您是否可以將此作爲回答發佈，以便我可以標記並解決問題？再次感謝。 – MrProgrammer

在您的＃2示例中，「右」StackLayout具有HorizontalOptions.Start，這意味着它將左對齊。您可能希望將其填充到容器中，然後將其中的圖像右對齊。或者完全擺脫StackLayout

來源

2017-08-16 20:47:06 Jason

就是這樣。謝謝。 – MrProgrammer

Xamarin表格網格佈局

回答

相關問題