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

Hiding Timeline period control

2 Answers 5 Views
TimeLine
This is a migrated thread and some comments may be shown as answers.
Alexey
Top achievements
Rank 1
Alexey asked on 10 Apr 2017, 01:07 PM

Hello,

I am investigating the Timeline control to determine if we are able to use it for our project.

The first problem I am getting stuck on is I can't find a way to hide the period control.

I am playing with a simple example.

http://joxi.ru/GrqyRELhQVpbGr

There is a form that shows a period information that I don't need to have.

I am trying to use styles to hide it.

        <Style TargetType="telerik:TimelineGroupPeriodControl" >
            <Setter Property="Height" Value="0" />
            <Setter Property="Visibility" Value="Collapsed" />
        </Style>
        <Style TargetType="telerik:TimelinePeriodControl" >
            <Setter Property="Height" Value="0" />
            <Setter Property="Visibility" Value="Collapsed" />
        </Style>

http://joxi.ru/VrwMkLqtObZgY2

The period control is hidden but the place is still occupied.

Is that any solution that would work for me?

 

Thanks

 

 

2 Answers, 1 is accepted

Sort by
0
Martin Ivanov
Telerik team
answered on 11 Apr 2017, 07:42 AM
Hello Alexey,

There space between the timeline items and the top border of the control is there because the panel that holds the items has a padding set. This padding tells the container to position itself below the time periods. To position the timeline items on top of the control, you can target the TimelineItemContainer element using an implicit style, as you already doing for hiding the periods. And then set the Padding of its items panel to 0, or whatever value works for you. 

Here is an example in code:
<Style TargetType="telerik:TimelineItemContainer">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <telerik:TimelineItemGroupsPanel Padding="0" />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
</Style>

Regards,
Martin
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Alexey
Top achievements
Rank 1
answered on 11 Apr 2017, 12:07 PM
Thank  Martin. Works for me.
Tags
TimeLine
Asked by
Alexey
Top achievements
Rank 1
Answers by
Martin Ivanov
Telerik team
Alexey
Top achievements
Rank 1
Share this question
or