TileViewItem:RadFluidContentControl: LargeContent: Content Overflow: Scrollbar

4 posts, 0 answers
  1. Deepak Shakya
    Deepak Shakya avatar
    118 posts
    Member since:
    Aug 2007

    Posted 01 Sep 2010 Link to this post

    Hi,

    I have been testing RadControls for Silverlight Q2 2010 Tileview. It works fine with RadFluidContentControl's three states but without any huge amount of content in the "Large Content" case.

    I populated the "large content" with stackpanel which holds about 30 controls comprising of Label and Textbox in vertical orientation. This is to use as an input form.

    The problem is that when I run the program, IE freezes and nothing happens, so I have to KILL the process.

    Also if I put fewer controls and run the code it runs fine until I resize the window so that the last control now touches the bottom of window. The IE freezes again.

    I also wanted scrollbars to be displayed in the TileViewItem Content section so that I can scroll to fill in the form without resizing the window. Is this possible? If yes, how do I go about it?

    Thanks in advance.

    <telerik:RadTileViewItem Header="Nutrient Input Analysis" TileState="Maximized" MinWidth="0" >
                   <telerik:RadFluidContentControl SmallToNormalThreshold="400 0" NormalToSmallThreshold="400 0" LargeToNormalThreshold="600 0" NormalToLargeThreshold="600 0" ScrollViewer.VerticalScrollBarVisibility="Visible">
                       <!--Small Content-->
                       <telerik:RadFluidContentControl.SmallContent>
                           <Grid>
                               <TextBlock FontSize="29.333" FontFamily="Alien League" VerticalAlignment="Top" Margin="94,8,86,0" d:LayoutOverrides="Width"> Summary</TextBlock>
                           </Grid>
                       </telerik:RadFluidContentControl.SmallContent>
                       <!--Normal Content-->
                       <telerik:RadFluidContentControl.Content>
                           <Grid>
                               <TextBlock Text="NORMAL VIEW"/>
                           </Grid>
                       </telerik:RadFluidContentControl.Content>
                       <!--Large Content-->
                         
                       <telerik:RadFluidContentControl.LargeContent>
                               <StackPanel Orientation="Vertical">
                                   <sdk:Label x:Name="lblTotalArea" HorizontalAlignment="Left"  Grid.Column="0" Grid.Row="0"  VerticalAlignment="Center" Content="Label" />
                                   <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea1" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                                   <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea2" HorizontalAlignment="Left"   VerticalAlignment="Center"  Content="Label"/>
                                   <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea3" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                                   <TextBox  HorizontalAlignment="Left"   VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea4" HorizontalAlignment="Left"   VerticalAlignment="Center"  Content="Label"/>
                                   <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea5" HorizontalAlignment="Left"   VerticalAlignment="Center"  Content="Label"/>
                                   <TextBox  HorizontalAlignment="Left"  VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea6" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                                   <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea7" HorizontalAlignment="Left"    VerticalAlignment="Center"  Content="Label"/>
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea8" HorizontalAlignment="Left"    VerticalAlignment="Center"  Content="Label"/>
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea9" HorizontalAlignment="Left"    VerticalAlignment="Center"  Content="Label"/>
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea10" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea11" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea12" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                               <sdk:Label x:Name="lblTotalArea13" HorizontalAlignment="Left"    VerticalAlignment="Center" Content="Label" />
                               <TextBox  HorizontalAlignment="Left"    VerticalAlignment="Center" Width="100"/>
                           </StackPanel>
            
                       </telerik:RadFluidContentControl.LargeContent>
                   </telerik:RadFluidContentControl>
               </telerik:RadTileViewItem>
  2. Deepak Shakya
    Deepak Shakya avatar
    118 posts
    Member since:
    Aug 2007

    Posted 01 Sep 2010 Link to this post

    The problem disappeared on its own. I am not sure what happened. I can now change the window size without IE freezing. There is also smooth transition between - Large Content>Normal Conten>Small Content and vice versa.

    The only question remaining is that:

    1. How do make scroll bars appear in the "Large Content" view when the contents in the RadTileViewItem overflows the content boundary.

    Cheers!
  3. DevCraft banner
  4. Kiril Stanoev
    Admin
    Kiril Stanoev avatar
    1511 posts

    Posted 02 Sep 2010 Link to this post

    Hello Deepak,

    Have you tried wrapping the StackPanel (the one in LargeContent) in ScrollViewer?

    <telerik:RadFluidContentControl.LargeContent>
        <ScrollViewer>
            <StackPanel Orientation="Vertical">
                <!-- Rest of form here -->   
            </StackPanel>
        </ScrollViewer>
    </telerik:RadFluidContentControl.LargeContent>

    Let me know if this helps.

    Best wishes,
    Kiril Stanoev
    the Telerik team
    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 Public Issue Tracking system and vote to affect the priority of the items
  5. Deepak Shakya
    Deepak Shakya avatar
    118 posts
    Member since:
    Aug 2007

    Posted 02 Sep 2010 Link to this post

    Thanks Kiril,

    Its amazing! Its working now with ScollViewer. I had tried this before and it didn't work. Thank you for your help.

    Regards,
    Deepak
Back to Top