UI hangs when adding large data in pivot item for WP8

Question

I am creating a dynamic pivot. In which I have binded a collection to pivot ItemSouce. When the selectionchange event is fired I am calling a process which takes some time and the update the ObservableCollection which in turn update the UI. I am using async and await but still the application UI hangs. Let me know what is the issue. Looking for a very quick reply.

CODE:

 private void CraetePivotItems()
        {
            for (int count = 0; count < 100; count++)
            {
                EntityDetail item = new EntityDetail();
                item.HeaderTitle = "Header " + count;
                item.Name = string.Empty;

                this.Detaildata.Add(item);
            }
        }

        private async Task<string> CreateUserControlForPivotItem(int selectedIndex)
        {
            for (int count = 0; count < 1000000000; count++)
            {
            }

            switch (selectedIndex)
            {
                case 0:
                    return "Item 1";
                case 1:
                    return "Item 2";
                case 2:
                    return "Item 3";
                default:
                    return "Item N";
            }
        }

        private void pvtItmCities_Loaded(object sender, System.Windows.RoutedEventArgs e)
        {
            CraetePivotItems();

            this.pvtItmCities.ItemsSource = this.Detaildata;
        }

        private async void pvtItmCities_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if (sender != null)
            {

                ////// Create the user control for the selected pivot item
                string pivotItemContentControl = await CreateUserControlForPivotItem(((Pivot)sender).SelectedIndex);

                (this.Detaildata[((Pivot)sender).SelectedIndex] as EntityDetail).Name = pivotItemContentControl;

                //((System.Windows.Controls.ContentControl)((sender as Pivot).SelectedItem)).Content = pivotItemContentControl;
            }
        }

Class

internal class EntityDetail : INotifyPropertyChanged
    {
        private string headerTitle = String.Empty;
        public string HeaderTitle
        {
            get
            {
                return this.headerTitle;
            }

            set
            {
                if (value != this.headerTitle)
                {
                    this.headerTitle = value;
                    NotifyPropertyChanged();
                }
            }
        }

        private string name = String.Empty;
        public string Name
        {
            get
            {
                return this.name;
            }

            set
            {
                if (value != this.name)
                {
                    this.name = value;
                    NotifyPropertyChanged();
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        // This method is called by the Set accessor of each property. 
        // The CallerMemberName attribute that is applied to the optional propertyName 
        // parameter causes the property name of the caller to be substituted as an argument. 
        private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
        {
            if (PropertyChanged != null)
            {
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }

XAML:

<phone:PhoneApplicationPage.Resources>
        <DataTemplate x:Key="HeaderTemplateSample">
            <TextBlock Text="{Binding HeaderTitle}" Foreground="White"/>
        </DataTemplate>

        <DataTemplate x:Key="ItemTemplateSample">
            <local:PivotItem1Content  Foreground="White"/>
        </DataTemplate>
    </phone:PhoneApplicationPage.Resources>

<phone:Pivot x:Name="pvtItmCities" 

                     HeaderTemplate="{StaticResource HeaderTemplateSample}"
                     ItemTemplate="{StaticResource ItemTemplateSample}"
                     SelectionChanged="pvtItmCities_SelectionChanged" Loaded="pvtItmCities_Loaded" Title="pivot demo" LoadingPivotItem="OnLoadingPivotItem">

        </phone:Pivot>

What is the issue??

Answer 1

i suggest that you create manually a separate thread and assign it to the function and it will update the UI thread when its finish. using Async Await doesn't mean that this is going to be on a different thread.

http://msdn.microsoft.com/en-us/library/windowsphone/develop/cc221403%28v=vs.105%29.aspx

this link show you how to assign a background worker (thread) to complete your tasks

i hope this will help you