How Do I Build RadTileViewItems Dynamically

43 posts, 0 answers
  1. Tihomir Petkov
    Admin
    Tihomir Petkov avatar
    576 posts

    Posted 30 Nov 2009 Link to this post

    Hi Thendral,

    I was not able to reproduce the issue from your first question. Can you please provide a sample project that demonstrates it?

    As for your second question, it seems from the screenshots that you are using the TabControl only to change the currently maximized tile and you are using the same TileView. Am I correct? If that is the case, do you see any benefits of using the TabControl instead of a row of properly styled buttons?

    If you want to use the TabControl with TileViews as the content of each tab, there should be no problems. I tested this scenario as well, and the TileViews are in the same state after you return to their tab. 

    Greetings,
    Tihomir Petkov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  2. Heather Kyle
    Heather Kyle avatar
    6 posts
    Member since:
    Oct 2009

    Posted 30 Nov 2009 Link to this post

    I am seeing the same behavior described by Serhiy on October 22. That is, when tiles are added programmatically, the layout is not correct until one of the tiles is maximized. The code for a simple example follows.

    MainPage.xaml:

    <UserControl x:Class="DynamicTileView.MainPage" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"   
                 xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation" 
                 xmlns:local="clr-namespace:DynamicTileView" 
        mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">  
      <Grid x:Name="LayoutRoot">  
            <Grid.RowDefinitions> 
                <RowDefinition /> 
                <RowDefinition Height="Auto" /> 
            </Grid.RowDefinitions> 
            <Button Click="Button_Click" Grid.Row="1" Content="Push me" Background="Red" Margin="10" /> 
            <telerikNavigation:RadTileView x:Name="RadTileView1" Grid.Row="0" /> 
        </Grid> 
    </UserControl> 

    and MainPage.xaml.cs
    using System;  
    using System.Windows;  
    using System.Windows.Controls;  
    using Telerik.Windows.Controls;  
     
    namespace DynamicTileView  
    {  
        public partial class MainPage : UserControl  
        {  
            private int numberOfTileViews = 4;  
            public MainPage()  
            {  
                InitializeComponent();              
            }  
     
            private void Button_Click(object sender, RoutedEventArgs e)  
            {  
                for (int i = 0; i < numberOfTileViews; i++)  
                {  
                    RadTileView1.Items.Add(new RadTileViewItem()  
                    {  
                        Header = String.Format("TileItem {0}", i),  
                        Content = new MyTileView() { Text = String.Format("Long Text Content Long Text Content {0}", i) }  
                    });  
                }  
            }  
        }  

    Any assistance/suggestions you could provide as to the best way to fix the problem would be greatly appreciated.
    Thank you.
  3. DevCraft banner
  4. Tihomir Petkov
    Admin
    Tihomir Petkov avatar
    576 posts

    Posted 03 Dec 2009 Link to this post

    Hi Heather,

    I was indeed able to reproduce the incorrect initial rendering using the code you provided. I will investigate the issue immediately and hopefully the bug will be resolved for the service pack next week. Thank you for reporting the problem. I added 1000 Telerik points to your account.

    Greetings,
    Tihomir Petkov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  5. Gema
    Gema avatar
    1 posts
    Member since:
    Oct 2009

    Posted 29 Dec 2009 Link to this post

    Hi all,
    Is the issue described above already resolved? I´ve installed Q3 SP1, but I´m experimenting the same behavior.
    I´ve created a header template and a content template. I fill RadTileView using the property ItemSource, but the first time the page is loaded the layout is not correct until one of the tiles is maximized.

    Thanks
  6. Dheeraj Ramaswamy
    Dheeraj Ramaswamy avatar
    15 posts
    Member since:
    Jun 2008

    Posted 29 Dec 2009 Link to this post

    I am having the same issue as mentioned above about not rendering correctly when tileviewitems are added programatically with the new Q3 SP1
  7. Valentin.Stoychev
    Admin
    Valentin.Stoychev avatar
    2198 posts

    Posted 30 Dec 2009 Link to this post

    Hi Dheeraj Ramaswamy,

    This is scheduled for fixing for SP2 release - mid-January.

    Sincerely yours,
    Valentin.Stoychev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  8. Dheeraj Ramaswamy
    Dheeraj Ramaswamy avatar
    15 posts
    Member since:
    Jun 2008

    Posted 30 Dec 2009 Link to this post

    Thanks for the information. Will eagerly wait for the update. As always you guys rock providing such excellent RAD controls !!!!!!!!!!!
  9. Monika Kogler
    Monika Kogler avatar
    30 posts
    Member since:
    Aug 2009

    Posted 13 Jul 2010 Link to this post

    hi,
    the example works fine but is it also possible to bind a usercontrol to each contenttype? i have tried to bind another usercontrol to each contenttype but i'm getting an exception saying the control was already bind to another control.

    my xaml of customtileview:
    <UserControl x:Class="SLChemserv.Custom.SLControls.TileView.CustomTileView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls">
        <Grid x:Name="RootElement">
            <telerikNavigation:RadFluidContentControl  
                                                    SmallToNormalThreshold="291, 130"
                                                    NormalToSmallThreshold="292, 131"
                                                    NormalToLargeThreshold="730, 350"
                                                    LargeToNormalThreshold="731, 351">
                <telerikNavigation:RadFluidContentControl.SmallContent>
                    <Grid x:Name="grid_small"></Grid>                
                </telerikNavigation:RadFluidContentControl.SmallContent>
                <telerikNavigation:RadFluidContentControl.Content>
                    <Grid x:Name="grid_normal"></Grid>
                </telerikNavigation:RadFluidContentControl.Content>
                <telerikNavigation:RadFluidContentControl.LargeContent>
                    <Grid x:Name="grid_large"></Grid>
                </telerikNavigation:RadFluidContentControl.LargeContent>
            </telerikNavigation:RadFluidContentControl>
        </Grid>
    </UserControl>
    __________________________________________________________________________
    code behing:
    public partial class CustomTileView : UserControl
        {
            public CustomTileView()
            {
                InitializeComponent();
                RootElement.DataContext = this;
            }

            public UIElement TileContent
            {
                get { return (UIElement)GetValue(TileContentProperty); }
                set
                {
                    SetValue(TileContentProperty, value);
                    grid_large.Children.Add(value);
                    grid_normal.Children.Add(value); // ERROR
                    grid_small.Children.Add(value);
                }
            }

            // Using a DependencyProperty as the backing store for Text.  This enables animation, styling, binding, etc...
            public static readonly DependencyProperty TileContentProperty =
                DependencyProperty.Register("TileContent", typeof(UIElement), typeof(CustomTileView), null);
        }
    ________________________________________________
    my value is always another usercontrol. any suggestions? thx in advance
  10. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 16 Jul 2010 Link to this post

    Hello Monika Kogler,

    Please take a look at the project attached to your support ticket - ID:327841.

    Let us know if it works for you or if you need more info.

    Best wishes,
    Tina Stancheva
    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
  11. Shlomy
    Shlomy avatar
    2 posts
    Member since:
    Jul 2010

    Posted 25 Jul 2010 Link to this post

    I have the same problem and I can't find the ticket. Can you please publish the project here?
  12. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 27 Jul 2010 Link to this post

    Hi Shlomy,

    Thank you for contacting us.

    In Silverlight, only one copy of a visual element can exist in the visual tree i.e. parent to child relationship is 1 to 1. Therefore to make your scenario work, you have to have 3 separate TextBlocks for example block_large, block_normal and block_small:
    public partial class MainPage : UserControl
    {
        private int numberOfTileViews = 6;
        public MainPage()
        {
            InitializeComponent();
            for (int i = 0; i < numberOfTileViews; i++)
            {
                RadTileViewItem item = new RadTileViewItem { Header = String.Format("TileItem {0}", i) };
      
                MyTileView view = new MyTileView();
                TextBlock block_large = new TextBlock { Text = "TEST_LARGE" };
                TextBlock block_normal = new TextBlock { Text = "TEST_NORMAL" };
                TextBlock block_small = new TextBlock { Text = "TEST_SMALL" };
                view.TileContent = new UIElement[3] { block_large, block_normal, block_small };
                item.Content = view;
      
                RadTileView1.Items.Add(item);
      
            }
        }
    }
      
    public partial class MyTileView : UserControl
    {
        public MyTileView()
        {
            InitializeComponent();
            RootElement.DataContext = this;
        }
      
      
        public UIElement[] TileContent
        {
            set
            {
                grid_large.Children.Add(value[0]);
                grid_normal.Children.Add(value[1]);
                grid_small.Children.Add(value[2]);
            }
        }
    }

    However, if your scenario requires you to use the same UserControl in the different contents for the TileView states, you can take a look at the attached project, where no large view is defined for the RadTileView, but only small and normal.

    I hope this info will help you. Please let us know if we can further assist you.

    Sincerely yours,
    Tina Stancheva
    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
  13. kamau
    kamau avatar
    1 posts
    Member since:
    Mar 2014

    Posted 24 Mar 2014 Link to this post

    how can I display eight different images as returned from my service to a tile-view using mvvm patten.my aim is to have tile view in the xaml and bind the tileview to objects in the viewmodel.Thanks
  14. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 25 Mar 2014 Link to this post

    Hi Kamau,

    I am not sure how you store the images on the server and how the service returns them. However, you can bind the RadTileView ItemsSource property to a business collection of items. You can also define an:
    • ItemTemplate - a DataTemplate that determines what information should be displayed in the Header of each tile
    • ContentTemplate - a DataTemplate that determines what information should be displayed in the content part of each tile.

    In your case in the ContentTemplate you can display the images returned by the service. Although we don't have an example demonstrating exactly the described scenario, you can examine the attached sample as it can get you started.

    Regards,
    Tina Stancheva
    Telerik
     

    Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

     
Back to Top
DevCraft banner