Как создать массив составленных «VisualElements» в Xamarin.Forms C# Code Behind?

Question

Мне нужно отслеживать 20 «плиток», которые создаются в Xamarin.Forms xaml следующим образом:

<AbsoluteLayout x:Name="tileBoardAbsoluteLayout">

    <!-- Second Tile -->
    <Grid x:Name="tileGrid[0]" AbsoluteLayout.LayoutBounds = ".20, .25, 0.2, 0.33" AbsoluteLayout.LayoutFlags = "All">
        <Frame x:Name=tileOuterFrame" BorderColor="#777777" CornerRadius="8" HasShadow="True" Padding="2" BackgroundColor="#777777">
            <Frame x:Name=tileInnerFrame" BorderColor="#FFDEAD" CornerRadius="7" HasShadow="False" Padding="0" BackgroundColor="#E57407" IsClippedToBounds="True">
                <AbsoluteLayout x:Name="tileImageAbsoluteLayout">
                    <Image x:Name="tileImage" Source="{local:ImageResource Resources.Logo.png}" AbsoluteLayout.LayoutBounds = "0, 0, 4.18, 5.24" AbsoluteLayout.LayoutFlags="All" Aspect="Fill" />
                </AbsoluteLayout>
            </Frame>
        </Frame>
    </Grid>

    <!-- Second Tile -->
    <Grid x:Name="tileGrid[1]" AbsoluteLayout.LayoutBounds = ".40, .25, 0.2, 0.33" AbsoluteLayout.LayoutFlags = "All">
    ....

Проще всего было бы, если бы я мог получить к ним доступ как к массиву, например tileGrid [] ( массив из 20 сеток).

Как я могу создать такой массив в Xamarin.Forms xaml или в Xamarin.Forms C# код позади?

Answer 1

Мне удалось заставить его работать, используя код C#.

Но я все же думаю, что было бы легче читать, если бы можно было создавать массивы с использованием xaml вместо C# кода.

Решение состоит в том, чтобы добавить следующий код после InitializeComponent(); на главной странице.

Grid[] tileGrid = new Grid[20];
Frame[] tileOuterFrame = new Frame[20];
Frame[] tileInnerFrame = new Frame[20];
AbsoluteLayout[] tileImageAbsoluteLayout = new AbsoluteLayout[20];
Image[] tileImage = new Image[20];

for (int i = 0; i < 20; i++)
{
    // <Image> tileImage
    tileImage[i] = new Image()
    {
        Source = ImageSource.FromResource("Resources.Logo.png"),
        Aspect = Aspect.Fill
    };
    AbsoluteLayout.SetLayoutBounds(tileImage[i], new Rectangle(0 + .3333 * (i % 4), 0 + .25 * (i / 4), 4.18, 5.24));
    AbsoluteLayout.SetLayoutFlags(tileImage[i], AbsoluteLayoutFlags.All);

    // <AbsoluteLayout> tileImageAbsoluteLayout
    tileImageAbsoluteLayout[i] = new AbsoluteLayout();
    tileImageAbsoluteLayout[i].Children.Add(tileImage[i]);

    // <Frame> tileInnerFrame
    tileInnerFrame[i] = new Frame()
    {
        BorderColor = Color.FromHex("#FFDEAD"),
        CornerRadius = 7f,
        HasShadow = false,
        Padding = new Thickness(0),
        BackgroundColor = Color.FromHex("#E57407"),
        IsClippedToBounds = true
    };
    tileInnerFrame[i].Content = tileImageAbsoluteLayout[i];

    // <Frame> tileOuterFrame
    tileOuterFrame[i] = new Frame()
    {
        BorderColor = Color.FromHex("#777777"),
        CornerRadius = 8f,
        HasShadow = true,
        Padding = new Thickness(2),
        BackgroundColor = Color.FromHex("#777777")
    };
    tileOuterFrame[i].Content = tileInnerFrame[i];

    // <Grid> tileGrid
    tileGrid[i] = new Grid();
    AbsoluteLayout.SetLayoutBounds(tileGrid[i], new Rectangle(.20 + .15 * (i % 4), .25 + .10 * (i / 4), 0.2, 0.33));
    AbsoluteLayout.SetLayoutFlags(tileGrid[i], AbsoluteLayoutFlags.All);
    tileGrid[i].Children.Add(tileOuterFrame[i]);

    // <AbsoluteLayout> tileBoardAbsoluteLayout from xaml
    tileBoardAbsoluteLayout.Children.Add(tileGrid[i]);
}

Answer 2

создайте пользовательский ContentView для вашей плитки

затем в коде

List<CustomTile> tileGrid = new List<CustomTile>();

for (int ndx = 0; ndx < 20; ndx++)
{
  var tile = new CustomTile() { ... };

  // add them to the visual grid
  myGrid.Children.Add(tile,col,row);

  // also add to your grid list
  tileGrid.Add(tile);

}