Single DataTemplate (chosen by CellTemplateSelector) to provide logic for multiple properties

4 posts, 0 answers
  1. Kornelije
    Kornelije avatar
    28 posts
    Member since:
    May 2011

    Posted 27 Jan 2012 Link to this post

    There's a nice tutorial (made by Telerik) that shows how to use CellTemplateSelectors to make cells look differently depending on the value of the column-bound property.

    So for the CellTemplate, the example from the link is using this DataTemplate:

    <DataTemplate x:Key="zHighValueTemplate">
        <TextBlock ForeGround="Red" Text="{Binding bigint}" />
    </DataTemplate>

    The problem is that this Template uses the specific property (namely bigint) bound to the TextBlock.Text.

    That's great if I'd have to modify only a single column.

    However, I have a class that contains several integer properties which I want to show in GridView.

    For example:

    public class PersonScore
    {
        string Name { get; set; }
          
        int MaxScore { get; set; }
        int LastScore { get; set; }
        int IntervalScore { get; set; }
    }

    I have these two DataTemplates:

    <DataTemplate x:Key="scoringPositive"
        <StackPanel Orientation="Horizontal">
            <TextBlock ForeGround="Green" 
                Text="{Binding MaxScore, Converter={StaticResource scoringConverter}}" /> 
            <Image Source="/Scoring;component/Images/checkmark.png" 
                Visibility="{Binding MaxScore, Converter={StaticResource scoreToVisibilityConverter}}" 
                Margin="10,0,0,0" /> 
        </StackPanel>
    </DataTemplate>
      
    <DataTemplate x:Key="scoringNonPositive"
        <StackPanel Orientation="Horizontal">
            <TextBlock ForeGround="Red" 
                Text="{Binding MaxScore, Converter={StaticResource scoringConverter}}" /> 
            <Image Source="/Scoring;component/Images/exclamation.png" 
                Visibility="{Binding MaxScore, Converter={StaticResource scoreToVisibilityConverter}}"  
                Margin="10,0,0,0" /> 
        </StackPanel>
    </DataTemplate>

    So basically, if the MaxScore value is lower than 0, the cellTemplateSelector would chose the scoringNonPositive template, the TextBlock ForeGround would thus be Red and the Text set to whatever comes out of the scoringConverter. Additionaly, if the MaxScore is lower than 100, the Image's visibility would be set to Visible by the scoreToVisibilityConverter so that the exclamation mark is visible next to the score. 

    In other scenario, with MaxScore greater than or equal to 0, the text would be Green and checkmark image visible if MaxScore greater than 100, etc.

    This all works as intended.

    However, I have more than one property bound to the column. In worst-case scenario, I'd have to create dataTemplates for each specific property in my class (MaxScore, LastScore, IntervalScore) and I guess such repetition would be bad practice.

    Is there any way to write the DataTemplate so that it can choose the appropriate Property, depending on which column it is bound to? That means that I want to be able to create only 2 DataTemplates, since all of them behave the same, only the source property is different.

    (The example in this post is a dummy example, my real class has about 10 such properties, so it would require writing 20 DataTemplates which I'm trying to avoid here).

  2. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 30 Jan 2012 Link to this post

    Hello Kornelije Petak,

    You can still create the templates only once. You will just need to create two separate CellTemplateSelectors selectors.
    There is no problem for more than one selector to refer the same templates.

    Kind regards,
    Pavel Pavlov
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. Kornelije
    Kornelije avatar
    28 posts
    Member since:
    May 2011

    Posted 31 Jan 2012 Link to this post

    I believe you have misunderstood my problem.

    If I have a class with 10 properties which I wish to bind to the columns, I'd have to create 10 DataTemplates.

    If you look at my DataTemplate example code, you will see why. It's because the TextBlock's Text property is bound to the specific property of my PersonScore object. That is what I wish to avoid.

    If possible, I'd like to be able for the DataTemplate to define the binding to the cell value itself.

    Something like (which is not a valid SL XAML code) 

    <TextBlock Text="{Binding CellValue, Converter={StaticResource scoringConverter}}" />

    where CellValue would be whichever property bound for that specific column.

    I am not sure if that is possible at all, since I am not certain that the Binding for the Cell is aware of the column it belongs to, but I am not sure though.

    My problem could be described this way: I'd like to select a template based on a cell value itself (whichever property it's bound to). In other words, I want to chose a template (via CellTemplateSelector) depending on the value of the cell (whether text or some other type) and not on the specific Business Object Property. If possible, the CellTemplateSelector should not even know the underlying row type.

  4. Inian
    Inian avatar
    2 posts
    Member since:
    Apr 2009

    Posted 21 May 2012 Link to this post

    Kornelije,  I'm looking for a solution to the same problem? Did you find any?
Back to Top