UWP programmatically adding custom controls: data not showing

Question

I have created a custom control called ItemControl in my UWP application.

The control's XAML:

<UserControl
    x:Class="UniBL.ItemControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:UniBL"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" Height="283.385" Width="430.462">

    <Grid Margin="0,0,-34,0.333">
        <TextBox x:Name="textBox" HorizontalAlignment="Left" Margin="0,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="235" Foreground="#FF3868E6" BorderThickness="0" IsTabStop="False" Background="{x:Null}"/>
        <TextBox x:Name="textBox_status" HorizontalAlignment="Left" Margin="0,39,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="109" Foreground="#FF3868E6" BorderThickness="1,0" IsTabStop="False" Background="{x:Null}" BorderBrush="#FFDAD9D9" Height="32"/>
        <TextBox x:Name="textBox_type" HorizontalAlignment="Left" Margin="126,39,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="109" Foreground="#FF3868E6" BorderThickness="1,0" IsTabStop="False" Background="{x:Null}" BorderBrush="#FFDAD9D9"/>
        <TextBox x:Name="textBox_name" HorizontalAlignment="Left" Margin="250,39,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="109" Foreground="#FF3868E6" BorderThickness="1,0" IsTabStop="False" Background="{x:Null}" BorderBrush="#FFDAD9D9"/>
        <TextBox x:Name="textBox1" HorizontalAlignment="Left" Margin="9,76,0,0" TextWrapping="Wrap" Text="Item Details" VerticalAlignment="Top" Background="#66C9D6CA" IsTabStop="False"/>
        <StackPanel HorizontalAlignment="Left" Height="160" Margin="10,113,0,0" VerticalAlignment="Top" Width="414" BorderThickness="1" BorderBrush="#FFB2AAAA">
            <TextBox x:Name="textBox2" TextWrapping="Wrap"/>
            <TextBox x:Name="textBox3" TextWrapping="Wrap"/>
            <TextBox x:Name="textBox4" TextWrapping="Wrap"/>
            <TextBox x:Name="textBox5" TextWrapping="Wrap"/>
            <TextBox x:Name="textBox6" TextWrapping="Wrap"/>
        </StackPanel>
    </Grid>
</UserControl>

The constructor:

public ItemControl(Item item)
{
     this.InitializeComponent();

     textBox = new TextBox() { Text = item.itemName };
     textBox_status = new TextBox() { Text = item.itemStatus };
     textBox_type = new TextBox() { Text = item.itemType };
     textBox_name = new TextBox() { Text = item.itemName };
     textBox1 = new TextBox() { Text = "Item Details" };
     textBox2 = new TextBox() { Text = "Inventory number: " + item.inventoryNumber };
     textBox3 = new TextBox() { Text = "Purchase date: " + item.purchaseDate };
     textBox4 = new TextBox() { Text = "Purchase value: " + item.purchaseValue };
     textBox5 = new TextBox() { Text = "Location: " + item.locationId };
     textBox6 = new TextBox() { Text = "Person in charge: " + item.personId };
}

I am programmatically adding these controls to a stack panel on the Items page, like this:

public Items()
{
     ...
     List<Item> items = Item.ReadItems(); //the data is loaded correctly
     foreach (Item item in items)
            isp.Children.Add(new ItemControl(item));
     isp.UpdateLayout();
}

However, when I run my application, the item controls are shown with blank text boxes.

Is your `CustomControl` a `UserControl`? or a `TemplatedControl`? — AVK, Jun 27 '17 at 18:26
So in your User control, Do you have these textboxes in XAML? — AVK, Jun 27 '17 at 18:28
Also you don't need to assign them manually on UserControl. Just use `x:Bind` on XAML. — AVK, Jun 27 '17 at 18:32

score 2 · Accepted Answer · answered Jun 27 '17 at 18:29

Your code creates a bunch of controls, assigns them into member variables but doesn't add them into it parent control. There also already exists controls on the parent so there is no need to create new ones.

You most likely want to assign values to the existing ones, like so:

public ItemControl(Item item)
{
  this.InitializeComponent();

  textBox.Text = item.itemName;
  ...
}

UWP programmatically adding custom controls: data not showing

1 Answers1