EmptyContentTemplate with Progress Bar Indicator Position

5 posts, 0 answers
  1. Washington
    Washington avatar
    14 posts
    Member since:
    Oct 2013

    Posted 18 Jun 2015 Link to this post

    Hi...

    I have a RadDataBoundListBox which has an EmptyContentTemplate with a progress bar indicator.

    My problem is that the progress bar is always shown at the left up corner and I don't know why.

     

    01.<Grid x:Name="ContentPanel" Grid.Row="1" Margin="5">
    02.     <telerikPrimitives:RadDataBoundListBox
    03.         Name="listBoxName"
    04.         EmptyContent="Loadding..."
    05.         HorizontalContentAlignment="Center"
    06.         HorizontalAlignment="Center"
    07.         Margin="12">
    08. 
    09.         <telerikPrimitives:RadDataBoundListBox.ItemTemplate>
    10.             <DataTemplate>
    11.                 <Button
    12.                     Foreground="Black"
    13.                     Content="{Binding MyLabel}"
    14.                     Height="85"
    15.                     Width="85"
    16.                     BorderThickness="1"
    17.                     Background="WhiteSmoke"
    18.                     BorderBrush="#FFA29999"
    19.                     HorizontalAlignment="Center"
    20.                     VerticalAlignment="Center" />
    21.             </DataTemplate>
    22.         </telerikPrimitives:RadDataBoundListBox.ItemTemplate>
    23. 
    24.         <telerikPrimitives:RadDataBoundListBox.VirtualizationStrategyDefinition>
    25.             <telerikPrimitives:WrapVirtualizationStrategyDefinition Orientation="Horizontal" />
    26.         </telerikPrimitives:RadDataBoundListBox.VirtualizationStrategyDefinition>
    27. 
    28.         <telerikPrimitives:RadDataBoundListBox.ItemAddedAnimation>
    29.             <telerikCore:RadMoveAnimation StartPoint="500, 0" EndPoint="0, 0" Duration="0:0:1">
    30.                 <telerikCore:RadMoveAnimation.Easing>
    31.                     <CubicEase EasingMode="EaseOut"/>
    32.                 </telerikCore:RadMoveAnimation.Easing>
    33.             </telerikCore:RadMoveAnimation>
    34.         </telerikPrimitives:RadDataBoundListBox.ItemAddedAnimation>
    35. 
    36.     </telerikPrimitives:RadDataBoundListBox>
    37. </Grid>
     

           

  2. Washington
    Washington avatar
    14 posts
    Member since:
    Oct 2013

    Posted 18 Jun 2015 in reply to Washington Link to this post

    this is the correct Xaml markup:

     

    <Grid Grid.Row="2" Margin="5">
        <telerikPrimitives:RadDataBoundListBox
            Name="listBoxName"
            Margin="12">
      
            <telerikPrimitives:RadDataBoundListBox.EmptyContentTemplate>
                <DataTemplate>
                    <telerikPrimitives:RadBusyIndicator
                        Name="loading"
                        Background="White"
                        FontSize="{StaticResource PhoneFontSizeMedium}"
                        Foreground="{StaticResource Azul}"
                        Content="Loadding..."
                        Canvas.ZIndex="999999"
                        VerticalAlignment="Stretch"
                        HorizontalAlignment="Stretch"
                        IsRunning="true">
                    </telerikPrimitives:RadBusyIndicator>
                </DataTemplate>
            </telerikPrimitives:RadDataBoundListBox.EmptyContentTemplate>
      
            <telerikPrimitives:RadDataBoundListBox.ItemAddedAnimation>
                <telerikCore:RadMoveAnimation StartPoint="500, 0" EndPoint="0, 0" Duration="0:0:1">
                    <telerikCore:RadMoveAnimation.Easing>
                        <CubicEase EasingMode="EaseOut"/>
                    </telerikCore:RadMoveAnimation.Easing>
                </telerikCore:RadMoveAnimation>
            </telerikPrimitives:RadDataBoundListBox.ItemAddedAnimation>
      
            <telerikPrimitives:RadDataBoundListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="0">
                        <Button
                            Foreground="Black"
                            Content="{Binding Number}"
                            Tag="{Binding Number}"
                            Height="90"
                            Width="90"
                            BorderThickness="1"
                            Background="WhiteSmoke"
                            BorderBrush="#FFA29999"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center" />
                    </Grid>
                </DataTemplate>
            </telerikPrimitives:RadDataBoundListBox.ItemTemplate>
        </telerikPrimitives:RadDataBoundListBox>
    </Grid>

  3. DevCraft banner
  4. Rosy Topchiyska
    Admin
    Rosy Topchiyska avatar
    551 posts

    Posted 23 Jun 2015 Link to this post

    Hi Washington,

    Thank you for contacting us.

    Unfortunately we could not reproduce this issue on our side. I have attached the project that I used to test the scenario and the empty content is located in the center of the control. Could you please take a look and modify the project so that it reproduces the issue.

    I look forward to your reply.

    Regards,
    Rosy Topchiyska
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Washington
    Washington avatar
    14 posts
    Member since:
    Oct 2013

    Posted 23 Jun 2015 in reply to Rosy Topchiyska Link to this post

    Hi...

    I have changed your sample to show my scenario.

    See the attached file with the changed project. (please rename it to ".rar" extension)

    Tnks

  6. Rosy Topchiyska
    Admin
    Rosy Topchiyska avatar
    551 posts

    Posted 26 Jun 2015 Link to this post

    Hello Washington,

    Thank you for the sample. I noticed that the problem is caused by the Thread.Sleep call in the UI thread. It is highly recommended that you not do this, because this blocks all operations that happen on the UI thread. In this particular case the sleep call happens before the elements in the listbox are measured and arranged and that is why the indicator is not stretched yet. I have modified your code to use async methods that do not block the UI.

    I hope this helps.
     
    Regards,
    Rosy Topchiyska
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
DevCraft banner