Gráficos y visualización · jdashboardUI 23.5 · B4J / JavaFX
Timeline vertical interactivo para hitos, pasos y estados COMPLETED / ACTIVE / PENDING, con iconos, tarjetas y lados alternos.
La imagen mostrada en esta página es una referencia visual creada para la documentación. No pretende ser una captura pixel-perfect del control; el resultado real depende del tamaño, tema, colores y datos.
Características destacadas
- Estados de proceso
- Tarjetas e iconos
Cuándo usarlo
Timeline vertical interactivo para hitos, pasos y estados COMPLETED / ACTIVE / PENDING, con iconos, tarjetas y lados alternos.
Designer Properties
| Property | Type | Default | Description |
|---|---|---|---|
| LineStyle | String | SOLID |
SOLID or DASHED |
| LineColor | Color | #FF64748B |
Default connector line color |
| ActiveLineColor | Color | #FF22C55E |
Color for completed segments |
| LineWidth | Int | 2 |
Width of connector line (dip) |
| NodeSize | Int | 24 |
Diameter of each circle indicator (dip) |
| ItemSpacing | Int | 80 |
Vertical space between items (dip) |
| UseStatusColors | Boolean | False |
Apply Completed/Active/Pending colors automatically |
| ColorCompleted | Color | #FF22C55E |
Circle color for COMPLETED status |
| ColorActive | Color | #FFFDE047 |
Circle color for ACTIVE status |
| ColorPending | Color | #FF94A3B8 |
Circle color for PENDING status |
| DefaultNodeColor | Color | #FF334155 |
|
| DefaultNodeIconColor | Color | #FFFFFFFF |
|
| DefaultCardBgColor | Color | #FFFFFFFF |
|
| DefaultCardBorderColor | Color | #FFCBD5E1 |
|
| AlternateSides | Boolean | False |
Alternate cards left/right |
Creación y ciclo de vida
Private Timeline1 As JTimeLine
Timeline1.Initialize(Me, "Timeline1")
Timeline1.CreateTimeline(Root, 20dip, 20dip, Root.Width - 40dip, 500dip)
Ejemplo funcional
JTimeLine1.AddItem("08:00", "Order received", "Customer order created")
JTimeLine1.AddItem("09:15", "Preparing", "Warehouse is preparing items")
JTimeLine1.AddItem("11:30", "Shipped", "Package left the warehouse")
JTimeLine1.SetItemStatus(0, JTimeLine1.STATUS_COMPLETED)
JTimeLine1.SetItemStatus(1, JTimeLine1.STATUS_ACTIVE)
JTimeLine1.SetItemStatus(2, JTimeLine1.STATUS_PENDING)
JTimeLine1.Render
Propiedades B4X normalizadas
Los accesores públicos getX/setX compatibles se presentan como propiedades B4X normales. Los métodos parametrizados siguen documentándose como métodos.
| Propiedad | Acceso | Tipo |
|---|---|---|
| Base | read | B4XView |
Eventos
ItemClick(Index As Int, Title As String)StateChanged(PreviousState As String, NewState As String)
Exportación y renderizado
Este componente no expone una función pública de exportación PNG en la versión analizada.
Notas y comportamiento real de la versión analizada
- Constantes públicas de estado: STATUS_COMPLETED, STATUS_ACTIVE y STATUS_PENDING.
- Admite conectores SOLID / DASHED y tarjetas alternadas opcionales.
API pública completa
Initialize(Callback As Object, EventName As String)DesignerCreateView(Base As Object, Lbl As Label, Props As Map)CreateTimeline(Parent As B4XView, Left As Int, Top As Int, Width As Int, Height As Int)AddItem(YearOrDate As String, Title As String, Description As String = "", IconChar As String = "", IconFont As B4XFont = Null, IconColor As Int = 0)AddItemWithIcon(YearOrDate As String, Title As String, Description As String, IconChar As String, IconFont As B4XFont, IconColor As Int)AddItemCustom(YearOrDate As String, Title As String, Description As String, IconChar As String, IconFont As B4XFont, IconColor As Int, NodeBgColor As Int, CardBgColor As Int, TitleColor As Int, CardBorderColor As Int)getBase() As B4XViewScrollPanel() As B4XViewSetItemStatus(Index As Int, Status As String)Clear()Render()SetCurrentStep(StepIndex As Int)SetCurrentStepWithTimestamp(StepIndex As Int)
Componentes relacionados
- JStatusBarView
- JPanelProgressBar