UWP使用不断更新的数组更新项目控件

Question

I have an array that keeps changing its values, because of this I want to have the apps UI refreshing every time the array's values do. I have this bound with an itemsControl. I can show the first array's values but then I can't update them I have tried .items.Clear() but its not working. Here are snippets of the .xaml and the xaml.cs. I actually took the code of the .xaml from a question from this site.

.xaml

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <TextBox Text="Testing" IsReadOnly="True"></TextBox>
        <ItemsControl x:Name="itemsControl"
          ItemsSource="{Binding itemsControl}"
          FontSize="24">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Grid Width="Auto"
                        Margin="0 12"
                        HorizontalAlignment="Center">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />

                        </Grid.RowDefinitions>

                        <StackPanel Grid.Column="0"
                                    Grid.Row="0"
                                    Orientation="Horizontal">
                            <TextBlock Name="txtblk0" Text="{Binding}" />
                        </StackPanel>

                    </Grid>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>

.xaml.cs

String c = (new String(cArray));
string[] arr = null;
string[] data = null;
if (c != null)
{
    arr = c.Split('\n');
    if (arr.Length > 0)
    {
        data = arr[0].Split(',');
    }
}

for(int index = 0; index < 4; index++)
{
    itemsControl.Items.Add(float.Parse(data[index]));
}

itemsControl.Clear();

If anyone has an idea of how I can do this I will be very grateful, thanks in advance and I will try to answer any questions as soon as possible!

Answer 1

What you're missing is an understanding of how bindings are triggered to update.

The INotifyPropertyChanged interface contains a method ( PropertyChanged ) and when called and passed the name of a property will tell the binding system that the property has changed and the binding should be updated.
INotifyCollectionChanged is the equivalent for collections, and communicates when a collection has changed. ie something added, removed, or the list cleared.

ObservableCollection<T> contains an implementation of INotifyCollectionChanged that makes it easy to work with lists, collections, etc. that change.

If you used an ObservableCollection<float> instead of an array you'd be able to modify the list and have the UI updated to reflect this easily.

As a starter, see the following which demonstrates how easy it is to use an ObservableCollection.

XAML:

<StackPanel>
    <Button Click="Button_Click">add an item</Button>
    <ItemsControl ItemsSource="{Binding Items}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding}" />
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</StackPanel>

code behind;

public MainPage()
{
    this.InitializeComponent();

    // Initialize the property
    this.Items = new ObservableCollection<string>();
    // Use self as datacontext (but would normally use a separate viewmodel)
    this.DataContext = this;
}

private void Button_Click(object sender, RoutedEventArgs e)
{
    // add a new item to the UI
    this.Items.Add(DateTime.Now.ToString());
}

// The "collection" that is shown in the UI
public ObservableCollection<string> Items { get; set; }