Content within a tab item

2 posts, 0 answers
  1. ChrisWalker
    ChrisWalker avatar
    21 posts
    Member since:
    May 2007

    Posted 29 Aug 2008 Link to this post

    A am building a 'proof of concept' demo of an web application that we have in silverlight and have a basic question. In your Live demo, first look, you have a single image in each tabitem. I need to place several controls such as a textblock, textbox, slider etc in the tabitem. In the asp.net world, I used contenttemplates to place the controls in. Do I need to do something similar in a silverlight tabitem?

    A simple online demo showing the XAML of this (multiple controls in a tab)would be great.

  2. Miroslav
    Admin
    Miroslav avatar
    922 posts

    Posted 29 Aug 2008 Link to this post

    Hello Chris,

    The TabItem is a HeaderedContent control, a Content Control with a header (that can contain any content as well).

    I am not sure how aware you are of the Content/ContentTemplate/ContentTemplateSelector model in Silverlight WPF but I can try to sum it up in couple of words.

    ContentControls are one of the 3 major types (along with Controls and ItemsControls), you can set to their Content property anything you wish (it is an object). What you normally do if you want to put more than one thing is you use a panel (it can have many children) that arranges them depending on the panel you have chosen. In xaml, if you place an object between the opening and closing tags of a ContentControl, the object is set as its content property.

    Here is how you can do this in xaml:

    <UserControl x:Class="SilverlightApplication9.Page" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   
        xmlns:panels="clr-namespace:Telerik.Windows.Controls.Primitives;assembly=Telerik.Windows.Controls" 
        xmlns:tekerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation" 
        Width="400" Height="300">  
        <Grid x:Name="LayoutRoot" Background="White">  
            <tekerik:RadTabControl> 
                <tekerik:RadTabItem Header="Select Name">  
                    <panels:RadUniformGrid Columns="2" 
                                            Margin="15" 
                                           Rows="3">  
                          
                        <TextBlock Text="Name:" /> 
                        <TextBox /> 
                          
                        <TextBlock Text="Age:" /> 
                        <TextBox /> 
                          
                        <TextBlock Text="Day of Birth:" /> 
                        <TextBox /> 
                    </panels:RadUniformGrid> 
                </tekerik:RadTabItem> 
                <tekerik:RadTabItem Header="Other Item" > 
                  
                    <!--Put content in a panel here--> 
                      
                </tekerik:RadTabItem> 
            </tekerik:RadTabControl> 
        </Grid> 
    </UserControl> 
     

    If you set a non-visual object, such as a business object for example as the content you can use the ContentTemplate (and HeaderTemplate in that case) to set a visual representation of the object that can be bound to the date object.

    Yes, the QSF examples are short and basic examples that present just the control. In the coming few days we will upload a demo application that uses all the controls + web services.

    Regards,
    Miroslav
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. DevCraft banner
Back to Top