Class TimelineItem

A class that represents items of SfTimeline component.

Inheritance
System.Object
TimelineItem
Namespace: Syncfusion.Blazor.Layouts
Assembly: Syncfusion.Blazor.dll
Syntax
public class TimelineItem : OwningComponentBase

Constructors

TimelineItem()

Declaration
public TimelineItem()

Properties

Content

Gets or sets the custom content template for rendering individual items in the SfTimeline component.

Declaration
public RenderFragment<TimelineItemContext> Content { get; set; }
Property Value
Type Description
Microsoft.AspNetCore.Components.RenderFragment<TimelineItemContext>

The template content. The default value is null.
Remarks

The TimelineItem allows you to define a custom content template for rendering each item. Use the content’s context parameter to access Item and ItemIndex properties.

Examples
<SfTimeline>
   <TimelineItems>
       <TimelineItem>
           <Content>Ordered</Content>
       </TimelineItem>
       <TimelineItem>
           <Content>Processing</Content>
       </TimelineItem>
       <TimelineItem>
           <Content>Shipped</Content>
       </TimelineItem>
       <TimelineItem>
           <Content>Delivered</Content>
       </TimelineItem>
   </TimelineItems>
</SfTimeline>

CssClass

Gets or sets the custom CSS class for customize the appearance of timeline item.

Declaration
public string CssClass { get; set; }
Property Value
Type Description
System.String

A string representing the CSS class to be applied to the item. The default value is an empty string.
Remarks

You can use this property to apply custom styles to individual items within the Timeline component by specifying a CSS class.

Disabled

Gets or sets a value indicating whether the timeline item is disabled.

Declaration
public bool Disabled { get; set; }
Property Value
Type Description
System.Boolean

true if the item is disabled; otherwise, false. The default value is false.

DotCss

Gets or sets the CSS class for the icon associated with the TimelineItem.

Declaration
public string DotCss { get; set; }
Property Value
Type Description
System.String

A string representing the CSS class for the icon. The default value is an empty string.
Remarks

The icon CSS class is used to style the icon displayed for the timeline item. If specified, it determines the visual representation of the item.

OppositeContent

Gets or sets the custom opposite text content template for rendering individual items in the SfTimeline component.

Declaration
public RenderFragment<TimelineItemContext> OppositeContent { get; set; }
Property Value
Type Description
Microsoft.AspNetCore.Components.RenderFragment<TimelineItemContext>

The template content. The default value is null.
Remarks

The TimelineItem allows you to define a custom opposite text content template for rendering each item. Use the oppositeContent’s context parameter to access Item and ItemIndex properties.

Examples
<SfTimeline>
   <TimelineItems>
       <TimelineItem>
           <Content>Ordered</Content>
           <OppositeContent>10:30 am</OppositeContent>
       </TimelineItem>
       <TimelineItem>
           <Content>Processing</Content>
           <OppositeContent>11:30 am</OppositeContent>
       </TimelineItem>
       <TimelineItem>
           <Content>Shipped</Content>
           <OppositeContent>12:30 am</OppositeContent>
       </TimelineItem>
       <TimelineItem>
           <Content>Delivered</Content>
           <OppositeContent>01:30 am</OppositeContent>
       </TimelineItem>
   </TimelineItems>
</SfTimeline>

Methods

Dispose(Boolean)

Declaration
protected override void Dispose(bool disposing)
Parameters
Type Name Description
System.Boolean disposing

OnAfterRender(Boolean)

Declaration
protected override void OnAfterRender(bool firstRender)
Parameters
Type Name Description
System.Boolean firstRender

OnInitializedAsync()

Declaration
protected override Task OnInitializedAsync()
Returns
Type
System.Threading.Tasks.Task

OnParametersSetAsync()

Declaration
protected override Task OnParametersSetAsync()
Returns
Type
System.Threading.Tasks.Task