This is a migrated thread and some comments may be shown as answers.

Control Template vs Colorizer

3 Answers 76 Views
TreeMap and PivotMap
This is a migrated thread and some comments may be shown as answers.
n/a
Top achievements
Rank 1
n/a asked on 13 Sep 2019, 08:50 AM

Hi,

I have a RadTreeMap that's working perfectly except that I want its labels to be centered vertically and horizontally within each rectangle.

I'm also using a Colorizer:

<telerik:TypeDefinition.Mappings>
      <telerik:DesaturationColorizer From="1" To="0.1" StartColor="#d9ac26"/>
</telerik:TypeDefinition.Mappings>

...so, when I attempt to change use a TextBlock with the proper alignment:

<Style TargetType="telerik:RadTreeMapItem">

     <Setter Property="Template">
           <Setter.Value>
                <ControlTemplate>
                     <TextBlock Text="{Binding Label}" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
                 </ControlTemplate>
            </Setter.Value>
       </Setter>
</Style>

...it successfully centers the labels, but I lose the colorizing effect. How can I make the TextBlock respect the intended colorizing?

Wayne

3 Answers, 1 is accepted

Sort by
0
n/a
Top achievements
Rank 1
answered on 14 Sep 2019, 03:40 AM

Also, if I may tack on one other request, I'd like to modify the labels, too, as my dataset returns a bit more information than just the label itself (i.e. prior year value and period-over-period change %). If it's not possible to alter the label content, I'd settle for an informative tooltip instead.

Wayne

0
Dilyan Traykov
Telerik team
answered on 17 Sep 2019, 03:57 PM

Hi Wayne,

To add more information apart from the labels, you can use the DefaultItemTemplate property of the control and show any property of the items you choose. Here's an example:

            <telerik:RadTreeMap.DefaultItemTemplate>
                <HierarchicalDataTemplate ItemsSource="{Binding Children}">
                    <StackPanel>
                        <TextBlock Text="{Binding Label}" TextWrapping="Wrap" Effect="{Binding Path=HeaderEffect, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type telerik:RadTreeMapItem}}}"/>
                        <TextBlock Text="{Binding DataItem.EmployeesCount}" />
                    </StackPanel>
                </HierarchicalDataTemplate>
            </telerik:RadTreeMap.DefaultItemTemplate>
As for the loss of the colors of the items, I would recommend using the implicit styles approach for theming the controls in this case and base the style in which you define the control template on the RadTreeMapItemStyle.

Simply replacing the template with a TextBlock, however, will remove most of the functionality of the control and I would not recommend that. The suggested approach would be to extract the default control template of the control for the given theme and modify it (possibly without removing any elements).

For your convenience, I've extracted the default control template for the Office_Black theme which you can use as a base, should you find it helpful. Please note that this project requires the NoXaml binaries in order to run.

Please let me know if you find this information helpful and if I can further assist you with anything else.

Regards,
Dilyan Traykov
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
n/a
Top achievements
Rank 1
answered on 21 Sep 2019, 07:23 AM

Sorry for the delay. This solution did indeed solve my problem, so thanks very much!

Wayne

Tags
TreeMap and PivotMap
Asked by
n/a
Top achievements
Rank 1
Answers by
n/a
Top achievements
Rank 1
Dilyan Traykov
Telerik team
Share this question
or